Theaninova/openstapps
1
0
Fork 0
mirror of https://gitlab.com/openstapps/openstapps.git synced 2026-03-17 04:02:30 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: add stylelint

Browse Source
This commit is contained in:
Thea Schöbl
2023-07-18 15:24:15 +02:00
parent b085850207
commit d3268b50c2
89 changed files with 1436 additions and 801 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/app/.eslintrc.json
View File

@@ -53,6 +53,7 @@
"jsdoc/require-param-type": "off",
"jsdoc/require-returns-type": "off",
"@typescript-eslint/explicit-module-boundary-types": "off",
"@typescript-eslint/no-non-null-assertion": "off",
"@typescript-eslint/no-unused-vars": [
"error",
{

17
frontend/app/.stylelintrc Normal file
View File

@@ -0,0 +1,17 @@
{
"extends": [
"stylelint-config-standard-scss",
"stylelint-config-recommended-scss",
"stylelint-config-clean-order",
"stylelint-config-prettier-scss"
],
"rules": {
"no-empty-source": null,
"selector-pseudo-element-no-unknown": [
true,
{
"ignorePseudoElements": ["ng-deep"]
}
]
}
}

13
frontend/app/package.json
View File

@@ -34,8 +34,8 @@
"format": "prettier . -c --ignore-path ../../.gitignore",
"format:fix": "prettier --write . --ignore-path ../../.gitignore",
"licenses": "license-checker --json > src/assets/about/licenses.json && ts-node ./scripts/accumulate-licenses.ts && git add src/assets/about/licenses.json",
"lint": "ng lint",
"lint:fix": "eslint --fix -c .eslintrc.json --ignore-path .eslintignore --ext .ts,.html src/",
"lint": "ng lint && stylelint \"**/*.scss\"",
"lint:fix": "eslint --fix -c .eslintrc.json --ignore-path .eslintignore --ext .ts,.html src/ && stylelint --fix \"**/*.scss\"",
"minify-icons": "ts-node-esm scripts/minify-icon-font.ts",
"ng": "ng",
"postinstall": "(jetify && node ngcc-postinstall.mjs) || echo \"skipping jetify in production mode\"",
@@ -158,12 +158,17 @@
"junit-report-merger": "6.0.2",
"karma": "6.4.1",
"karma-chrome-launcher": "3.1.1",
"karma-junit-reporter": "2.0.1",
"karma-coverage": "2.2.1",
"karma-mocha-reporter": "2.2.5",
"karma-jasmine": "5.1.0",
"karma-junit-reporter": "2.0.1",
"karma-mocha-reporter": "2.2.5",
"license-checker": "25.0.1",
"protractor": "7.0.0",
"stylelint": "15.10.1",
"stylelint-config-clean-order": "5.0.1",
"stylelint-config-prettier-scss": "1.0.0",
"stylelint-config-recommended-scss": "12.0.0",
"stylelint-config-standard-scss": "10.0.0",
"surge": "0.23.1",
"ts-node": "10.9.1",
"typescript": "4.6.4",

2
frontend/app/src/app/modules/about/about-license-modal.scss
View File

@@ -16,8 +16,8 @@
ion-card-header {
ion-button {
position: absolute;
right: 0;
top: 0;
right: 0;
}
}

4
frontend/app/src/app/modules/about/about-licenses.scss
View File

@@ -17,8 +17,8 @@ ion-content > div {
}
cdk-virtual-scroll-viewport {
height: 100%;
width: 100%;
height: 100%;
}
:host ::ng-deep {
@@ -32,6 +32,6 @@ cdk-virtual-scroll-viewport {
}
.supertext-icon {
vertical-align: text-top;
height: 14px;
vertical-align: text-top;
}

91
frontend/app/src/app/modules/about/about-page/about-page.scss
View File

@@ -12,42 +12,14 @@
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
@import 'src/theme/util/_mixins.scss';
@import '~src/theme/util/mixins';
ion-text {
margin-inline: var(--spacing-md);
color: var(--ion-color-primary-contrast);
}
:host ::ng-deep {
ion-card {
margin: 0;
box-shadow: none;
ion-card-content {
h1 {
margin: 0;
}
padding-bottom: 8px;
}
ion-card-header {
color: var(--ion-color-dark);
padding-top: 8px;
padding-bottom: 4px;
font-weight: bold;
}
ion-grid,
ion-col {
padding-inline-start: 0;
padding-top: 0;
padding-bottom: 0;
}
}
ion-grid,
ion-col {
padding-inline-start: 0;
padding-top: 0;
padding-bottom: 0;
}
p,
h3,
h2,
@@ -55,37 +27,70 @@ ion-text {
margin-inline: var(--spacing-md);
}
ion-grid,
ion-col {
padding-top: 0;
padding-bottom: 0;
padding-inline-start: 0;
}
ion-card {
margin: 0;
box-shadow: none;
ion-card-content {
padding-bottom: 8px;
h1 {
margin: 0;
}
}
ion-card-header {
padding-top: 8px;
padding-bottom: 4px;
font-weight: bold;
color: var(--ion-color-dark);
}
ion-grid,
ion-col {
padding-top: 0;
padding-bottom: 0;
padding-inline-start: 0;
}
}
.about-changelog,
.licenses-content,
.page-content {
margin: var(--spacing-md);
@include border-radius-in-parallax(var(--border-radius-default));
display: flex;
flex-direction: column;
gap: var(--spacing-sm);
margin: var(--spacing-md);
padding-block-end: var(--spacing-md);
background: var(--ion-item-background);
padding-block-end: var(--spacing-md);
& > * {
@include border-radius-in-parallax(var(--border-radius-default));
& > * {
position: relative;
overflow: hidden;
display: block;
margin: 0;
ion-card-subtitle {
font-size: var(--font-size-lg);
color: var(--ion-color-light-contrast);
}
display: block;
@include border-radius-in-parallax(var(--border-radius-default));
overflow: hidden;
position: relative;
margin: 0;
& > ion-thumbnail {
background: var(--ion-color-primary);
}
}
}
}
ion-text {
color: var(--ion-color-primary-contrast);
}

3
frontend/app/src/app/modules/assessments/page/assessments-page.scss
View File

@@ -14,7 +14,8 @@
*/
.content {
--ion-item-background: var(--ion-background-color);
height: 100%;
padding-inline: 8px;
--ion-item-background: var(--ion-background-color);
}

2
frontend/app/src/app/modules/assessments/types/assessment/assessment-detail.scss
View File

@@ -1,4 +1,4 @@
stapps-data-list {
height: 100px;
width: 100%;
height: 100px;
}

2
frontend/app/src/app/modules/auth/auth-callback/page/auth-callback-page.component.html
View File

@@ -13,7 +13,7 @@
~ this program. If not, see <https://www.gnu.org/licenses/>.
-->
<div class="centeredMessageContainer">
<div class="centered-message-container">
<p>
{{ 'auth.messages' + '.' + PROVIDER_TYPE + '.' + 'authorizing' | translate }}
</p>

13
frontend/app/src/app/modules/calendar/add-event-review-modal.scss
View File

@@ -1,29 +1,30 @@
div {
height: 100%;
display: flex;
flex-direction: column;
align-items: stretch;
height: 100%;
ion-card-header {
ion-button {
position: absolute;
right: 0;
top: 0;
right: 0;
}
}
ion-card-content {
height: 100%;
overflow: scroll;
padding-left: 0;
height: 100%;
padding-right: 0;
padding-left: 0;
}
}
.horizontal-flex {
height: fit-content;
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
justify-content: flex-end;
height: fit-content;
}

83
frontend/app/src/app/modules/dashboard/dashboard.component.scss
View File

@@ -22,12 +22,13 @@
:host ion-toolbar:last-of-type {
--padding-top: var(--spacing-md);
--padding-bottom: var(--spacing-md);
z-index: -1;
ion-icon {
margin-right: var(--spacing-sm);
width: var(--font-size-xl);
height: var(--font-size-xl);
margin-right: var(--spacing-sm);
}
ion-label {
@@ -37,71 +38,81 @@
}
.logo {
aspect-ratio: 1/1;
width: 27vw;
max-width: 150px;
max-height: 80px;
aspect-ratio: 1/1;
object-position: right;
margin-left: auto;
margin-right: 0;
margin-left: auto;
object-position: right;
}
}
ion-content {
--background: var(--ion-background-color);
--padding-bottom: var(--spacing-xl);
&::part(inner-scroll) {
scrollbar-gutter: stable;
}
}
.schedule {
width: 100%;
z-index: 3;
background: var(--ion-color-primary);
color: var(--ion-color-primary-contrast);
display: flex;
justify-content: space-between;
gap: var(--spacing-md);
padding: var(--spacing-sm);
padding-top: 0;
@include ion-md-up {
position: unset;
width: unset;
height: calc(var(--tablet-top-bar-height) + (2 * var(--spacing-xl)));
margin: 0;
padding: var(--spacing-xl);
}
z-index: 3;
display: flex;
gap: var(--spacing-md);
justify-content: space-between;
width: 100%;
padding: var(--spacing-sm);
padding-top: 0;
color: var(--ion-color-primary-contrast);
background: var(--ion-color-primary);
a {
display: flex;
flex-direction: column;
color: var(--ion-color-primary-contrast);
text-decoration: none;
height: auto;
padding: var(--spacing-lg);
color: var(--ion-color-primary-contrast);
text-decoration: none;
border-radius: var(--border-radius-default);
}
a:first-child {
text-align: center;
flex: 0 0 auto;
aspect-ratio: 1;
box-sizing: content-box;
max-height: 60px;
overflow: hidden;
border: 2px solid var(--ion-color-primary-tint);
@include phoneLandscape {
@include phone-landscape {
height: auto;
}
}
a:first-child {
justify-content: space-around;
align-items: center;
overflow: hidden;
flex: 0 0 auto;
gap: var(--spacing-sm);
align-items: center;
justify-content: space-around;
box-sizing: content-box;
aspect-ratio: 1;
max-height: 60px;
text-align: center;
border: 2px solid var(--ion-color-primary-tint);
ion-label {
font-size: var(--font-size-xxs);
@@ -114,19 +125,19 @@ ion-content {
}
a:last-child {
flex: 1 1 65%;
background: var(--linear-gradient);
justify-content: center;
z-index: 1;
@include ion-md-up {
flex: 1 1 100%;
}
@include phoneLandscape {
@include phone-landscape {
flex: 1 1 85%;
}
z-index: 1;
flex: 1 1 65%;
justify-content: center;
background: var(--linear-gradient);
ion-label {
font-size: var(--font-size-xxs);
font-weight: var(--font-weight-bold);
@@ -134,8 +145,8 @@ ion-content {
}
ion-label:first-child {
text-transform: uppercase;
color: var(--ion-color-secondary);
text-transform: uppercase;
}
ion-label:nth-child(2n) {

2
frontend/app/src/app/modules/dashboard/sections/favorites-section/favorites-section.component.scss
View File

@@ -14,8 +14,8 @@
*/
.nothing-selected::part(native) {
background: none;
color: var(--ion-color-medium-shade);
background: none;
}
simple-swiper {

2
frontend/app/src/app/modules/dashboard/sections/mensa-section/mensa-section-content.component.scss
View File

@@ -14,8 +14,8 @@
*/
.no-dishes::part(native) {
background: none;
color: var(--ion-color-medium-shade);
background: none;
}
simple-swiper {

2
frontend/app/src/app/modules/dashboard/sections/mensa-section/mensa-section.component.scss
View File

@@ -19,8 +19,8 @@ stapps-mensa-section-content {
}
.nothing-selected::part(native) {
background: none;
color: var(--ion-color-medium-shade);
background: none;
}
:host {

16
frontend/app/src/app/modules/dashboard/sections/news-section/news-section.component.scss
View File

@@ -17,9 +17,10 @@ simple-swiper {
}
.more-news {
font-size: var(--font-size-xl);
--color: var(--ion-color-medium-tint);
font-size: var(--font-size-xl);
&::part(native) {
height: 100%;
background: none;
@@ -34,11 +35,12 @@ simple-swiper {
ion-thumbnail {
position: absolute;
z-index: 100;
bottom: 0;
left: 0;
z-index: 100;
height: 200px;
width: 200px;
height: 200px;
}
}
@@ -54,16 +56,18 @@ simple-swiper {
}
ion-col {
flex-grow: 0;
flex-basis: min-content;
flex-grow: 0;
}
.title {
overflow: hidden;
display: -webkit-box;
white-space: break-spaces;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
}
.title-sub {
@@ -73,8 +77,8 @@ simple-swiper {
// fix for Safari
stapps-offers-in-list {
position: absolute;
bottom: 0;
right: 0;
bottom: 0;
}
stapps-offers-in-list .place {

3
frontend/app/src/app/modules/dashboard/sections/search-section/search-section.component.scss
View File

@@ -27,11 +27,12 @@ ion-searchbar ::ng-deep .searchbar-input-container {
}
ion-searchbar.ios {
transition: opacity 150ms ease;
ion-ripple-effect {
display: none;
}
transition: opacity 150ms ease;
&:active {
opacity: 0.6;
}

11
frontend/app/src/app/modules/data/chips/edit-event-selection.scss
View File

@@ -12,11 +12,6 @@
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
ion-item-divider.ios > ion-checkbox {
margin-right: 8px;
}
.list-header {
--padding-start: 0;
--background: var(--ion-color-primary-shade);
@@ -28,13 +23,17 @@ ion-item-divider.ios > ion-checkbox {
> ion-checkbox {
--background: none;
--border-color: rgba(var(--ion-color-primary-contrast-rgb), 0.77);
--border-color: rgb(var(--ion-color-primary-contrast-rgb) 0.77);
--background-checked: var(--ion-color-primary-contrast);
--border-color-checked: var(--ion-color-primary-contrast);
--checkmark-color: var(--ion-color-primary);
}
}
ion-item-divider.ios > ion-checkbox {
margin-right: 8px;
}
:host > .list-header {
--background: none;
}

47
frontend/app/src/app/modules/data/detail/data-detail-content.scss
View File

@@ -12,7 +12,7 @@
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
@import 'src/theme/util/_mixins.scss';
@import '~src/theme/util/mixins';
stapps-origin-detail {
// css hack to make the element stick to the bottom of the scroll container even
@@ -22,24 +22,29 @@ stapps-origin-detail {
}
.content-switch {
display: flex;
flex: 1;
// prevent a scrollbar from appearing in some cases
margin-block-start: -1px !important;
flex: 1;
display: flex;
padding: 0 var(--spacing-md);
::ng-deep > * {
display: flex;
height: fit-content;
width: 100%;
flex-direction: column;
@include border-radius-in-parallax(var(--border-radius-default));
overflow: hidden;
@include content-padding;
position: relative;
overflow: hidden;
display: flex;
flex-direction: column;
width: 100%;
height: fit-content;
margin-block-start: calc((var(--header-spacing-bottom) - var(--spacing-xl)) * -1);
margin-block-end: var(--spacing-xl);
background-color: var(--ion-card-background);
@include content-padding();
& > ion-thumbnail {
background: var(--ion-color-primary);
@@ -49,45 +54,51 @@ stapps-origin-detail {
@supports selector(:has(*)) {
& > .expand-when-space,
&:has(> .expand-when-space) {
height: unset;
flex: 1;
height: unset;
}
}
}
}
:host ::ng-deep {
ion-grid,
ion-col {
padding-top: 0;
padding-bottom: 0;
padding-inline-start: 0;
}
ion-slides.work-locations {
ion-slide {
display: block;
text-align: left;
}
}
ion-card {
margin: 0;
box-shadow: none;
ion-card-content {
padding-bottom: 8px;
h1 {
margin: 0;
}
padding-bottom: 8px;
}
ion-card-header {
padding-top: 8px;
padding-bottom: 4px;
font-weight: bold;
}
ion-grid,
ion-col {
padding-inline-start: 0;
padding-top: 0;
padding-bottom: 0;
}
}
ion-grid,
ion-col {
padding-inline-start: 0;
padding-top: 0;
padding-bottom: 0;
}
}
}

4
frontend/app/src/app/modules/data/detail/data-detail.html
View File

@@ -33,13 +33,13 @@
<ion-content parallax class="ion-no-padding">
<ng-container [ngSwitch]="true">
<ng-container *ngSwitchCase="!item && (isDisconnected | async)">
<div class="centeredMessageContainer">
<div class="centered-message-container">
<ion-icon name="signal_disconnected"></ion-icon>
<ion-label> {{ 'data.detail.COULD_NOT_CONNECT' | translate }} </ion-label>
</div>
</ng-container>
<ng-container *ngSwitchCase="item === null">
<div class="centeredMessageContainer">
<div class="centered-message-container">
<ion-icon name="link_off"></ion-icon>
<ion-label> {{ 'data.detail.NOT_FOUND' | translate }} </ion-label>
</div>

4
frontend/app/src/app/modules/data/detail/data-detail.scss
View File

@@ -14,8 +14,8 @@
*/
ion-content > div > stapps-data-detail-content,
ion-content > div {
min-height: 100%;
display: flex;
flex-direction: column;
flex: 1;
flex-direction: column;
min-height: 100%;
}

6
frontend/app/src/app/modules/data/detail/data-path.scss
View File

@@ -13,10 +13,10 @@
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
.crumb-label {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
cursor: pointer;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
ion-breadcrumb {

5
frontend/app/src/app/modules/data/elements/external-link.scss
View File

@@ -1,8 +1,9 @@
:host a {
cursor: pointer;
ion-icon {
vertical-align: text-top;
font-size: 80%;
padding-left: 2px;
font-size: 80%;
vertical-align: text-top;
}
}

13
frontend/app/src/app/modules/data/elements/favorite-button.component.scss
View File

@@ -15,9 +15,15 @@
:host {
ion-button {
--border-radius: 50%;
width: 50px;
height: 50px;
--border-radius: 50%;
}
.selected {
// TODO
color: #fbc02d;
}
@media (hover: hover) {
@@ -25,9 +31,4 @@
--fill: 1;
}
}
.selected {
// TODO
color: #fbc02d;
}
}

98
frontend/app/src/app/modules/data/elements/rating.scss
View File

@@ -12,51 +12,6 @@
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
.rating-stars {
display: flex;
contain: content;
flex-direction: row-reverse;
justify-content: start;
align-items: center;
position: absolute;
background: var(--ion-color-light);
bottom: 0;
right: 0;
top: 0;
gap: var(--spacing-md);
padding-inline: var(--spacing-xl);
border-radius: var(--border-radius-default);
> ion-icon {
@media (hover: hover) {
&:hover ~ *::ng-deep stapps-icon,
&:hover::ng-deep stapps-icon {
--fill: 1;
}
}
&:has(:checked)::ng-deep ~ *::ng-deep stapps-icon,
&:has(:checked)::ng-deep stapps-icon,
&:active::ng-deep ~ *::ng-deep stapps-icon,
&:active::ng-deep stapps-icon {
--fill: 1;
color: var(--ion-color-dark);
}
}
> .thank-you {
opacity: 0;
pointer-events: none;
position: absolute;
right: 0;
top: 0;
bottom: 0;
padding: var(--spacing-md);
display: flex;
justify-content: center;
align-items: center;
}
}
ion-button {
margin: 0;
@@ -64,3 +19,56 @@ ion-button {
--fill: 1;
}
}
.rating-stars {
position: absolute;
top: 0;
right: 0;
bottom: 0;
contain: content;
display: flex;
flex-direction: row-reverse;
gap: var(--spacing-md);
align-items: center;
justify-content: flex-start;
padding-inline: var(--spacing-xl);
background: var(--ion-color-light);
border-radius: var(--border-radius-default);
> ion-icon {
&:active::ng-deep stapps-icon,
&:has(:checked)::ng-deep stapps-icon,
&:has(:checked)::ng-deep ~ *::ng-deep stapps-icon,
&:active::ng-deep ~ *::ng-deep stapps-icon {
--fill: 1;
color: var(--ion-color-dark);
}
@media (hover: hover) {
&:hover ~ *::ng-deep stapps-icon,
&:hover::ng-deep stapps-icon {
--fill: 1;
}
}
}
> .thank-you {
pointer-events: none;
position: absolute;
top: 0;
right: 0;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
padding: var(--spacing-md);
opacity: 0;
}
}

2
frontend/app/src/app/modules/data/elements/title-card.component.html
View File

@@ -27,7 +27,7 @@
</ion-card-title>
</ion-card-header>
<ion-card-content>
<div *ngIf="$any(item).openingHours" class="openingHours">
<div *ngIf="$any(item).openingHours" class="opening-hours">
<stapps-opening-hours [openingHours]="item.openingHours"></stapps-opening-hours>
</div>
<div *ngIf="item.description" class="description">

13
frontend/app/src/app/modules/data/elements/title-card.component.scss
View File

@@ -15,23 +15,25 @@
.text-accordion {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
}
ion-card {
border-radius: 0;
--background: var(--ion-color-primary);
padding: 0 var(--spacing-md);
border-radius: 0;
ion-card-header {
padding: 0;
h1 {
color: var(--ion-color-primary-contrast);
font-weight: var(--font-weight-bold);
margin: var(--spacing-sm) 0 var(--spacing-sm) 0;
font-weight: var(--font-weight-bold);
color: var(--ion-color-primary-contrast);
}
}
@@ -41,7 +43,8 @@ ion-card {
.description * {
color: var(--ion-color-primary-contrast);
}
.openingHours {
.opening-hours {
color: var(--ion-color-primary-contrast);
}
}

34
frontend/app/src/app/modules/data/list/data-list-item.scss
View File

@@ -12,7 +12,7 @@
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
@import 'src/theme/util/_mixins.scss';
@import '~src/theme/util/mixins';
:host {
display: block;
@@ -22,19 +22,13 @@ ion-item::part(native) {
height: 100%;
}
.ion-text-wrap ::ng-deep ion-label {
white-space: normal !important;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
ion-item {
--border-color: transparent;
@include border-radius-in-parallax(var(--border-radius-default));
overflow: hidden;
--inner-padding-end: 0;
--padding-start: 0;
@include border-radius-in-parallax(var(--border-radius-default));
overflow: hidden;
margin: var(--spacing-sm);
ion-thumbnail {
@@ -53,6 +47,14 @@ ion-item {
}
}
.ion-text-wrap ::ng-deep ion-label {
display: -webkit-box;
white-space: normal !important;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
:host.square ::ng-deep {
ion-item {
margin: 0;
@@ -65,17 +67,19 @@ ion-item {
}
ion-col {
flex-grow: 0;
flex-basis: min-content;
flex-grow: 0;
}
stapps-long-inline-text,
.title {
overflow: hidden;
display: -webkit-box;
white-space: break-spaces;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
.title-sub {
@@ -85,8 +89,8 @@ ion-item {
stapps-rating,
stapps-favorite-button {
position: absolute;
bottom: 0;
right: 0;
bottom: 0;
}
stapps-rating {
@@ -97,9 +101,9 @@ ion-item {
}
.rating-stars {
width: 100%;
justify-content: center;
gap: var(--spacing-xs);
justify-content: center;
width: 100%;
padding-inline: 0;
}
}

2
frontend/app/src/app/modules/data/list/data-list.html
View File

@@ -27,7 +27,7 @@
</ion-list>
</ng-container>
<div [style.display]="!loading && items && items.length === 0 ? 'block' : 'none'">
<ion-label class="centeredMessageContainer">
<ion-label class="centered-message-container">
{{ 'search.nothing_found' | translate | titlecase }}
</ion-label>
</div>

2
frontend/app/src/app/modules/data/list/search-page.html
View File

@@ -60,7 +60,7 @@
[class.no-results]="!showDefaultData && !items && !loading"
[style.display]="!showDefaultData && !items && !loading ? 'block' : 'none'"
>
<ion-label class="centeredMessageContainer"> {{ searchInstruction | translate }} </ion-label>
<ion-label class="centered-message-container"> {{ searchInstruction | translate }} </ion-label>
</div>
<stapps-data-list
id="data-list"

14
frontend/app/src/app/modules/data/list/search-page.scss
View File

@@ -15,11 +15,15 @@
:host {
display: flex;
flex-direction: column;
flex: 1 1 100%;
flex-direction: column;
height: 100%;
}
ion-toolbar {
--ion-color-base: none !important;
}
ion-toolbar:first-of-type {
padding: 0 var(--spacing-md) var(--spacing-xs);
}
@@ -43,9 +47,9 @@ ion-content {
.content > div {
height: 100%;
ion-label.centeredMessageContainer {
min-height: unset;
ion-label.centered-message-container {
height: 100%;
min-height: unset;
margin-top: 0;
margin-bottom: 0;
}
@@ -54,7 +58,3 @@ ion-content {
ion-header {
background: var(--ion-color-primary);
}
ion-toolbar {
--ion-color-base: none !important;
}

6
frontend/app/src/app/modules/data/list/simple-data-list.scss
View File

@@ -15,8 +15,10 @@
.empty-list-message {
display: flex;
justify-content: center;
align-items: center;
color: var(--ion-color-medium);
justify-content: center;
min-height: 300px;
color: var(--ion-color-medium);
}

6
frontend/app/src/app/modules/data/list/skeleton-list.scss
View File

@@ -21,14 +21,16 @@ $item-height: 92;
$gap: 4;
.label {
fill: var(--ion-color-medium);
opacity: 0.1;
fill: var(--ion-color-medium);
}
.item {
width: calc(100% - var(--spacing-sm) * 2);
rx: var(--border-radius-default);
fill: var(--ion-item-background, var(--ion-background-color, #fff));
x: var(--spacing-sm);
y: var(--spacing-sm);
width: calc(100% - var(--spacing-sm) * 2);
}

22
frontend/app/src/app/modules/data/list/tree-list-fragment.scss
View File

@@ -22,37 +22,36 @@ ion-list {
}
.tree-indicator {
overflow: hidden;
position: relative;
overflow: hidden;
}
ion-accordion::before,
.tree-indicator::before,
.tree-indicator::after {
content: '';
position: absolute;
z-index: 1000;
left: 0;
display: block;
background-color: grey;
z-index: 1000;
position: absolute;
left: 0;
}
ion-accordion::before,
.tree-indicator::before {
height: 100%;
width: 1px;
top: 0;
width: 1px;
height: 100%;
}
.tree-indicator::after {
top: 50%;
transform: translateX(calc(-50% - 8px));
width: 40px;
height: 1px;
transform: translateX(calc(-50% - 8px));
top: 50%;
}
ion-accordion::after {
@@ -62,6 +61,7 @@ ion-accordion::after {
ion-accordion:last-of-type::before {
height: 24px;
}
.tree-indicator:last-of-type::before {
height: 50%;
}

5
frontend/app/src/app/modules/data/types/date-series/date-series-list-item.scss
View File

@@ -1,8 +1,9 @@
.remove-button {
--color: var(--ion-color-success);
--border-color: var(--ion-color-success);
&:hover {
--color-hover: var(--ion-color-danger);
--border-color: var(--ion-color-danger);
}
--color: var(--ion-color-success);
--border-color: var(--ion-color-success);
}

13
frontend/app/src/app/modules/data/types/dish/dish-characteristics.scss
View File

@@ -15,11 +15,12 @@
$size: 16px;
ion-note {
list-style: none;
display: flex;
flex-direction: row-reverse;
align-items: center;
justify-content: flex-start;
justify-content: flex-end;
list-style: none;
}
abbr {
@@ -27,16 +28,16 @@ abbr {
}
.mask-image {
width: $size;
aspect-ratio: 1;
width: $size;
background: var(--ion-color-medium);
mask-image: var(--background-url);
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
mask-mode: alpha;
mask-position: center;
mask-repeat: no-repeat;
mask-size: contain;
}
img {

14
frontend/app/src/app/modules/data/types/message/message-detail-content.scss
View File

@@ -16,13 +16,16 @@
:host {
ion-thumbnail {
position: relative;
transform: scaleX(-1);
overflow: hidden;
width: 100%;
height: auto;
margin-inline: auto;
overflow: hidden;
background-size: contain;
background-position: center;
transform: scaleX(-1);
background-size: contain;
ion-img {
backdrop-filter: blur(32px);
@@ -30,15 +33,16 @@
&::part(image) {
transform: scaleX(-1);
max-width: 16cm;
object-fit: contain;
margin-inline: auto;
object-fit: contain;
}
}
}
.date-published {
--ion-card-color: var(--ion-color-medium-shade);
text-transform: uppercase;
font-weight: var(--font-weight-semi-bold);
text-transform: uppercase;
}
}

2
frontend/app/src/app/modules/data/types/place/place-detail-content.scss
View File

@@ -15,7 +15,7 @@
.map-widget {
position: relative;
width: auto;
height: 300px;
min-height: 300px;
width: auto;
}

5
frontend/app/src/app/modules/data/types/place/place-list-item.scss
View File

@@ -18,8 +18,8 @@ ion-note {
> ion-label {
display: inline-flex;
justify-content: center;
align-items: center;
justify-content: center;
}
}
@@ -30,7 +30,6 @@ ion-label + ion-label.distance::before {
.in-place {
display: flex;
justify-content: flex-end;
align-items: center;
justify-content: flex-end;
}

4
frontend/app/src/app/modules/data/types/place/special/mensa/place-mensa.scss
View File

@@ -18,14 +18,14 @@ ion-segment-button {
}
ion-segment {
justify-content: space-between;
overflow: auto;
justify-content: space-between;
height: 50px;
&::-webkit-scrollbar {
display: none;
width: 0;
height: 0;
display: none;
}
ion-segment-button.segment-button {

47
frontend/app/src/app/modules/feedback/feedback-page.scss
View File

@@ -12,66 +12,75 @@
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
@import '~src/theme/util/mixins';
pre {
white-space: pre-wrap;
}
ion-button {
margin: 10px;
}
@import 'src/theme/util/_mixins.scss';
:host ::ng-deep {
ion-grid,
ion-col {
padding-top: 0;
padding-bottom: 0;
padding-inline-start: 0;
}
ion-card {
margin: 0;
box-shadow: none;
ion-card-content {
padding-bottom: 8px;
h1 {
margin: 0;
}
padding-bottom: 8px;
}
ion-card-header {
color: var(--ion-color-dark);
padding-top: 8px;
padding-bottom: 4px;
font-weight: bold;
color: var(--ion-color-dark);
}
ion-grid,
ion-col {
padding-inline-start: 0;
padding-top: 0;
padding-bottom: 0;
}
}
ion-grid,
ion-col {
padding-inline-start: 0;
padding-top: 0;
padding-bottom: 0;
}
}
.feedback-content {
margin: var(--spacing-md);
@include border-radius-in-parallax(var(--border-radius-default));
display: flex;
flex-direction: column;
gap: var(--spacing-sm);
margin: var(--spacing-md);
background: var(--ion-item-background);
@include border-radius-in-parallax(var(--border-radius-default));
& > * {
@include border-radius-in-parallax(var(--border-radius-default));
position: relative;
overflow: hidden;
display: block;
margin: 0;
ion-card-subtitle {
font-size: var(--font-size-lg);
color: var(--ion-color-light-contrast);
}
display: block;
@include border-radius-in-parallax(var(--border-radius-default));
overflow: hidden;
position: relative;
margin: 0;
& > ion-thumbnail {
background: var(--ion-color-primary);
}

7
frontend/app/src/app/modules/hebis/daia-availability/daia-availability.scss
View File

@@ -16,16 +16,19 @@
:host ion-card {
margin: 0;
box-shadow: none;
ion-card-content {
padding-bottom: 8px;
h1 {
margin: 0;
}
padding-bottom: 8px;
}
ion-card-header {
color: var(--ion-color-dark);
padding-top: 8px;
padding-bottom: 4px;
font-weight: bold;
color: var(--ion-color-dark);
}
}

11
frontend/app/src/app/modules/hebis/daia-availability/daia-holding.scss
View File

@@ -14,18 +14,21 @@
*/
ion-label a {
display: block;
text-decoration: none;
margin: 20px 0 5px;
font-weight: 700;
color: var(--ion-color-primary);
margin: 20px 0 5px;
text-decoration: none;
}
ion-grid {
margin: 5px;
padding: 0;
margin: 5px 5px;
ion-row {
background-color: var(--ion-color-light);
color: var(--ion-color-light-contrast);
background-color: var(--ion-color-light);
border-bottom: 1px solid #fff;
ion-col:first-child {

23
frontend/app/src/app/modules/hebis/hebis-detail/hebis-detail-content.scss
View File

@@ -14,32 +14,37 @@
*/
:host ::ng-deep {
ion-grid,
ion-col {
padding-top: 0;
padding-bottom: 0;
padding-inline-start: 0;
}
ion-card {
margin: 0;
box-shadow: none;
ion-card-content {
padding-bottom: 8px;
h1 {
margin: 0;
}
padding-bottom: 8px;
}
ion-card-header {
color: var(--ion-color-dark);
padding-top: 8px;
padding-bottom: 4px;
font-weight: bold;
color: var(--ion-color-dark);
}
ion-grid,
ion-col {
padding-inline-start: 0;
padding-top: 0;
padding-bottom: 0;
}
}
ion-grid,
ion-col {
padding-inline-start: 0;
padding-top: 0;
padding-bottom: 0;
}
}
}

4
frontend/app/src/app/modules/hebis/hebis-detail/hebis-detail.html
View File

@@ -27,13 +27,13 @@
<ion-content class="ion-no-padding">
<div [ngSwitch]="true">
<ng-container *ngSwitchCase="!item && (isDisconnected | async)">
<div class="centeredMessageContainer">
<div class="centered-message-container">
<ion-icon name="signal_disconnected"></ion-icon>
<ion-label> {{ 'data.detail.COULD_NOT_CONNECT' | translate }} </ion-label>
</div>
</ng-container>
<ng-container *ngSwitchCase="item === null">
<div class="centeredMessageContainer">
<div class="centered-message-container">
<ion-icon name="link_off"></ion-icon>
<ion-label> {{ 'data.detail.NOT_FOUND' | translate }} </ion-label>
</div>

2
frontend/app/src/app/modules/hebis/list/hebis-search-page.html
View File

@@ -51,7 +51,7 @@
<ion-content>
<div [style.display]="!showDefaultData && !items && !loading ? 'block' : 'none'">
<ion-label class="centeredMessageContainer"> {{ 'hebisSearch.instruction' | translate }} </ion-label>
<ion-label class="centered-message-container"> {{ 'hebisSearch.instruction' | translate }} </ion-label>
</div>
<stapps-data-list
id="data-list"

2
frontend/app/src/app/modules/library/account/checked-out/checked-out-page.html
View File

@@ -39,7 +39,7 @@
*ngIf="!checkedOutItems; else nothingFound"
></stapps-skeleton-list-item>
<ng-template #nothingFound>
<ion-label *ngIf="checkedOutItems && checkedOutItems.length === 0" class="centeredMessageContainer">
<ion-label *ngIf="checkedOutItems && checkedOutItems.length === 0" class="centered-message-container">
{{ 'search.nothing_found' | translate | titlecase }}
</ion-label>
</ng-template>

2
frontend/app/src/app/modules/library/account/holds/holds-page.html
View File

@@ -71,7 +71,7 @@
*ngIf="!paiaDocuments; else nothingFound"
></stapps-skeleton-list-item>
<ng-template #nothingFound>
<ion-label *ngIf="paiaDocuments && paiaDocuments.length === 0" class="centeredMessageContainer">
<ion-label *ngIf="paiaDocuments && paiaDocuments.length === 0" class="centered-message-container">
{{ 'search.nothing_found' | translate | titlecase }}
</ion-label>
</ng-template>

15
frontend/app/src/app/modules/map/item/map-item.component.scss
View File

@@ -20,8 +20,8 @@
max-width: 100%;
ion-card {
padding: 0;
overflow: visible;
padding: 0;
ion-card-header {
padding: 0;
@@ -41,15 +41,16 @@
}
.close {
position: absolute;
top: -15px;
right: -15px;
z-index: 1;
--padding-top: 0;
--padding-bottom: 0;
--padding-start: 0;
--padding-end: 0;
position: absolute;
z-index: 1;
top: -15px;
right: -15px;
ion-icon {
width: 30px;
height: 30px;
@@ -58,13 +59,13 @@
}
ion-card-content {
padding: var(--spacing-md);
display: flex;
flex-direction: row;
padding: var(--spacing-md);
.show-more-button {
text-transform: uppercase;
margin-left: auto;
text-transform: uppercase;
}
}
}

51
frontend/app/src/app/modules/map/page/map-page.scss
View File

@@ -16,11 +16,13 @@
ion-content {
// fixes the unexpected issue that the content is not fullscreen (behind the header)
position: absolute;
div.map-container {
position: fixed;
width: 100%;
height: 100%;
position: fixed;
}
& > div {
overflow: hidden;
}
@@ -30,33 +32,46 @@ ion-toolbar:first-of-type {
padding: 0 var(--spacing-md) var(--spacing-xs);
}
div.map-buttons {
ion-button {
// important for iOS
// TODO: find an option that is better suited for the iOS theme
--box-shadow: var(--map-box-shadow);
align-self: flex-end;
margin: 4px;
}
}
::ng-deep {
.stapps-location {
ion-icon {
color: #fd435c;
width: 100%;
height: 100%;
color: #fd435c;
}
}
.stapps-device-location {
ion-icon {
color: #4387fd;
width: 100%;
height: 100%;
color: #4387fd;
}
}
div.floating-content {
display: block;
position: fixed;
left: 0;
z-index: 1000;
right: 0;
bottom: 0;
z-index: 1000;
left: 0;
display: block;
justify-content: center;
width: 100%;
padding: 0 var(--spacing-md) 8vh;
justify-content: center;
ion-card {
margin: 0;
@@ -68,43 +83,35 @@ ion-toolbar:first-of-type {
}
stapps-map-item {
width: 550px;
position: center;
justify-self: center;
width: 550px;
margin: var(--spacing-sm) auto;
}
}
}
div.floating-buttons {
z-index: 1000;
position: absolute;
bottom: 15px;
z-index: 1000;
right: 10px;
}
div.map-buttons {
ion-button {
margin: 4px;
// important for iOS
// TODO: find an option that is better suited for the iOS theme
--box-shadow: var(--map-box-shadow);
align-self: flex-end;
}
bottom: 15px;
}
div.map-buttons.above {
min-width: 70%;
display: none;
min-width: 70%;
}
@media (max-width: 667px) {
@media (width <= 667px) {
div.map-buttons.above {
display: flex;
}
div.floating-content {
justify-content: normal;
padding: 0 var(--spacing-md) var(--spacing-lg);
stapps-map-item {
display: grid;
width: 100%;

8
frontend/app/src/app/modules/map/widget/map-widget.scss
View File

@@ -14,15 +14,15 @@
*/
div.map-container {
height: 100%;
width: 100%;
display: block;
pointer-events: none;
display: block;
width: 100%;
height: 100%;
}
div.map-buttons {
position: absolute;
z-index: 10000;
top: 10px;
right: 10px;
z-index: 10000;
}

28
frontend/app/src/app/modules/menu/navigation/navigation.scss
View File

@@ -12,8 +12,7 @@
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
@import '../../../../theme/util/mixins';
@import '~src/theme/util/mixins';
stapps-navigation-tabs {
@include ion-xl-up {
@@ -21,18 +20,11 @@ stapps-navigation-tabs {
}
}
stapps-offline-notice.has-error ~ ion-split-pane,
stapps-offline-notice.is-offline ~ ion-split-pane {
margin-top: calc(var(--font-size-md) + 2 * var(--spacing-sm));
}
:host {
ion-split-pane {
transition: margin-top 150ms ease;
--side-max-width: 256px;
margin-bottom: calc(var(--ion-tabbar-height) + env(safe-area-inset-bottom));
@include phoneLandscape {
@include phone-landscape {
margin-bottom: 0;
}
@@ -44,6 +36,9 @@ stapps-offline-notice.is-offline ~ ion-split-pane {
@include ion-xl-up {
margin-left: 0;
}
margin-bottom: calc(var(--ion-tabbar-height) + env(safe-area-inset-bottom));
transition: margin-top 150ms ease;
}
ion-toolbar.in-toolbar {
@@ -54,25 +49,30 @@ stapps-offline-notice.is-offline ~ ion-split-pane {
padding: var(--spacing-xl) var(--spacing-md);
.logo {
object-position: left;
height: 80px;
@include ion-md-up {
height: var(--tablet-top-bar-height);
}
height: 80px;
object-position: left;
}
}
}
}
stapps-offline-notice.has-error ~ ion-split-pane,
stapps-offline-notice.is-offline ~ ion-split-pane {
margin-top: calc(var(--font-size-md) + 2 * var(--spacing-sm));
}
ion-router-outlet {
background: var(--ion-background-color);
}
.menu-category {
ion-label {
font-weight: bold;
font-size: 115%;
font-weight: bold;
}
}

41
frontend/app/src/app/modules/menu/navigation/offline-notice.scss
View File

@@ -13,45 +13,53 @@
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
:host {
display: grid;
$height: calc(var(--font-size-md) + 2 * var(--spacing-sm));
height: $height;
width: 100%;
transform: translateY(calc(-1 * $height));
display: grid;
width: 100%;
height: $height;
line-height: var(--font-size-md);
font-size: var(--font-size-md);
font-weight: bold;
transform: translateY(calc(-1 * $height));
line-height: var(--font-size-md);
transition: all 150ms ease;
&.is-offline,
&.has-error {
transform: translateY(0px);
transform: translateY(0);
}
> ion-button {
grid-row: 1;
grid-column: 1;
margin: 0;
--border-radius: 0;
opacity: 0;
--padding-top: 0;
--padding-bottom: 0;
transition: all 150ms ease;
z-index: 0;
&.close {
height: 100%;
grid-column: 1;
grid-row: 1;
margin: 0;
opacity: 0;
transition: all 150ms ease;
&.close {
position: absolute;
right: 0;
z-index: 1;
top: 50%;
right: 0;
bottom: 0;
transform: translateY(-50%);
z-index: 1;
height: 100%;
margin: 0;
color: var(--ion-color-danger-contrast);
}
}
@@ -71,6 +79,7 @@
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}

35
frontend/app/src/app/modules/menu/navigation/tabs.component.scss
View File

@@ -15,37 +15,32 @@
@import '../../../../theme/util/mixins';
:host {
position: absolute;
bottom: 0;
left: 0;
right: 0;
z-index: 100;
.menu-button {
display: none;
}
@include ion-md-up {
right: unset;
top: 0;
right: unset;
.menu-button {
display: revert;
position: absolute;
top: 0;
left: 0;
right: 0;
left: 0;
display: revert;
margin-top: var(--spacing-xxl);
}
ion-tab-bar {
border-top: unset;
position: relative;
border-right: var(--border);
flex-direction: column;
gap: var(--spacing-md);
width: var(--navigation-rail-width);
height: 100vh;
border-top: unset;
border-right: var(--border);
}
ion-tab-button {
@@ -53,6 +48,16 @@
height: var(--navigation-rail-item-height);
}
}
position: absolute;
z-index: 100;
right: 0;
bottom: 0;
left: 0;
.menu-button {
display: none;
}
}
.tab-selected ::ng-deep stapps-icon {

13
frontend/app/src/app/modules/news/item/news-item.scss
View File

@@ -33,12 +33,15 @@ ion-card::part(native) {
}
ion-card-title {
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
font-size: var(--font-size-xl);
--color: var(--ion-text-color-dark, white);
overflow: hidden;
display: -webkit-box;
font-size: var(--font-size-xl);
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
max-lines: 3;
}

2
frontend/app/src/app/modules/news/page/news-page.html
View File

@@ -51,7 +51,7 @@
<stapps-news-item *ngFor="let item of news" [item]="item"></stapps-news-item>
</ng-container>
</div>
<ion-label *ngIf="news.length === 0" class="centeredMessageContainer">
<ion-label *ngIf="news.length === 0" class="centered-message-container">
{{ 'search.nothing_found' | translate | titlecase }}
</ion-label>
<ion-infinite-scroll id="infinite-scroll" threshold="20%" (ionInfinite)="loadMore($event.target)">

6
frontend/app/src/app/modules/news/page/news-page.scss
View File

@@ -15,10 +15,11 @@
@import 'src/theme/util/mixins';
.news-grid {
@include auto-grid(300px);
display: grid;
gap: var(--spacing-sm);
margin: var(--spacing-sm);
@include auto-grid(300px);
> * {
height: 100%;
@@ -26,7 +27,8 @@
}
ion-content.ios > div > .news-grid {
@include auto-grid(350px);
gap: var(--spacing-lg);
margin: var(--spacing-lg);
@include auto-grid(350px);
}

72
frontend/app/src/app/modules/profile/page/profile-page-section.scss
View File

@@ -16,10 +16,45 @@
$width: 108px;
ion-item {
--border-radius: var(--border-radius-default);
--inner-padding-start: unset;
--inner-padding-end: unset;
--padding-start: unset;
--padding-end: unset;
height: 96px;
&::part(native) {
width: 100%;
height: 100%;
}
> div {
width: 100%;
height: 100%;
}
div,
ion-label {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 0 var(--spacing-xs) 0 var(--spacing-xs);
font-size: var(--font-size-sm);
text-align: center;
white-space: normal;
}
}
simple-swiper {
container-type: inline-size;
--swiper-slide-width: #{$width};
container-type: inline-size;
ion-item {
@each $i in 7, 6, 5, 4, 3, 2, 1 {
$max: #{($width + 8px) * $i};
@@ -30,40 +65,9 @@ simple-swiper {
}
}
ion-item {
height: 96px;
--border-radius: var(--border-radius-default);
--inner-padding-start: unset;
--inner-padding-end: unset;
--padding-start: unset;
--padding-end: unset;
> div {
width: 100%;
height: 100%;
}
div,
ion-label {
white-space: normal;
text-align: center;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
font-size: var(--font-size-sm);
padding: 0 var(--spacing-xs) 0 var(--spacing-xs);
}
&::part(native) {
height: 100%;
width: 100%;
}
}
.log-in-hint {
padding: var(--spacing-xl);
height: 100%;
box-shadow: none;
padding: var(--spacing-xl);
background: var(--ion-color-light-tint);
box-shadow: none;
}

86
frontend/app/src/app/modules/profile/page/profile-page.scss
View File

@@ -21,20 +21,26 @@
margin-bottom: 0;
}
}
.section-headline {
margin-bottom: var(--spacing-md);
}
.user-card-wrapper {
margin-bottom: 0;
.user-card {
border-radius: var(--border-radius-default);
position: relative;
margin: 0;
box-shadow: var(--shadow-profile-card);
max-width: 400px;
margin: 0;
border-radius: var(--border-radius-default);
box-shadow: var(--shadow-profile-card);
ion-card-header {
--background: var(--ion-color-tertiary);
display: flex;
align-items: center;
padding-top: var(--spacing-sm);
@@ -43,16 +49,17 @@
ion-img {
display: block;
height: 36px;
object-position: left 50%;
margin-right: auto;
object-position: left 50%;
}
span {
color: var(--ion-color-light);
padding-top: 3px;
font-size: var(--font-size-lg);
font-weight: var(--font-weight-bold);
line-height: 1;
padding-top: 3px;
color: var(--ion-color-light);
}
}
@@ -61,10 +68,12 @@
.profile-card-img {
position: absolute;
opacity: 0.13;
height: 100%;
width: 50%;
height: 100%;
margin-left: calc(var(--spacing-md) * -4);
opacity: 0.13;
object-position: left bottom;
}
@@ -76,25 +85,27 @@
'email email';
ion-label {
display: block;
font-size: var(--font-size-sm);
font-weight: var(--font-weight-bold);
color: var(--ion-color-medium-shade);
display: block;
}
ion-text {
display: block;
font-size: var(--font-size-md);
font-weight: var(--font-weight-bold);
color: var(--ion-color-text);
display: block;
}
.full-name {
grid-area: fullName;
display: block;
grid-area: fullName;
margin-bottom: var(--spacing-sm);
font-size: var(--font-size-lg);
font-weight: var(--font-weight-bold);
margin-bottom: var(--spacing-sm);
}
.matriculation-number {
@@ -114,75 +125,86 @@
.log-in-prompt {
margin: auto 0;
color: var(--ion-color-text);
font-size: var(--font-size-lg);
font-weight: var(--font-weight-semi-bold);
color: var(--ion-color-text);
}
}
}
}
ion-thumbnail {
background: var(--placeholder-gray);
height: 80%;
width: 80%;
align-items: center;
padding: 10px;
width: 80%;
height: 80%;
margin: 0;
padding: 10px;
background: var(--placeholder-gray);
border-radius: var(--border-radius-default);
ion-icon {
display: block;
width: 100%;
height: 100%;
color: white;
display: block;
}
}
ion-row.main-info {
font-weight: bold;
margin-bottom: 2px;
font-weight: bold;
}
.courses {
.courses-card {
margin: 0;
box-shadow: none;
border-radius: var(--border-radius-default) var(--border-radius-default) 0 0;
background-color: unset;
max-width: 800px;
margin: 0;
background-color: unset;
border-radius: var(--border-radius-default) var(--border-radius-default) 0 0;
box-shadow: none;
ion-card-header {
display: flex;
align-items: center;
justify-content: space-between;
background-color: var(--ion-item-background);
border-radius: var(--border-radius-default) var(--border-radius-default) 0 0;
display: flex;
justify-content: space-between;
align-items: center;
span {
color: var(--ion-item-background-color-contrast);
font-size: var(--font-size-lg);
font-weight: var(--font-weight-bold);
color: var(--ion-item-background-color-contrast);
}
ion-icon {
color: var(--ion-color-light);
cursor: pointer;
color: var(--ion-color-light);
}
}
ion-card-content {
overflow: hidden;
max-height: 0;
margin: 0;
padding: 0;
background-color: var(--ion-item-background);
border-radius: var(--border-radius-default);
max-height: 0;
overflow: hidden;
transition: max-height 250ms ease-in-out, padding 250ms ease-in-out, margin 250ms ease-in-out;
&.show-card {
height: 100%;
display: block;
height: 100%;
max-height: var(--max-height);
margin: var(--spacing-xxl);
padding: var(--spacing-md);
max-height: var(--max-height);
}
div {

75
frontend/app/src/app/modules/schedule/page/components/calendar-component.scss
View File

@@ -16,25 +16,49 @@
$header-height: 50px;
$hours-width: 40px;
.day-labels {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
ion-button {
width: 100%;
height: 100%;
text-transform: none;
ion-label {
overflow: visible !important;
}
}
}
.header {
position: relative;
height: $header-height;
background-color: var(--ion-color-light);
position: relative;
.left-button,
.right-button {
color: var(--ion-color-medium-shade);
position: absolute;
z-index: 99;
height: 100%;
margin: 0;
--padding-start: 0;
--padding-end: 0;
position: absolute;
z-index: 99;
height: 100%;
margin: 0;
color: var(--ion-color-medium-shade);
}
.left-button {
left: 0;
padding: 0 var(--spacing-sm);
}
.right-button {
right: 0;
padding: 0 var(--spacing-sm);
@@ -42,9 +66,9 @@ $hours-width: 40px;
.day-labels {
ion-button {
overflow: visible !important;
width: unset;
color: var(--ion-color-light-contrast);
overflow: visible !important;
}
}
@@ -57,24 +81,6 @@ $hours-width: 40px;
height: 100%;
}
.day-labels {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
ion-button {
width: 100%;
height: 100%;
text-transform: none;
ion-label {
overflow: visible !important;
}
}
}
ion-content {
overflow-y: auto;
}
@@ -89,14 +95,17 @@ ion-content {
background-color: var(--ion-background-color);
.hour-lines {
position: absolute;
top: 0;
width: 40px;
height: 70px;
border-right: 1px solid var(--ion-item-border-color);
text-align: center;
top: 0;
position: absolute;
font-weight: var(--font-weight-bold);
text-align: center;
background-color: var(--ion-background-color);
border-right: 1px solid var(--ion-item-border-color);
}
}
@@ -106,12 +115,14 @@ ion-content {
}
.date-header {
border-bottom: 1px solid var(--ion-item-border-color);
padding: var(--spacing-sm) auto;
height: fit-content;
padding: var(--spacing-sm) auto;
font-weight: var(--font-weight-bold);
text-transform: uppercase;
text-align: center;
text-transform: uppercase;
border-bottom: 1px solid var(--ion-item-border-color);
}
.day-labels > ion-button[disabled] {

2
frontend/app/src/app/modules/schedule/page/grid/infinite-swiper.scss
View File

@@ -14,8 +14,8 @@
*/
.swiper {
height: 100%;
width: 100%;
height: 100%;
}
.swiper,

85
frontend/app/src/app/modules/schedule/page/grid/schedule-card.scss
View File

@@ -14,38 +14,32 @@
*/
ion-card {
width: inherit;
z-index: 2;
margin-left: 0;
width: inherit;
margin-right: 0;
margin-left: 0;
border-radius: 0;
@each $name in lecture, exercise, default {
&.#{$name}Card {
--background: var(--calender-#{$name}-card);
ion-card-title,
ion-card-subtitle span,
ion-card-content ion-note,
ion-card-content ion-text {
color: var(--calender-#{$name}-card-contrast);
}
&:after {
background: linear-gradient(
rgba(var(--calender-#{$name}-card-rgb), 0%),
rgba(var(--calender-#{$name}-card-rgb), 100%)
);
}
}
}
&:after {
&::after {
content: '';
position: absolute;
bottom: 0;
height: 33%;
width: 100%;
height: 33%;
}
ion-card-header,
ion-card-title,
ion-card-subtitle span,
ion-card-content ion-note {
font-family: var(--headline-font-family);
font-size: var(--font-size-sm);
font-weight: var(--font-weight-bold);
text-overflow: ellipsis;
}
ion-card-header {
@@ -58,37 +52,46 @@ ion-card {
ion-card-subtitle {
display: flex;
ion-icon.icon-white {
color: var(--ion-color-primary-contrast);
margin-right: var(--spacing-xs);
color: var(--ion-color-primary-contrast);
}
}
}
ion-card-header,
ion-card-title,
ion-card-subtitle span,
ion-card-content ion-note {
font-size: var(--font-size-sm);
font-weight: var(--font-weight-bold);
font-family: var(--headline-font-family);
text-overflow: ellipsis;
}
ion-card-content .place-name {
display: block;
font-family: var(--headline-font-family);
}
ion-card-content .place-name {
display: block;
}
div {
position: absolute;
bottom: 0;
height: 20px;
width: 100%;
background: linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 255) 100%);
height: 20px;
background: linear-gradient(rgb(255 255 255 / 0%) 0%, rgb(255 255 255 / 25500%) 100%);
}
@each $name in lecture, exercise, default {
&.#{$name}Card {
--background: var(--calender-#{$name}-card);
&::after {
background: linear-gradient(
rgb(var(--calender-#{$name}-card-rgb) 0%),
rgb(var(--calender-#{$name}-card-rgb) 100%)
);
}
ion-card-title,
ion-card-subtitle span,
ion-card-content ion-note,
ion-card-content ion-text {
color: var(--calender-#{$name}-card-contrast);
}
}
}
}

28
frontend/app/src/app/modules/schedule/page/grid/schedule-cursor.scss
View File

@@ -14,38 +14,44 @@
*/
div {
padding: 0;
margin: 0;
position: absolute;
z-index: 2;
top: 4px;
display: flex;
flex-direction: row;
width: 100%;
top: 4px;
z-index: 2;
margin: 0;
padding: 0;
div {
width: 100%;
height: fit-content;
hr {
width: 100%;
position: absolute;
margin-right: 16px;
margin-top: 8px;
width: 100%;
height: 2px;
border-top: 2px solid var(--ion-color-danger);
margin-top: 8px;
margin-right: 16px;
margin-block-start: 0;
margin-block-end: 0;
border-top: 2px solid var(--ion-color-danger);
}
div {
width: 8px;
height: 8px;
position: absolute;
top: -3px;
border-radius: 50% 0 50% 50%;
transform: rotateZ(45deg);
width: 8px;
height: 8px;
background-color: var(--ion-color-danger);
border-radius: 50% 0 50% 50%;
}
}
}

25
frontend/app/src/app/modules/schedule/page/grid/schedule-day.scss
View File

@@ -15,8 +15,8 @@
:host {
.day-wrapper {
border-left: 1px solid var(--ion-item-border-color);
border-right: 1px solid var(--ion-item-border-color);
border-left: 1px solid var(--ion-item-border-color);
&.leftmost {
border-left: unset;
@@ -24,16 +24,19 @@
.day-header {
position: sticky;
z-index: 3;
top: 0;
left: 0;
height: fit-content;
padding: var(--spacing-md);
border-bottom: 2px solid var(--ion-item-border-color);
font-size: var(--font-size-md);
font-weight: var(--font-weight-bold);
text-align: center;
background-color: var(--ion-background-color);
z-index: 3;
border-bottom: 2px solid var(--ion-item-border-color);
&.leftmost {
border-left: 1px solid var(--ion-item-border-color);
@@ -46,32 +49,34 @@
}
div {
height: 100%;
width: 100%;
height: 100%;
}
.horizontal-group {
position: absolute;
top: 10px;
left: 0;
grid-column: 1;
grid-row: 1;
width: 100%;
box-sizing: border-box;
max-width: inherit;
display: flex;
grid-column: 1;
grid-row: 1;
flex-direction: row;
align-items: flex-start;
box-sizing: border-box;
width: 100%;
max-width: inherit;
}
.vertical-line {
position: absolute;
top: 0;
left: 0;
width: 1px;
height: 100%;
background-color: var(--calender-date-line-gray);
}
}

5
frontend/app/src/app/modules/schedule/page/schedule-single-events.scss
View File

@@ -10,15 +10,16 @@
margin-right: var(--spacing-md);
.hour-label {
width: fit-content;
display: inline-block;
width: fit-content;
text-align: center;
}
.hour-line {
width: 1px;
height: 20px;
border-left: 1px solid var(--ion-color-primary);
margin: var(--spacing-xs) 0;
border-left: 1px solid var(--ion-color-primary);
}
}

45
frontend/app/src/app/modules/settings/page/settings-page.scss
View File

@@ -12,58 +12,67 @@
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
@import 'src/theme/util/_mixins.scss';
@import '~src/theme/util/mixins';
:host ::ng-deep {
ion-grid,
ion-col {
padding-top: 0;
padding-bottom: 0;
padding-inline-start: 0;
}
ion-card {
margin: 0;
box-shadow: none;
ion-card-content {
padding-bottom: 8px;
h1 {
margin: 0;
}
padding-bottom: 8px;
}
ion-card-header {
color: var(--ion-color-dark);
padding-top: 8px;
padding-bottom: 4px;
font-weight: bold;
color: var(--ion-color-dark);
}
ion-grid,
ion-col {
padding-inline-start: 0;
padding-top: 0;
padding-bottom: 0;
}
}
ion-grid,
ion-col {
padding-inline-start: 0;
padding-top: 0;
padding-bottom: 0;
}
}
.settings-content {
margin: var(--spacing-md);
@include border-radius-in-parallax(var(--border-radius-default));
display: flex;
flex-direction: column;
gap: var(--spacing-sm);
margin: var(--spacing-md);
background: var(--ion-item-background);
@include border-radius-in-parallax(var(--border-radius-default));
& > * {
@include border-radius-in-parallax(var(--border-radius-default));
position: relative;
overflow: hidden;
display: block;
margin: 0;
ion-card-subtitle {
font-size: var(--font-size-lg);
color: var(--ion-color-light-contrast);
}
display: block;
@include border-radius-in-parallax(var(--border-radius-default));
overflow: hidden;
position: relative;
margin: 0;
& > ion-thumbnail {
background: var(--ion-color-primary);
}

6
frontend/app/src/app/util/ion-icon/icon.scss
View File

@@ -14,13 +14,15 @@
*/
:host {
font-variation-settings: 'wght' var(--weight), 'GRAD' var(--grade), 'FILL' var(--fill);
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
font-size: inherit;
font-variation-settings: 'wght' var(--weight), 'GRAD' var(--grade), 'FILL' var(--fill);
transition: all 0.2s ease-in-out;
}

20
frontend/app/src/app/util/section.component.scss
View File

@@ -12,8 +12,7 @@
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
@import 'src/theme/util/mixins';
@import '~src/theme/util/mixins';
a {
display: contents;
@@ -23,6 +22,7 @@ a {
ion-grid {
width: 100%;
padding: 0;
}
ion-label {
@@ -30,16 +30,12 @@ ion-label {
font-weight: var(--font-weight-bold);
&:only-child {
height: 100%;
display: flex;
align-items: center;
height: 100%;
}
}
ion-grid {
padding: 0;
}
ion-col {
padding: 0;
}
@@ -55,14 +51,16 @@ ion-col {
}
:host {
transition: height 250ms ease;
display: block;
padding: var(--spacing-sm) var(--spacing-md) var(--spacing-sm);
--swiper-scroll-padding: var(--spacing-md);
--swiper-gap: var(--spacing-sm);
@include ion-md-up {
padding: var(--spacing-lg) var(--spacing-xxl) var(--spacing-sm);
--swiper-scroll-padding: var(--spacing-xxl);
padding: var(--spacing-lg) var(--spacing-xxl) var(--spacing-sm);
}
display: block;
padding: var(--spacing-sm) var(--spacing-md) var(--spacing-sm);
transition: height 250ms ease;
}

27
frontend/app/src/app/util/simple-swiper.scss
View File

@@ -14,36 +14,36 @@
*/
:host {
position: relative;
display: grid;
grid-auto-flow: column;
justify-content: start;
scrollbar-width: none;
scroll-snap-type: x mandatory;
position: relative;
contain: layout;
overflow-x: auto;
overflow-y: hidden;
contain: layout;
display: grid;
grid-auto-flow: column;
gap: var(--swiper-gap, 0);
justify-content: start;
margin-inline: calc(-1 * var(--swiper-scroll-padding));
gap: var(--swiper-gap, 0);
&::ng-deep > * {
contain: layout;
scroll-snap-align: start;
scroll-margin-inline: var(--swiper-scroll-padding, 0);
scroll-snap-align: start;
contain: layout;
width: var(--swiper-slide-width);
&:first-child {
padding-inline-start: var(--swiper-scroll-padding);
width: calc(var(--swiper-slide-width) + var(--swiper-scroll-padding));
padding-inline-start: var(--swiper-scroll-padding);
}
&:last-child {
scroll-snap-align: end;
padding-inline-end: var(--swiper-scroll-padding);
width: calc(var(--swiper-slide-width) + var(--swiper-scroll-padding));
padding-inline-end: var(--swiper-scroll-padding);
}
&:only-child {
@@ -54,5 +54,4 @@
&::-webkit-scrollbar {
display: none;
}
scrollbar-width: none;
}

74
frontend/app/src/global.scss
View File

@@ -31,8 +31,8 @@
@import 'swiper/scss/controller';
// @import 'material-symbols/rounded.scss';
@import './theme/material-symbols.scss';
@import './theme/common/_ion-content-parallax.scss';
@import './theme/material-symbols';
@import './theme/common/ion-content-parallax';
/* StApps */
@@ -49,12 +49,14 @@ stapps-icon {
&::before {
content: attr(name);
position: absolute;
z-index: -1;
top: 0;
left: 0;
font-variation-settings: 'FILL' 0;
color: white;
z-index: -1;
}
}
@@ -62,18 +64,23 @@ ion-item {
h2.name {
font-weight: bold;
}
ion-thumbnail {
background: transparent;
--size: 36px;
display: flex;
align-items: center;
padding: 10px;
margin: 0;
padding: 10px;
background: transparent;
ion-icon {
display: block;
width: 100%;
height: 100%;
color: white;
display: block;
}
}
}
@@ -82,21 +89,39 @@ ion-item,
ion-card.compact {
ion-grid,
ion-col {
padding-inline-start: 0;
padding-top: 0;
padding-bottom: 0;
padding-inline-start: 0;
}
}
.centeredMessageContainer {
ion-header stapps-favorite-button ion-icon {
color: var(--ion-color-primary-contrast);
}
ion-alert {
button.alert-button.preferred {
color: var(--ion-color-primary-contrast);
background-color: var(--ion-color-primary);
}
button.alert-button.default {
color: var(--ion-color-primary);
background-color: transparent;
}
}
.centered-message-container {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
justify-content: center;
min-height: 50vh;
margin: 20px;
text-align: center;
ion-icon {
font-size: 64px;
}
@@ -116,32 +141,3 @@ ion-card.bold-header {
font-weight: bold;
}
}
ion-header {
stapps-favorite-button {
ion-icon {
color: var(--ion-color-primary-contrast);
}
}
}
ion-alert {
button.alert-button.preferred {
background-color: var(--ion-color-primary);
color: var(--ion-color-primary-contrast);
}
button.alert-button.default {
background-color: transparent;
color: var(--ion-color-primary);
}
}
ion-alert {
button.alert-button.preferred {
background-color: var(--ion-color-primary);
color: var(--ion-color-primary-contrast);
}
button.alert-button.default {
background-color: transparent;
color: var(--ion-color-primary);
}
}

22
frontend/app/src/theme/_fonts.scss
View File

@@ -14,38 +14,38 @@
*/
@font-face {
font-family: 'Barlow';
font-family: Barlow;
font-weight: 400;
font-style: normal;
src: url('../assets/fonts/barlow/Barlow-Regular.ttf');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Barlow';
font-family: Barlow;
font-weight: 700;
font-style: normal;
src: url('../assets/fonts/barlow/Barlow-SemiBold.ttf');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: 'Barlow';
src: url('../assets/fonts/barlow/Barlow-Bold.ttf');
font-family: Barlow;
font-weight: 800;
font-style: normal;
src: url('../assets/fonts/barlow/Barlow-Bold.ttf');
}
@font-face {
font-family: 'Barlow Condensed';
src: url('../assets/fonts/barlow_condensed/BarlowCondensed-Regular.ttf');
font-weight: 400;
font-style: normal;
src: url('../assets/fonts/barlow_condensed/BarlowCondensed-Regular.ttf');
}
@font-face {
font-family: 'Barlow Condensed';
src: url('../assets/fonts/barlow_condensed/BarlowCondensed-SemiBold.ttf');
font-weight: 700;
font-style: normal;
src: url('../assets/fonts/barlow_condensed/BarlowCondensed-SemiBold.ttf');
}
@font-face {
font-family: 'Barlow Condensed';
src: url('../assets/fonts/barlow_condensed/BarlowCondensed-Bold.ttf');
font-weight: 800;
font-style: normal;
src: url('../assets/fonts/barlow_condensed/BarlowCondensed-Bold.ttf');
}

2
frontend/app/src/theme/color-processing.scss
View File

@@ -17,7 +17,6 @@
// being generated, but omits colors with -dark and -light suffixes, making
// it impossible to access dark theme colors while in light theme and vice versa
$include-theme-independent-colors: true;
$tint-amount: 10%;
$shade-amount: 12%;
$placeholder-fade-amount: 20%;
@@ -28,7 +27,6 @@ $item-border-color-fade-amount: 15%;
$contrast-threshold: 128;
$contrast-light-color: #fff;
$contrast-dark-color: #000;
$fade-threshold: 50%;
// https://ionicframework.com/docs/theming/themes#stepped-colors

10
frontend/app/src/theme/colors.scss
View File

@@ -37,16 +37,14 @@
--calender-default-card: var(--ion-color-light);
--calender-default-card-rgb: var(--ion-color-light-rgb);
--calender-default-card-contrast: var(--ion-color-light-contrast);
--map-box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
0 1px 5px 0 rgba(0, 0, 0, 0.12);
--map-box-shadow: 0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%),
0 1px 5px 0 rgb(0 0 0 / 12%);
--linear-gradient: linear-gradient(135deg, var(--ion-color-primary-shade), var(--ion-color-tertiary));
// Shadows
--shadow-default: 0px 0px 10px 4px var(--ion-box-shadow-color);
--shadow-cards: 0 0 8px 1px var(--ion-box-shadow-color);
--shadow-cards-hover: 5px 5px 8px 4px var(--ion-box-shadow-color);
--shadow-profile-card: 0 2px 6px 6px rgba(0, 0, 0, 0.06), 0 4px 5px 12px rgba(0, 0, 0, 0.04),
0 5px 6px 20px rgba(0, 0, 0, 0.02);
--shadow-profile-card: 0 2px 6px 6px rgb(0 0 0 / 6%), 0 4px 5px 12px rgb(0 0 0 / 4%),
0 5px 6px 20px rgb(0 0 0 / 2%);
}

6
frontend/app/src/theme/common/_helper.scss
View File

@@ -41,6 +41,7 @@
li img {
max-height: 1.25rem;
vertical-align: text-bottom;
// filter: invert(45%) sepia(0%) saturate(0%) hue-rotate(227deg) brightness(97%) contrast(82%);
}
}
@@ -48,11 +49,13 @@
%horizontal-list {
@extend %vertical-list;
ul {
li {
display: inline;
}
li:not(:first-child):before {
li:not(:first-child)::before {
content: ' • ';
}
}
@@ -64,6 +67,7 @@
.horizontal-list {
@extend %vertical-list;
li {
display: inline;
}

54
frontend/app/src/theme/common/_ion-button.scss
View File

@@ -14,6 +14,34 @@
*/
app-root {
.button {
--padding-top: var(--spacing-sm);
--padding-bottom: var(--spacing-sm);
height: auto;
font-size: var(--font-size-sm);
font-weight: var(--font-weight-semi-bold);
// Add default border, so buttons have the same size
&:not([fill='outline'])::part(native) {
border: var(--border-width-default) solid transparent;
}
&[fill='outline']::part(native) {
border: var(--border-width-default) solid rgb(var(--ion-color-primary-contrast-rgb) 0.2);
}
&.button-active {
--background: var(--ion-color-tertiary);
font-weight: var(--font-weight-bold);
ion-icon {
color: var(--ion-color-secondary);
}
}
}
// Change default border radius
ion-buttons ion-button.button,
.button {
@@ -22,32 +50,6 @@ app-root {
}
}
.button {
font-size: var(--font-size-sm);
font-weight: var(--font-weight-semi-bold);
--padding-top: var(--spacing-sm);
--padding-bottom: var(--spacing-sm);
height: auto;
// Add default border, so buttons have the same size
&:not([fill='outline'])::part(native) {
border: var(--border-width-default) solid transparent;
}
&[fill='outline']::part(native) {
border: var(--border-width-default) solid rgba(var(--ion-color-primary-contrast-rgb), 0.2);
}
&.button-active {
font-weight: var(--font-weight-bold);
--background: var(--ion-color-tertiary);
ion-icon {
color: var(--ion-color-secondary);
}
}
}
ion-menu-button.button {
font-size: var(--font-size-lg);
}

18
frontend/app/src/theme/common/_ion-content-parallax.scss
View File

@@ -22,24 +22,24 @@ ion-content::part(parallax-scroll) {
}
ion-content::part(parallax-parent) {
transform-style: preserve-3d;
position: relative;
transform-style: preserve-3d;
}
ion-content::part(parallax) {
$translate-y: calc($overscroll-padding * $parallax-strength);
$translate-z: calc(-1px * $parallax-strength);
$transform-origin: calc($parallax-strength * $parallax-strength * $overscroll-padding);
position: absolute;
top: 0;
right: 0;
left: 0;
$translateY: calc($overscroll-padding * $parallax-strength);
$translateZ: calc(-1px * $parallax-strength);
$transform-origin: calc($parallax-strength * $parallax-strength * $overscroll-padding);
height: calc(var(--parallax-content-size, $default-parallax-content-size) + $overscroll-padding);
width: 150%;
transform-origin: 50% $transform-origin;
transform: translate3d(0px, $translateY, $translateZ) scale($parallax-strength);
transform: translate3d(0, $translate-y, $translate-z) scale($parallax-strength);
width: 150%;
height: calc(var(--parallax-content-size, $default-parallax-content-size) + $overscroll-padding);
background: var(--parallax-background, var(--ion-color-primary));
}

2
frontend/app/src/theme/common/_ion-header.scss
View File

@@ -1,5 +1,5 @@
app-root ion-header[class*='header-'] {
&:after {
&::after {
background-image: unset;
}
}

18
frontend/app/src/theme/common/_ion-input.scss
View File

@@ -2,20 +2,22 @@ $icon-size: 23px;
app-root ion-searchbar[class*='sc-ion-searchbar-'] {
--border-radius: var(--border-radius-default);
height: 38px;
padding-top: 0;
padding-bottom: 0;
height: 38px;
&.filterable {
padding-left: 0;
padding-right: 0;
--box-shadow: none;
position: relative;
padding-right: 0;
padding-left: 0;
ion-menu-button {
position: absolute;
right: 5px;
z-index: 1;
right: 5px;
}
.searchbar-clear-button {
@@ -24,11 +26,13 @@ app-root ion-searchbar[class*='sc-ion-searchbar-'] {
}
ion-icon.searchbar-search-icon {
top: 50%;
left: var(--spacing-sm);
transform: translateY(-50%);
width: $icon-size;
height: $icon-size;
top: 50%;
transform: translateY(-50%);
left: var(--spacing-sm);
color: var(--ion-color-medium-shade);
}

5
frontend/app/src/theme/common/_ion-refresher.scss
View File

@@ -14,14 +14,15 @@
*/
ion-refresher {
background-color: var(--ion-color-primary);
text-transform: uppercase;
background-color: var(--ion-color-primary);
.refresher-pulling-icon,
.refresher-pulling-text,
.refresher-refreshing-text {
--ion-text-color: var(--ion-color-primary-contrast);
font-size: var(--font-size-xs);
font-weight: var(--font-weight-semi-bold);
--ion-text-color: var(--ion-color-primary-contrast);
}
}

11
frontend/app/src/theme/common/_ion-toolbar.scss
View File

@@ -24,11 +24,13 @@ app-root ion-toolbar.in-toolbar {
--padding-top: 0;
--padding-bottom: 0;
--opacity: 1;
padding: 0 var(--spacing-md) var(--spacing-md);
&:first-of-type {
--padding-top: 0;
--padding-bottom: 0;
padding-bottom: 0;
}
@@ -40,6 +42,7 @@ app-root ion-toolbar.in-toolbar {
ion-segment {
&:last-of-type {
--padding-bottom: 0;
padding-bottom: 0;
}
}
@@ -55,8 +58,8 @@ app-root ion-toolbar.in-toolbar {
}
ion-title {
font-weight: var(--font-weight-black);
font-size: var(--font-size-lg);
font-weight: var(--font-weight-black);
}
ion-menu-button {
@@ -65,13 +68,15 @@ app-root ion-toolbar.in-toolbar {
ion-back-button {
--icon-margin-end: var(--spacing-xs);
height: 42px; // this prevents the back button to become a .x px value
}
}
app-root ion-toolbar.in-toolbar ion-searchbar,
.stapps-searchbar {
padding-left: 0;
padding-right: 0;
--box-shadow: none;
padding-right: 0;
padding-left: 0;
}

10
frontend/app/src/theme/common/_swiper.scss
View File

@@ -29,17 +29,19 @@
text-decoration: none;
}
}
.swiper-button-prev,
.swiper-button-next {
--swiper-navigation-size: 20px;
top: calc(-1 * var(--spacing-lg));
transform: translateY(0%);
font-weight: var(--font-weight-black);
color: var(--ion-color-dark);
@include ion-md-down {
display: none;
}
top: calc(-1 * var(--spacing-lg));
transform: translateY(0%);
font-weight: var(--font-weight-black);
color: var(--ion-color-dark);
}
.swiper-button-prev {

3
frontend/app/src/theme/common/_typo.scss
View File

@@ -18,12 +18,15 @@ body app-root {
.title[class*='sc-ion-label'] {
font-size: var(--font-size-md);
font-weight: var(--font-weight-semi-bold);
// TODO Condensed Font
}
.title-sub,
.title-sub[class*='sc-ion-label'] {
font-size: var(--font-size-md);
font-weight: var(--font-weight-regular);
// TODO Condensed Font
}

14
frontend/app/src/theme/components/_card.scss
View File

@@ -14,15 +14,19 @@
*/
.card {
box-shadow: var(--shadow-cards);
// background-color: var(--ion-item-color);
border-radius: var(--border-radius-default);
display: block;
height: 100%;
padding: var(--spacing-md);
font-size: var(--font-size-sm);
font-weight: var(--font-weight-bold);
text-align: left;
display: block;
height: 100%;
// background-color: var(--ion-item-color);
border-radius: var(--border-radius-default);
box-shadow: var(--shadow-cards);
transition: transform 250ms ease-in-out, box-shadow 250ms ease-in-out;
}

13
frontend/app/src/theme/components/_section.scss
View File

@@ -1,12 +1,13 @@
.section-headline {
display: flex;
flex-direction: revert;
justify-content: space-between;
width: 100%;
margin-bottom: var(--spacing-sm);
font-size: var(--font-size-lg);
font-weight: var(--font-weight-black);
font-stretch: condensed;
text-transform: uppercase;
margin-bottom: var(--spacing-sm);
width: 100%;
display: flex;
flex-direction: revert;
justify-content: space-between;
}

19
frontend/app/src/theme/material-symbols.scss
View File

@@ -14,27 +14,28 @@
*/
@font-face {
font-family: 'Material Symbols Rounded';
font-style: normal;
font-weight: 100 700;
font-style: normal;
font-display: block;
src: url('../assets/icons.min.woff2') format('woff2');
}
.material-symbols-rounded {
//noinspection CssNoGenericFontName
direction: ltr;
display: inline-block;
// stylelint-disable-next-line
font-family: 'Material Symbols Rounded';
font-size: 24px;
font-feature-settings: 'liga'; // Support for IE
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
text-rendering: optimizelegibility; // Support for Safari and Chrome
letter-spacing: normal;
word-wrap: normal;
direction: ltr;
white-space: nowrap;
-webkit-font-smoothing: antialiased; // Support for all WebKit browsers
-moz-osx-font-smoothing: grayscale; // Support for Firefox
text-rendering: optimizeLegibility; // Support for Safari and Chrome
font-feature-settings: 'liga'; // Support for IE
}

29
frontend/app/src/theme/util/_color-system.scss
View File

@@ -17,20 +17,20 @@
@import '../color-processing';
@import './dark';
@function toRGB($color) {
@function to-rgb($color) {
@return red($color) + ',' + green($color) + ',' + blue($color);
}
@function toShade($color) {
@function to-shade($color) {
@return darken($color, $shade-amount);
}
@function toTint($color) {
@function to-tint($color) {
@return lighten($color, $tint-amount);
}
@function toContrast($color) {
$yiq: toYiq($color);
@function to-contrast($color) {
$yiq: to-yiq($color);
@return if($yiq >= $contrast-threshold, $contrast-dark-color, $contrast-light-color);
}
@@ -53,7 +53,7 @@
/**
* Converts a color to the YIQ color system
*/
@function toYiq($color) {
@function to-yiq($color) {
@return math.div(
(color.red($color) * 299) + (color.green($color) * 587) + (color.blue($color) * 114),
1000
@@ -62,19 +62,19 @@
@mixin color-rgb($name, $color) {
#{$name}: #{$color};
#{$name}-rgb: #{toRGB($color)};
#{$name}-rgb: #{to-rgb($color)};
}
@mixin light-dark-scheme($light, $dark) {
:root,
.light {
@if ($include-theme-independent-colors == true) {
@if $include-theme-independent-colors == true {
@content ($light, -light);
@content (if($dark == none, $light, $dark), -dark);
}
@content ($light, "");
}
@if ($dark != none) {
@if $dark != none {
@include dark-only {
@content ($dark, "");
}
@@ -84,6 +84,7 @@
@mixin ion-color-step($name, $from, $to) {
@for $i from calc($steps-start / $steps-step) through calc($steps-end / $steps-step) {
$value: $i * $steps-step;
#{$name}-#{$value}: #{interpolate-colors($from, $to, $value, $steps-range-start, $steps-range-end)};
}
}
@@ -91,15 +92,15 @@
@mixin ion-color($name, $light, $dark: none) {
@include light-dark-scheme($light, $dark) using($color, $suffix) {
@include color-rgb(--ion-color-#{$name}#{$suffix}, $color);
@include color-rgb(--ion-color-#{$name}-shade#{$suffix}, toShade($color));
@include color-rgb(--ion-color-#{$name}-tint#{$suffix}, toTint($color));
@include color-rgb(--ion-color-#{$name}-contrast#{$suffix}, toContrast($color));
@include color-rgb(--ion-color-#{$name}-shade#{$suffix}, to-shade($color));
@include color-rgb(--ion-color-#{$name}-tint#{$suffix}, to-tint($color));
@include color-rgb(--ion-color-#{$name}-contrast#{$suffix}, to-contrast($color));
}
}
@mixin ion-background-color($light, $dark: none) {
@include light-dark-scheme($light, $dark) using($color, $suffix) {
$text-color: toContrast($color);
$text-color: to-contrast($color);
@include color-rgb(--ion-background-color#{$suffix}, $color);
@include color-rgb(--ion-text-color#{$suffix}, $text-color);
@include color-rgb(--ion-box-shadow-color#{$suffix}, fade($color, $box-shadow-fade-amount));
@@ -115,6 +116,6 @@
@include color-rgb(--ion-card-background#{$suffix}, $color);
@include color-rgb(--ion-item-border-color#{$suffix}, fade($color, $item-border-color-fade-amount));
@include color-rgb(--ion-border-color#{$suffix}, fade($color, $item-border-color-fade-amount));
@include color-rgb(--ion-item-color#{$suffix}, toContrast($color));
@include color-rgb(--ion-item-color#{$suffix}, to-contrast($color));
}
}

1
frontend/app/src/theme/util/_dark.scss
View File

@@ -18,6 +18,7 @@
@content();
}
}
.dark {
@content();
}

26
frontend/app/src/theme/util/_mixins.scss
View File

@@ -18,61 +18,61 @@
*/
@mixin ion-sm-up {
@media (min-width: 576px) {
@media (width >= 576px) {
@content;
}
}
@mixin ion-sm-down {
@media (max-width: 575.98px) {
@media (width <= 575.98px) {
@content;
}
}
@mixin ion-md-up {
@media (min-width: 768px) {
@media (width >= 768px) {
@content;
}
}
@mixin ion-md-down {
@media (max-width: 767.98px) {
@media (width <= 767.98px) {
@content;
}
}
@mixin ion-lg-up {
@media (min-width: 992px) {
@media (width >= 992px) {
@content;
}
}
@mixin ion-lg-down {
@media (max-width: 991.98px) {
@media (width <= 991.98px) {
@content;
}
}
@mixin ion-xl-up {
@media (min-width: 1200px) {
@media (width >= 1200px) {
@content;
}
}
@mixin ion-xl-down {
@media (max-width: 1199.98px) {
@media (width <= 1199.98px) {
@content;
}
}
@mixin phoneLandscape {
@media (max-height: 500px) and (orientation: landscape) {
@mixin phone-landscape {
@media (height <= 500px) and (orientation: landscape) {
@content;
}
}
@mixin phonePortraitSmall {
@media (max-height: 700px) and (orientation: portrait) {
@mixin phone-portrait-small {
@media (height <= 700px) and (orientation: portrait) {
@content;
}
}
@@ -84,11 +84,11 @@
}
@mixin border-radius-in-parallax($border-radius) {
border-radius: $border-radius;
// explicitly place element in 3D space
// Safari seems to sometimes get confused
// and disregard border radius in some cases
transform: translateZ(0);
border-radius: $border-radius;
}
@mixin content-padding {

60
frontend/app/src/theme/variables.scss
View File

@@ -12,24 +12,44 @@
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
// Ionic Variables and Theming. For more info, please see:
// http://ionicframework.com/docs/theming/
@import 'colors';
@import './colors';
@import '~swiper/css/navigation';
// Import all other styles
@import './fonts';
@import './common/typo';
@import './common/helper';
@import './common/ion-button';
@import './common/ion-header';
@import './common/ion-input';
@import './common/ion-modal';
@import './common/ion-popover';
@import './common/ion-refresher';
@import './common/ion-toolbar';
@import './common/ion-menu';
@import './common/swiper';
@import './common/typography';
@import './common/leaflet-tile';
@import './common/ion-searchbar';
@import './components/image-dark';
@import './components/card';
@import './components/section';
/** Ionic CSS Variables **/
:root {
// Fonts
--ion-font-family: 'Barlow', Helvetica, Arial, sans-serif;
--headline-font-family: 'Barlow Condensed', Helvetica, Arial, sans-serif;
--ion-font-family: 'Barlow', helvetica, arial, sans-serif;
--headline-font-family: 'Barlow Condensed', helvetica, arial, sans-serif;
--font-size-xxs: 10px;
--font-size-xs: 12px;
--font-size-sm: 14px;
--font-size-md: 16px;
--font-size-lg: 20px;
--font-size-xl: 24px;
--font-weight-thin: 200;
--font-weight-regular: 400;
--font-weight-semi-bold: 700;
@@ -43,18 +63,13 @@
--spacing-lg: 16px;
--spacing-xl: 20px;
--spacing-xxl: 24px;
--border-width-default: 1px;
--border-radius-default: 8px;
--header-spacing-bottom: 70px;
--navigation-rail-width: 80px;
--navigation-rail-item-height: 56px;
--icon-stroke-width: 1.2;
--tablet-top-bar-height: 96px;
--ion-tabbar-height: 50px;
}
@@ -63,26 +78,3 @@ body {
font-family: var(--ion-font-family);
background-color: var(--ion-color-primary);
}
@import '~swiper/css/navigation';
// Import all other styles
@import 'fonts';
@import 'common/typo';
@import 'common/helper';
@import 'common/ion-button';
@import 'common/ion-header';
@import 'common/ion-input';
@import 'common/ion-modal';
@import 'common/ion-popover';
@import 'common/ion-refresher';
@import 'common/ion-toolbar';
@import 'common/ion-menu';
@import 'common/swiper';
@import 'common/typography';
@import 'common/leaflet-tile';
@import 'common/ion-searchbar';
@import 'components/image-dark';
@import 'components/card';
@import 'components/section';

477
pnpm-lock.yaml generated
View File

@@ -1050,6 +1050,21 @@ importers:
protractor:
specifier: 7.0.0
version: 7.0.0
stylelint:
specifier: 15.10.1
version: 15.10.1
stylelint-config-clean-order:
specifier: 5.0.1
version: 5.0.1(stylelint@15.10.1)
stylelint-config-prettier-scss:
specifier: 1.0.0
version: 1.0.0(stylelint@15.10.1)
stylelint-config-recommended-scss:
specifier: 12.0.0
version: 12.0.0(postcss@8.4.26)(stylelint@15.10.1)
stylelint-config-standard-scss:
specifier: 10.0.0
version: 10.0.0(postcss@8.4.26)(stylelint@15.10.1)
surge:
specifier: 0.23.1
version: 0.23.1
@@ -5172,6 +5187,31 @@ packages:
dependencies:
'@jridgewell/trace-mapping': 0.3.9
/@csstools/css-parser-algorithms@2.3.0(@csstools/css-tokenizer@2.1.1):
resolution: {integrity: sha512-dTKSIHHWc0zPvcS5cqGP+/TPFUJB0ekJ9dGKvMAFoNuBFhDPBt9OMGNZiIA5vTiNdGHHBeScYPXIGBMnVOahsA==}
engines: {node: ^14 || ^16 || >=18}
peerDependencies:
'@csstools/css-tokenizer': ^2.1.1
dependencies:
'@csstools/css-tokenizer': 2.1.1
dev: true
/@csstools/css-tokenizer@2.1.1:
resolution: {integrity: sha512-GbrTj2Z8MCTUv+52GE0RbFGM527xuXZ0Xa5g0Z+YN573uveS4G0qi6WNOMyz3yrFM/jaILTTwJ0+umx81EzqfA==}
engines: {node: ^14 || ^16 || >=18}
dev: true
/@csstools/media-query-list-parser@2.1.2(@csstools/css-parser-algorithms@2.3.0)(@csstools/css-tokenizer@2.1.1):
resolution: {integrity: sha512-M8cFGGwl866o6++vIY7j1AKuq9v57cf+dGepScwCcbut9ypJNr4Cj+LLTWligYUZ0uyhEoJDKt5lvyBfh2L3ZQ==}
engines: {node: ^14 || ^16 || >=18}
peerDependencies:
'@csstools/css-parser-algorithms': ^2.3.0
'@csstools/css-tokenizer': ^2.1.1
dependencies:
'@csstools/css-parser-algorithms': 2.3.0(@csstools/css-tokenizer@2.1.1)
'@csstools/css-tokenizer': 2.1.1
dev: true
/@csstools/postcss-progressive-custom-properties@1.3.0(postcss@8.4.5):
resolution: {integrity: sha512-ASA9W1aIy5ygskZYuWams4BzafD12ULvSypmaLJT2jvQ8G0M3I8PRQhC0h7mG0Z3LI05+agZjqSR9+K9yaQQjA==}
engines: {node: ^12 || ^14 || >=16}
@@ -5191,6 +5231,15 @@ packages:
postcss-selector-parser: 6.0.13
dev: true
/@csstools/selector-specificity@3.0.0(postcss-selector-parser@6.0.13):
resolution: {integrity: sha512-hBI9tfBtuPIi885ZsZ32IMEU/5nlZH/KOVYJCOh7gyMxaVLGmLedYqFN6Ui1LXkI8JlC8IsuC0rF0btcRZKd5g==}
engines: {node: ^14 || ^16 || >=18}
peerDependencies:
postcss-selector-parser: ^6.0.13
dependencies:
postcss-selector-parser: 6.0.13
dev: true
/@cypress/request@2.88.11:
resolution: {integrity: sha512-M83/wfQ1EkspjkE2lNWNV5ui2Cv7UCv1swW1DqljahbzLVWltcsexQh8jYtuS/vzFXP+HySntGM83ZXA9fn17w==}
engines: {node: '>= 6'}
@@ -8280,6 +8329,10 @@ packages:
/balanced-match@1.0.2:
resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
/balanced-match@2.0.0:
resolution: {integrity: sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==}
dev: true
/base64-js@1.3.1:
resolution: {integrity: sha512-mLQ4i2QO1ytvGWFWmcngKO//JXAQueZvwEKtjgQFM4jIK0kU+ytMfplL8j+n5mspOfjHwoAg+9yhb7BwAHm36g==}
dev: true
@@ -8724,6 +8777,16 @@ packages:
quick-lru: 4.0.1
dev: true
/camelcase-keys@7.0.2:
resolution: {integrity: sha512-Rjs1H+A9R+Ig+4E/9oyB66UC5Mj9Xq3N//vcLf2WzgdTi/3gUu3Z9KoqmlrEG4VuuLK8wJHofxzdQXz/knhiYg==}
engines: {node: '>=12'}
dependencies:
camelcase: 6.3.0
map-obj: 4.3.0
quick-lru: 5.1.1
type-fest: 1.4.0
dev: true
/camelcase@5.3.1:
resolution: {integrity: sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==}
engines: {node: '>=6'}
@@ -9077,6 +9140,10 @@ packages:
color-string: 1.9.1
dev: true
/colord@2.9.3:
resolution: {integrity: sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw==}
dev: true
/colorette@2.0.20:
resolution: {integrity: sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w==}
dev: true
@@ -9505,6 +9572,16 @@ packages:
parse-json: 5.2.0
path-type: 4.0.0
/cosmiconfig@8.2.0:
resolution: {integrity: sha512-3rTMnFJA1tCOPwRxtgF4wd7Ab2qvDbL8jX+3smjIbS4HlZBagTlpERbdN7iAbWlrfxE3M8c27kTwTawQ7st+OQ==}
engines: {node: '>=14'}
dependencies:
import-fresh: 3.3.0
js-yaml: 4.1.0
parse-json: 5.2.0
path-type: 4.0.0
dev: true
/cpu-features@0.0.8:
resolution: {integrity: sha512-BbHBvtYhUhksqTjr6bhNOjGgMnhwhGTQmOoZGD+K7BCaQDCuZl/Ve1ZxUSMRwVC4D/rkCPQ2MAIeYzrWyK7eEg==}
engines: {node: '>=10.0.0'}
@@ -9525,7 +9602,7 @@ packages:
css-select: 4.3.0
parse5: 6.0.1
parse5-htmlparser2-tree-adapter: 6.0.1
postcss: 8.4.5
postcss: 8.4.26
pretty-bytes: 5.6.0
dev: true
@@ -9572,6 +9649,11 @@ packages:
postcss-selector-parser: 6.0.13
dev: true
/css-functions-list@3.2.0:
resolution: {integrity: sha512-d/jBMPyYybkkLVypgtGv12R+pIFw4/f/IHtCTxWpZc8ofTYOPigIgmA6vu5rMHartZC+WuXhBUHfnyNUIQSYrg==}
engines: {node: '>=12.22'}
dev: true
/css-has-pseudo@3.0.4(postcss@8.4.5):
resolution: {integrity: sha512-Vse0xpR1K9MNlp2j5w1pgWIJtm1a8qS0JwS9goFYcImjlHEmywP9VUF05aGBXzGpDJF86QXk4L0ypBmwPhGArw==}
engines: {node: ^12 || ^14 || >=16}
@@ -9589,12 +9671,12 @@ packages:
peerDependencies:
webpack: ^5.0.0
dependencies:
icss-utils: 5.1.0(postcss@8.4.5)
postcss: 8.4.5
postcss-modules-extract-imports: 3.0.0(postcss@8.4.5)
postcss-modules-local-by-default: 4.0.3(postcss@8.4.5)
postcss-modules-scope: 3.0.0(postcss@8.4.5)
postcss-modules-values: 4.0.0(postcss@8.4.5)
icss-utils: 5.1.0(postcss@8.4.26)
postcss: 8.4.26
postcss-modules-extract-imports: 3.0.0(postcss@8.4.26)
postcss-modules-local-by-default: 4.0.3(postcss@8.4.26)
postcss-modules-scope: 3.0.0(postcss@8.4.26)
postcss-modules-values: 4.0.0(postcss@8.4.26)
postcss-value-parser: 4.2.0
semver: 7.3.8
webpack: 5.76.1(esbuild@0.14.22)
@@ -9630,6 +9712,14 @@ packages:
nth-check: 2.1.1
dev: true
/css-tree@2.3.1:
resolution: {integrity: sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==}
engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0}
dependencies:
mdn-data: 2.0.30
source-map-js: 1.0.2
dev: true
/css-what@6.1.0:
resolution: {integrity: sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==}
engines: {node: '>= 6'}
@@ -9868,6 +9958,11 @@ packages:
engines: {node: '>=10'}
dev: true
/decamelize@5.0.1:
resolution: {integrity: sha512-VfxadyCECXgQlkoEAjeghAr5gY3Hf+IKjKb+X8tGVDtveCjN+USwprd2q3QXBR9T1+x2DG0XZF5/w+7HAtSaXA==}
engines: {node: '>=10'}
dev: true
/decamelize@6.0.0:
resolution: {integrity: sha512-Fv96DCsdOgB6mdGl67MT5JaTNKRzrzill5OH5s8bjYJXVlcXyPYGyPsUkWyGV5p1TXI5esYIYMMeDJL0hEIwaA==}
engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
@@ -11331,6 +11426,11 @@ packages:
resolution: {integrity: sha512-W+KJc2dmILlPplD/H4K9l9LcAHAfPtP6BY84uVLXQ6Evcz9Lcg33Y2z1IVblT6xdY54PXYVHEv+0Wpq8Io6zkA==}
dev: true
/fastest-levenshtein@1.0.16:
resolution: {integrity: sha512-eRnCtTTtGZFpQCwhJiUOuxPQWRXVKYDn0b2PeHfXL6/Zi53SLAzAHfVhVWK2AryC/WH05kGfxhFIPvTF0SXQzg==}
engines: {node: '>= 4.9.1'}
dev: true
/fastq@1.15.0:
resolution: {integrity: sha512-wBrocU2LCXXa+lWBt8RoIRD89Fi8OdABODa/kEnyeyjS5aZO5/GNvI5sEINADqP/h8M29UHTHUb53sUu5Ihqdw==}
dependencies:
@@ -11952,6 +12052,22 @@ packages:
ini: 2.0.0
dev: true
/global-modules@2.0.0:
resolution: {integrity: sha512-NGbfmJBp9x8IxyJSd1P+otYK8vonoJactOogrVfFRIAEY1ukil8RSKDz2Yo7wh1oihl51l/r6W4epkeKJHqL8A==}
engines: {node: '>=6'}
dependencies:
global-prefix: 3.0.0
dev: true
/global-prefix@3.0.0:
resolution: {integrity: sha512-awConJSVCHVGND6x3tmMaKcQvwXLhjdkmomy2W+Goaui8YPgYgXJZewhg3fWC+DlfqqQuWg8AwqjGTD2nAPVWg==}
engines: {node: '>=6'}
dependencies:
ini: 1.3.8
kind-of: 6.0.3
which: 1.3.1
dev: true
/globals@11.12.0:
resolution: {integrity: sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==}
engines: {node: '>=4'}
@@ -12005,6 +12121,10 @@ packages:
pinkie-promise: 2.0.1
dev: true
/globjoin@0.1.4:
resolution: {integrity: sha512-xYfnw62CKG8nLkZBfWbhWwDw02CHty86jfPcc2cr3ZfeuK9ysoVPPEUxf21bAD/rWAgk52SuBrLJlefNy8mvFg==}
dev: true
/gopd@1.0.1:
resolution: {integrity: sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==}
dependencies:
@@ -12214,6 +12334,11 @@ packages:
resolution: {integrity: sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==}
dev: true
/html-tags@3.3.1:
resolution: {integrity: sha512-ztqyC3kLto0e9WbNp0aeP+M3kTt+nbaIveGmUxAtZa+8iFgKLUOD4YKM5j+f3QD89bra7UeumolZHKuOXnTmeQ==}
engines: {node: '>=8'}
dev: true
/htmlparser2@8.0.2:
resolution: {integrity: sha512-GYdjWKDkbRLkZ5geuHs5NY1puJ+PXwP7+fHPRz06Eirsb9ugf6d8kkXav6ADhcODhFFPMIXyxkxSuMf3D6NCFA==}
dependencies:
@@ -12450,13 +12575,13 @@ packages:
dependencies:
safer-buffer: 2.1.2
/icss-utils@5.1.0(postcss@8.4.5):
/icss-utils@5.1.0(postcss@8.4.26):
resolution: {integrity: sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==}
engines: {node: ^10 || ^12 || >= 14}
peerDependencies:
postcss: ^8.1.0
dependencies:
postcss: 8.4.5
postcss: 8.4.26
dev: true
/ieee754@1.2.1:
@@ -12500,6 +12625,11 @@ packages:
parent-module: 1.0.1
resolve-from: 4.0.0
/import-lazy@4.0.0:
resolution: {integrity: sha512-rKtvo6a868b5Hu3heneU+L4yEQ4jYKLtjpnPeUdK7h0yzXGmyBTypknlkCvHFBqfX9YlorEiMM6Dnq/5atfHkw==}
engines: {node: '>=8'}
dev: true
/imurmurhash@0.1.4:
resolution: {integrity: sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==}
engines: {node: '>=0.8.19'}
@@ -12508,6 +12638,11 @@ packages:
resolution: {integrity: sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==}
engines: {node: '>=8'}
/indent-string@5.0.0:
resolution: {integrity: sha512-m6FAo/spmsW2Ab2fU35JTYwtOKa2yAwXSwgjSv1TJzh4Mh7mC3lzAOVLBprb72XsTrgkEIsl7YrFNAiDiRhIGg==}
engines: {node: '>=12'}
dev: true
/infer-owner@1.0.4:
resolution: {integrity: sha512-IClj+Xz94+d7irH5qRyfJonOdfTzuDaifE6ZPWfx0N0+/ATZCbuTPq2prFl526urkQd90WyUKIh1DfBQ2hMz9A==}
dev: true
@@ -12876,6 +13011,11 @@ packages:
isobject: 3.0.1
dev: true
/is-plain-object@5.0.0:
resolution: {integrity: sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==}
engines: {node: '>=0.10.0'}
dev: true
/is-promise@4.0.0:
resolution: {integrity: sha512-hvpoI6korhJMnej285dSg6nu1+e6uxs7zG3BYAm5byqDsgJNWwxzM6z6iZiAgQR4TJ30JmBTOwqZUw3WlyH3AQ==}
dev: false
@@ -13437,6 +13577,10 @@ packages:
engines: {node: '>= 8'}
dev: true
/known-css-properties@0.27.0:
resolution: {integrity: sha512-uMCj6+hZYDoffuvAJjFAPz56E9uoowFHmTkqRtRq5WyC5Q6Cu/fTZKNQpX/RbzChBYLLl3lo8CjFZBAZXq9qFg==}
dev: true
/lazy-ass@1.6.0:
resolution: {integrity: sha512-cc8oEVoctTvsFZ/Oje/kGnHbpWHYBe8IAJe4C0QNc3t8uM/0Y8+erSz/7Y1ALuXTEZTMvxXwO6YbX1ey3ujiZw==}
engines: {node: '> 0.8'}
@@ -13753,6 +13897,10 @@ packages:
resolution: {integrity: sha512-+WKqsK294HMSc2jEbNgpHpd0JfIBhp7rEV4aqXWqFr6AlXov+SlcgB1Fv01y2kGe3Gc8nMW7VA0SrGuSkRfIEg==}
dev: true
/lodash.truncate@4.4.2:
resolution: {integrity: sha512-jttmRe7bRse52OsWIMDLaXxWqRAmtIUccAQ3garviCqJjafXOfNMO0yMfNpdD6zbGaTU0P5Nz7e7gAT6cKmJRw==}
dev: true
/lodash@4.17.21:
resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
@@ -13989,6 +14137,10 @@ packages:
resolution: {integrity: sha512-/C4LI/s8o1lz1M4AUA0qVQ3zqYGe3eF30ftRrtT48OY3pGOmScJFZo0TX0CGhoRNF2D59PNrpoccAyBBmtXoig==}
dev: false
/mathml-tag-names@2.1.3:
resolution: {integrity: sha512-APMBEanjybaPzUrfqU0IMU5I0AswKMH7k8OTLs0vvV4KZpExkTkY87nR/zpbuTPj+gARop7aGUbl11pnDfW6xg==}
dev: true
/md5@2.3.0:
resolution: {integrity: sha512-T1GITYmFaKuO91vxyoQMFETst+O71VUPEU3ze5GNzDm0OWdP8v1ziTaAEPUr/3kLsY3Sftgz242A1SetQiDL7g==}
dependencies:
@@ -13997,6 +14149,10 @@ packages:
is-buffer: 1.1.6
dev: true
/mdn-data@2.0.30:
resolution: {integrity: sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==}
dev: true
/media-typer@0.3.0:
resolution: {integrity: sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==}
engines: {node: '>= 0.6'}
@@ -14008,6 +14164,24 @@ packages:
fs-monkey: 1.0.4
dev: true
/meow@10.1.5:
resolution: {integrity: sha512-/d+PQ4GKmGvM9Bee/DPa8z3mXs/pkvJE2KEThngVNOqtmljC6K7NMPxtc2JeZYTmpWb9k/TmxjeL18ez3h7vCw==}
engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
dependencies:
'@types/minimist': 1.2.2
camelcase-keys: 7.0.2
decamelize: 5.0.1
decamelize-keys: 1.1.1
hard-rejection: 2.1.0
minimist-options: 4.1.0
normalize-package-data: 3.0.3
read-pkg-up: 8.0.0
redent: 4.0.0
trim-newlines: 4.1.1
type-fest: 1.4.0
yargs-parser: 20.2.9
dev: true
/meow@6.1.1:
resolution: {integrity: sha512-3YffViIt2QWgTy6Pale5QpopX/IvU3LPL03jOTqp6pGj3VjesdO/U8CuHMKpnQr4shCNCM5fd5XFFvIIl6JBHg==}
engines: {node: '>=8'}
@@ -14830,7 +15004,7 @@ packages:
'@yarnpkg/parsers': 3.0.0-rc.48.1
'@zkochan/js-yaml': 0.0.6
axios: 1.4.0
chalk: 4.1.0
chalk: 4.1.2
cli-cursor: 3.1.0
cli-spinners: 2.6.1
cliui: 7.0.4
@@ -15710,45 +15884,49 @@ packages:
postcss: 8.4.5
dev: true
/postcss-modules-extract-imports@3.0.0(postcss@8.4.5):
/postcss-media-query-parser@0.2.3:
resolution: {integrity: sha512-3sOlxmbKcSHMjlUXQZKQ06jOswE7oVkXPxmZdoB1r5l0q6gTFTQSHxNxOrCccElbW7dxNytifNEo8qidX2Vsig==}
dev: true
/postcss-modules-extract-imports@3.0.0(postcss@8.4.26):
resolution: {integrity: sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==}
engines: {node: ^10 || ^12 || >= 14}
peerDependencies:
postcss: ^8.1.0
dependencies:
postcss: 8.4.5
postcss: 8.4.26
dev: true
/postcss-modules-local-by-default@4.0.3(postcss@8.4.5):
/postcss-modules-local-by-default@4.0.3(postcss@8.4.26):
resolution: {integrity: sha512-2/u2zraspoACtrbFRnTijMiQtb4GW4BvatjaG/bCjYQo8kLTdevCUlwuBHx2sCnSyrI3x3qj4ZK1j5LQBgzmwA==}
engines: {node: ^10 || ^12 || >= 14}
peerDependencies:
postcss: ^8.1.0
dependencies:
icss-utils: 5.1.0(postcss@8.4.5)
postcss: 8.4.5
icss-utils: 5.1.0(postcss@8.4.26)
postcss: 8.4.26
postcss-selector-parser: 6.0.13
postcss-value-parser: 4.2.0
dev: true
/postcss-modules-scope@3.0.0(postcss@8.4.5):
/postcss-modules-scope@3.0.0(postcss@8.4.26):
resolution: {integrity: sha512-hncihwFA2yPath8oZ15PZqvWGkWf+XUfQgUGamS4LqoP1anQLOsOJw0vr7J7IwLpoY9fatA2qiGUGmuZL0Iqlg==}
engines: {node: ^10 || ^12 || >= 14}
peerDependencies:
postcss: ^8.1.0
dependencies:
postcss: 8.4.5
postcss: 8.4.26
postcss-selector-parser: 6.0.13
dev: true
/postcss-modules-values@4.0.0(postcss@8.4.5):
/postcss-modules-values@4.0.0(postcss@8.4.26):
resolution: {integrity: sha512-RDxHkAiEGI78gS2ofyvCsu7iycRv7oqw5xMWn9iMoR0N/7mf9D50ecQqUo5BZ9Zh2vH4bCUR/ktCqbB9m8vJjQ==}
engines: {node: ^10 || ^12 || >= 14}
peerDependencies:
postcss: ^8.1.0
dependencies:
icss-utils: 5.1.0(postcss@8.4.5)
postcss: 8.4.5
icss-utils: 5.1.0(postcss@8.4.26)
postcss: 8.4.26
dev: true
/postcss-nesting@10.2.0(postcss@8.4.5):
@@ -15850,6 +16028,28 @@ packages:
postcss: 8.4.5
dev: true
/postcss-resolve-nested-selector@0.1.1:
resolution: {integrity: sha512-HvExULSwLqHLgUy1rl3ANIqCsvMS0WHss2UOsXhXnQaZ9VCc2oBvIpXrl00IUFT5ZDITME0o6oiXeiHr2SAIfw==}
dev: true
/postcss-safe-parser@6.0.0(postcss@8.4.26):
resolution: {integrity: sha512-FARHN8pwH+WiS2OPCxJI8FuRJpTVnn6ZNFiqAM2aeW2LwTHWWmWgIyKC6cUo0L8aeKiF/14MNvnpls6R2PBeMQ==}
engines: {node: '>=12.0'}
peerDependencies:
postcss: ^8.3.3
dependencies:
postcss: 8.4.26
dev: true
/postcss-scss@4.0.6(postcss@8.4.26):
resolution: {integrity: sha512-rLDPhJY4z/i4nVFZ27j9GqLxj1pwxE80eAzUNRMXtcpipFYIeowerzBgG3yJhMtObGEXidtIgbUpQ3eLDsf5OQ==}
engines: {node: '>=12.0'}
peerDependencies:
postcss: ^8.4.19
dependencies:
postcss: 8.4.26
dev: true
/postcss-selector-not@5.0.0(postcss@8.4.5):
resolution: {integrity: sha512-/2K3A4TCP9orP4TNS7u3tGdRFVKqz/E6pX3aGnriPG0jU78of8wsUcqE4QAhWEU0d+WnMSF93Ah3F//vUtK+iQ==}
peerDependencies:
@@ -15867,10 +16067,27 @@ packages:
util-deprecate: 1.0.2
dev: true
/postcss-sorting@8.0.2(postcss@8.4.26):
resolution: {integrity: sha512-M9dkSrmU00t/jK7rF6BZSZauA5MAaBW4i5EnJXspMwt4iqTh/L9j6fgMnbElEOfyRyfLfVbIHj/R52zHzAPe1Q==}
peerDependencies:
postcss: ^8.4.20
dependencies:
postcss: 8.4.26
dev: true
/postcss-value-parser@4.2.0:
resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==}
dev: true
/postcss@8.4.26:
resolution: {integrity: sha512-jrXHFF8iTloAenySjM/ob3gSj7pCu0Ji49hnjqzsgSRa50hkWCKD0HQ+gMNJkW38jBI68MpAAg7ZWwHwX8NMMw==}
engines: {node: ^10 || ^12 || >=14}
dependencies:
nanoid: 3.3.6
picocolors: 1.0.0
source-map-js: 1.0.2
dev: true
/postcss@8.4.5:
resolution: {integrity: sha512-jBDboWM8qpaqwkMwItqTQTiFikhs/67OYVvblFFTM7MrZjt6yMKd6r2kgXizEbTTljacm4NldIlZnhbjr84QYg==}
engines: {node: ^10 || ^12 || >=14}
@@ -16128,7 +16345,6 @@ packages:
/quick-lru@5.1.1:
resolution: {integrity: sha512-WuyALRjWPDGtt/wzJiadO5AXY+8hZ80hVpe6MyivgraREW751X3SbhRvG3eLKOYN+8VEvqLcf3wdnt44Z4S4SA==}
engines: {node: '>=10'}
dev: false
/quote-stream@1.0.2:
resolution: {integrity: sha512-kKr2uQ2AokadPjvTyKJQad9xELbZwYzWlNfI3Uz2j/ib5u6H9lDP7fUUR//rMycd0gv4Z5P1qXMfXR8YpIxrjQ==}
@@ -16244,6 +16460,15 @@ packages:
read-pkg: 5.2.0
type-fest: 0.8.1
/read-pkg-up@8.0.0:
resolution: {integrity: sha512-snVCqPczksT0HS2EC+SxUndvSzn6LRCwpfSvLrIfR5BKDQQZMaI6jPRC9dYvYFDRAuFEAnkwww8kBBNE/3VvzQ==}
engines: {node: '>=12'}
dependencies:
find-up: 5.0.0
read-pkg: 6.0.0
type-fest: 1.4.0
dev: true
/read-pkg@3.0.0:
resolution: {integrity: sha512-BLq/cCO9two+lBgiTYNqD6GdtK8s4NpaWrl6/rCO9w0TUS8oJl7cmToOZfRYllKTISY6nt1U7jQ53brmKqY6BA==}
engines: {node: '>=4'}
@@ -16262,6 +16487,16 @@ packages:
parse-json: 5.2.0
type-fest: 0.6.0
/read-pkg@6.0.0:
resolution: {integrity: sha512-X1Fu3dPuk/8ZLsMhEj5f4wFAF0DWoK7qhGJvgaijocXxBmSToKfbFtqbxMO7bVjNA1dmE5huAzjXj/ey86iw9Q==}
engines: {node: '>=12'}
dependencies:
'@types/normalize-package-data': 2.4.1
normalize-package-data: 3.0.3
parse-json: 5.2.0
type-fest: 1.4.0
dev: true
/read-yaml-file@1.1.0:
resolution: {integrity: sha512-VIMnQi/Z4HT2Fxuwg5KrY174U1VdUIASQVWXXyqtNRtxSr9IYkn1rsI6Tb6HsrHCmB7gVpNwX6JxPTHcH6IoTA==}
engines: {node: '>=6'}
@@ -16348,6 +16583,14 @@ packages:
strip-indent: 3.0.0
dev: true
/redent@4.0.0:
resolution: {integrity: sha512-tYkDkVVtYkSVhuQ4zBgfvciymHaeuel+zFKXShfDnFP5SyVEP7qo70Rf1jTOTCx3vGNAbnEi/xFkcfQVMIBWag==}
engines: {node: '>=12'}
dependencies:
indent-string: 5.0.0
strip-indent: 4.0.0
dev: true
/reflect-metadata@0.1.13:
resolution: {integrity: sha512-Ts1Y/anZELhSsjMcU605fU9RE4Oi3p5ORujwbIKXfWa+0Zxs510Qrmrce5/Jowq3cHSZSJqBjypxmHarc+vEWg==}
dev: true
@@ -16493,7 +16736,7 @@ packages:
adjust-sourcemap-loader: 4.0.0
convert-source-map: 1.9.0
loader-utils: 2.0.4
postcss: 8.4.5
postcss: 8.4.26
source-map: 0.6.1
dev: true
@@ -17582,6 +17825,13 @@ packages:
dependencies:
min-indent: 1.0.1
/strip-indent@4.0.0:
resolution: {integrity: sha512-mnVSV2l+Zv6BLpSD/8V87CW/y9EmmbYzGCIavsnsI6/nwn26DwffM/yztm30Z/I2DY9wdS3vXVCMnHDgZaVNoA==}
engines: {node: '>=12'}
dependencies:
min-indent: 1.0.1
dev: true
/strip-json-comments@2.0.1:
resolution: {integrity: sha512-4gB8na07fecVVkOI6Rs4e7T6NOTki5EmL7TUduTs6bu3EdnSycntVJ4re8kgZA+wx9IueI2Y11bfbgwtzuE0KQ==}
engines: {node: '>=0.10.0'}
@@ -17601,6 +17851,148 @@ packages:
through: 2.3.8
dev: true
/style-search@0.1.0:
resolution: {integrity: sha512-Dj1Okke1C3uKKwQcetra4jSuk0DqbzbYtXipzFlFMZtowbF1x7BKJwB9AayVMyFARvU8EDrZdcax4At/452cAg==}
dev: true
/stylelint-config-clean-order@5.0.1(stylelint@15.10.1):
resolution: {integrity: sha512-zKLXjTgrkZqiml0VXv7Syl11XLpzRErW+1/qSEjIQ+aHAFjGuRq6Uwal9OzxtDHvpoIhlc4wCYjougWDuLN5aA==}
peerDependencies:
stylelint: '>=14'
dependencies:
stylelint: 15.10.1
stylelint-order: 6.0.3(stylelint@15.10.1)
dev: true
/stylelint-config-prettier-scss@1.0.0(stylelint@15.10.1):
resolution: {integrity: sha512-Gr2qLiyvJGKeDk0E/+awNTrZB/UtNVPLqCDOr07na/sLekZwm26Br6yYIeBYz3ulsEcQgs5j+2IIMXCC+wsaQA==}
engines: {node: 14.* || 16.* || >= 18}
hasBin: true
peerDependencies:
stylelint: '>=15.0.0'
dependencies:
stylelint: 15.10.1
dev: true
/stylelint-config-recommended-scss@12.0.0(postcss@8.4.26)(stylelint@15.10.1):
resolution: {integrity: sha512-5Bb2mlGy6WLa30oNeKpZvavv2lowJUsUJO25+OA68GFTemlwd1zbFsL7q0bReKipOSU3sG47hKneZ6Nd+ctrFA==}
peerDependencies:
postcss: ^8.3.3
stylelint: ^15.5.0
peerDependenciesMeta:
postcss:
optional: true
dependencies:
postcss: 8.4.26
postcss-scss: 4.0.6(postcss@8.4.26)
stylelint: 15.10.1
stylelint-config-recommended: 12.0.0(stylelint@15.10.1)
stylelint-scss: 5.0.1(stylelint@15.10.1)
dev: true
/stylelint-config-recommended@12.0.0(stylelint@15.10.1):
resolution: {integrity: sha512-x6x8QNARrGO2sG6iURkzqL+Dp+4bJorPMMRNPScdvaUK8PsynriOcMW7AFDKqkWAS5wbue/u8fUT/4ynzcmqdQ==}
peerDependencies:
stylelint: ^15.5.0
dependencies:
stylelint: 15.10.1
dev: true
/stylelint-config-standard-scss@10.0.0(postcss@8.4.26)(stylelint@15.10.1):
resolution: {integrity: sha512-bChBEo1p3xUVWh/wenJI+josoMk21f2yuLDGzGjmKYcALfl2u3DFltY+n4UHswYiXghqXaA8mRh+bFy/q1hQlg==}
peerDependencies:
postcss: ^8.3.3
stylelint: ^15.5.0
peerDependenciesMeta:
postcss:
optional: true
dependencies:
postcss: 8.4.26
stylelint: 15.10.1
stylelint-config-recommended-scss: 12.0.0(postcss@8.4.26)(stylelint@15.10.1)
stylelint-config-standard: 33.0.0(stylelint@15.10.1)
dev: true
/stylelint-config-standard@33.0.0(stylelint@15.10.1):
resolution: {integrity: sha512-eyxnLWoXImUn77+ODIuW9qXBDNM+ALN68L3wT1lN2oNspZ7D9NVGlNHb2QCUn4xDug6VZLsh0tF8NyoYzkgTzg==}
peerDependencies:
stylelint: ^15.5.0
dependencies:
stylelint: 15.10.1
stylelint-config-recommended: 12.0.0(stylelint@15.10.1)
dev: true
/stylelint-order@6.0.3(stylelint@15.10.1):
resolution: {integrity: sha512-1j1lOb4EU/6w49qZeT2SQVJXm0Ht+Qnq9GMfUa3pMwoyojIWfuA+JUDmoR97Bht1RLn4ei0xtLGy87M7d29B1w==}
peerDependencies:
stylelint: ^14.0.0 || ^15.0.0
dependencies:
postcss: 8.4.26
postcss-sorting: 8.0.2(postcss@8.4.26)
stylelint: 15.10.1
dev: true
/stylelint-scss@5.0.1(stylelint@15.10.1):
resolution: {integrity: sha512-n87iCRZrr2J7//I/QFsDXxFLnHKw633U4qvWZ+mOW6KDAp/HLj06H+6+f9zOuTYy+MdGdTuCSDROCpQIhw5fvQ==}
peerDependencies:
stylelint: ^14.5.1 || ^15.0.0
dependencies:
postcss-media-query-parser: 0.2.3
postcss-resolve-nested-selector: 0.1.1
postcss-selector-parser: 6.0.13
postcss-value-parser: 4.2.0
stylelint: 15.10.1
dev: true
/stylelint@15.10.1:
resolution: {integrity: sha512-CYkzYrCFfA/gnOR+u9kJ1PpzwG10WLVnoxHDuBA/JiwGqdM9+yx9+ou6SE/y9YHtfv1mcLo06fdadHTOx4gBZQ==}
engines: {node: ^14.13.1 || >=16.0.0}
hasBin: true
dependencies:
'@csstools/css-parser-algorithms': 2.3.0(@csstools/css-tokenizer@2.1.1)
'@csstools/css-tokenizer': 2.1.1
'@csstools/media-query-list-parser': 2.1.2(@csstools/css-parser-algorithms@2.3.0)(@csstools/css-tokenizer@2.1.1)
'@csstools/selector-specificity': 3.0.0(postcss-selector-parser@6.0.13)
balanced-match: 2.0.0
colord: 2.9.3
cosmiconfig: 8.2.0
css-functions-list: 3.2.0
css-tree: 2.3.1
debug: 4.3.4(supports-color@8.1.1)
fast-glob: 3.3.0
fastest-levenshtein: 1.0.16
file-entry-cache: 6.0.1
global-modules: 2.0.0
globby: 11.1.0
globjoin: 0.1.4
html-tags: 3.3.1
ignore: 5.2.4
import-lazy: 4.0.0
imurmurhash: 0.1.4
is-plain-object: 5.0.0
known-css-properties: 0.27.0
mathml-tag-names: 2.1.3
meow: 10.1.5
micromatch: 4.0.5
normalize-path: 3.0.0
picocolors: 1.0.0
postcss: 8.4.26
postcss-resolve-nested-selector: 0.1.1
postcss-safe-parser: 6.0.0(postcss@8.4.26)
postcss-selector-parser: 6.0.13
postcss-value-parser: 4.2.0
resolve-from: 5.0.0
string-width: 4.2.3
strip-ansi: 6.0.1
style-search: 0.1.0
supports-hyperlinks: 3.0.0
svg-tags: 1.0.0
table: 6.8.1
write-file-atomic: 5.0.1
transitivePeerDependencies:
- supports-color
dev: true
/stylus-loader@6.2.0(stylus@0.56.0)(webpack@5.76.1):
resolution: {integrity: sha512-5dsDc7qVQGRoc6pvCL20eYgRUxepZ9FpeK28XhdXaIPP6kXr6nI1zAAKFQgP5OBkOfKaURp4WUpJzspg1f01Gg==}
engines: {node: '>= 12.13.0'}
@@ -17731,6 +18123,14 @@ packages:
dependencies:
has-flag: 4.0.0
/supports-hyperlinks@3.0.0:
resolution: {integrity: sha512-QBDPHyPQDRTy9ku4URNGY5Lah8PAaXs6tAAwp55sL5WCsSW7GIfdf6W5ixfziW+t7wh3GVvHyHHyQ1ESsoRvaA==}
engines: {node: '>=14.18'}
dependencies:
has-flag: 4.0.0
supports-color: 7.2.0
dev: true
/supports-preserve-symlinks-flag@1.0.0:
resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
engines: {node: '>= 0.4'}
@@ -17768,6 +18168,10 @@ packages:
url-parse-as-address: 1.0.0
dev: true
/svg-tags@1.0.0:
resolution: {integrity: sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA==}
dev: true
/swiper@8.4.5:
resolution: {integrity: sha512-zveyEFBBv4q1sVkbJHnuH4xCtarKieavJ4SxP0QEHvdpPLJRuD7j/Xg38IVVLbp7Db6qrPsLUePvxohYx39Agw==}
engines: {node: '>= 4.7.0'}
@@ -17800,6 +18204,17 @@ packages:
ts-toolbelt: 9.6.0
dev: true
/table@6.8.1:
resolution: {integrity: sha512-Y4X9zqrCftUhMeH2EptSSERdVKt/nEdijTOacGD/97EKjhQ/Qs8RTlEGABSJNNN8lac9kheH+af7yAkEWlgneA==}
engines: {node: '>=10.0.0'}
dependencies:
ajv: 8.12.0
lodash.truncate: 4.4.2
slice-ansi: 4.0.0
string-width: 4.2.3
strip-ansi: 6.0.1
dev: true
/tapable@2.2.1:
resolution: {integrity: sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==}
engines: {node: '>=6'}
@@ -18072,6 +18487,11 @@ packages:
engines: {node: '>=8'}
dev: true
/trim-newlines@4.1.1:
resolution: {integrity: sha512-jRKj0n0jXWo6kh62nA5TEh3+4igKDXLvzBJcPpiizP7oOolUrYIxmVBG9TOtHYFHoddUk6YvAkGeGoSVTXfQXQ==}
engines: {node: '>=12'}
dev: true
/ts-interface-checker@0.1.13:
resolution: {integrity: sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==}
dev: true
@@ -18411,6 +18831,11 @@ packages:
resolution: {integrity: sha512-4dbzIzqvjtgiM5rw1k5rEHtBANKmdudhGyBEajN01fEyhaAIhsoKNy6y7+IN93IfpFtwY9iqi7kD+xwKhQsNJA==}
engines: {node: '>=8'}
/type-fest@1.4.0:
resolution: {integrity: sha512-yGSza74xk0UG8k+pLh5oeoYirvIiWo5t0/o3zHHAO2tRDiZcxWP7fywNlXhqb6/r6sWvwi+RsyQMWhVLe4BVuA==}
engines: {node: '>=10'}
dev: true
/type-is@1.6.18:
resolution: {integrity: sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==}
engines: {node: '>= 0.6'}
@@ -19132,6 +19557,14 @@ packages:
typedarray-to-buffer: 3.1.5
dev: true
/write-file-atomic@5.0.1:
resolution: {integrity: sha512-+QU2zd6OTD8XWIJCbffaiQeH9U73qIqafo1x6V1snCWYGJf6cVE0cDR4D8xRzcEnfI21IFrUPzPGtcPf8AC+Rw==}
engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
dependencies:
imurmurhash: 0.1.4
signal-exit: 4.0.2
dev: true
/ws@7.5.9:
resolution: {integrity: sha512-F+P9Jil7UiSKSkppIiD94dN07AwvFixvLIj1Og1Rl9GGMuNipJnV9JzjD6XuqmAeiswGvUmNLjr5cFuXwNS77Q==}
engines: {node: '>=8.3.0'}