From e84e1c01fff6dbf89f4cbd8ee58110a843a0a048 Mon Sep 17 00:00:00 2001 From: Yanick Minder Date: Fri, 20 Dec 2024 14:04:22 +0100 Subject: [PATCH] run prettier --- frontend/.prettierrc | 8 +- frontend/README.md | 21 +++-- .../application-banner.component.scss | 2 +- .../application-top-bar.component.scss | 2 +- .../check-in-form-ordinal.component.scss | 2 +- .../keyresult-detail.component.scss | 2 +- .../keyresult-type.component.scss | 2 +- .../keyresult/keyresult.component.scss | 2 +- .../objective/objective.component.scss | 2 +- .../dialog-template-core.component.scss | 2 +- .../custom/scoring/scoring.component.scss | 4 +- .../shared/sidepanel/sidepanel.component.scss | 2 +- .../add-edit-team-dialog.component.scss | 2 +- .../edit-okr-champion.component.scss | 2 +- .../member-list-mobile.component.scss | 2 +- .../member-list-table.component.scss | 2 +- .../member-list/member-list.component.scss | 2 +- .../team-list/team-list.component.scss | 2 +- .../team-management-banner.component.scss | 2 +- .../src/style/custom_angular.components.scss | 4 +- frontend/src/style/custom_angular.scss | 6 +- frontend/src/style/custom_bootstrap.scss | 14 ++-- frontend/src/style/styles.scss | 80 +++++++++---------- 23 files changed, 84 insertions(+), 85 deletions(-) diff --git a/frontend/.prettierrc b/frontend/.prettierrc index cc9131084c..fa51da29e7 100644 --- a/frontend/.prettierrc +++ b/frontend/.prettierrc @@ -1,6 +1,6 @@ { - "trailingComma": "es5", - "tabWidth": 2, - "semi": false, - "singleQuote": true, + "trailingComma": "es5", + "tabWidth": 2, + "semi": false, + "singleQuote": true } diff --git a/frontend/README.md b/frontend/README.md index 79ee611146..5c0712d9b5 100644 --- a/frontend/README.md +++ b/frontend/README.md @@ -30,7 +30,6 @@ Build: ## Formatting - We use **EsLint** and a variety of plugins to format html and ts files: https://eslint.org/ @@ -48,16 +47,16 @@ Open the html file in browser and you get a beautiful overview ## Cypress Tests - local setup - - start local Docker `docker-compose up` - - start local Server: `OkrApplication-E2E` - - start local Client: `npm run start` + - start local Docker `docker-compose up` + - start local Server: `OkrApplication-E2E` + - start local Client: `npm run start` - run selected Tests - - npm run `npm run cypress:open` - - in Cypress App, select `E2E Testing` and `Chrome` as Browser + - npm run `npm run cypress:open` + - in Cypress App, select `E2E Testing` and `Chrome` as Browser - run all tests - - npm run `npm run cypress:run` - - in Cypress App, select `E2E Testing` and `Chrome` as Browser + - npm run `npm run cypress:run` + - in Cypress App, select `E2E Testing` and `Chrome` as Browser - in case of failing Tests: - - stop and restart local Server - - stop and restart local Client - - re-run Cypress Tests + - stop and restart local Server + - stop and restart local Client + - re-run Cypress Tests diff --git a/frontend/src/app/components/application-banner/application-banner.component.scss b/frontend/src/app/components/application-banner/application-banner.component.scss index 9efe9b265f..6de85a2771 100644 --- a/frontend/src/app/components/application-banner/application-banner.component.scss +++ b/frontend/src/app/components/application-banner/application-banner.component.scss @@ -1,4 +1,4 @@ -@import "../style/variables"; +@import '../style/variables'; .header-content { padding-left: 1.5rem; diff --git a/frontend/src/app/components/application-top-bar/application-top-bar.component.scss b/frontend/src/app/components/application-top-bar/application-top-bar.component.scss index b1f8aa6596..30b03d13db 100644 --- a/frontend/src/app/components/application-top-bar/application-top-bar.component.scss +++ b/frontend/src/app/components/application-top-bar/application-top-bar.component.scss @@ -1,4 +1,4 @@ -@import "../style/variables"; +@import '../style/variables'; #topBarHeight { height: $top-bar-height; diff --git a/frontend/src/app/components/checkin/check-in-form-ordinal/check-in-form-ordinal.component.scss b/frontend/src/app/components/checkin/check-in-form-ordinal/check-in-form-ordinal.component.scss index 62b280fbef..b7febe31a8 100644 --- a/frontend/src/app/components/checkin/check-in-form-ordinal/check-in-form-ordinal.component.scss +++ b/frontend/src/app/components/checkin/check-in-form-ordinal/check-in-form-ordinal.component.scss @@ -1,4 +1,4 @@ -@import "../style/variables"; +@import '../style/variables'; .submit { background-color: $pz-dark-blue; diff --git a/frontend/src/app/components/keyresult-detail/keyresult-detail.component.scss b/frontend/src/app/components/keyresult-detail/keyresult-detail.component.scss index c54b98ea36..6ef90c271f 100644 --- a/frontend/src/app/components/keyresult-detail/keyresult-detail.component.scss +++ b/frontend/src/app/components/keyresult-detail/keyresult-detail.component.scss @@ -1,4 +1,4 @@ -@import "../style/variables"; +@import '../style/variables'; :host { flex: 1; diff --git a/frontend/src/app/components/keyresult-type/keyresult-type.component.scss b/frontend/src/app/components/keyresult-type/keyresult-type.component.scss index 0edb31b8a7..7c3339d6e5 100644 --- a/frontend/src/app/components/keyresult-type/keyresult-type.component.scss +++ b/frontend/src/app/components/keyresult-type/keyresult-type.component.scss @@ -1,4 +1,4 @@ -@import "custom_bootstrap"; +@import 'custom_bootstrap'; .active { border-left: #909090 1px solid; diff --git a/frontend/src/app/components/keyresult/keyresult.component.scss b/frontend/src/app/components/keyresult/keyresult.component.scss index f99afa0e47..5472cd869d 100644 --- a/frontend/src/app/components/keyresult/keyresult.component.scss +++ b/frontend/src/app/components/keyresult/keyresult.component.scss @@ -1,4 +1,4 @@ -@import "../style/variables"; +@import '../style/variables'; .key-result { background-color: $soft-grey; border: 1px solid $dark-grey-border; diff --git a/frontend/src/app/components/objective/objective.component.scss b/frontend/src/app/components/objective/objective.component.scss index 4bf3ed8826..c0ffb2c871 100644 --- a/frontend/src/app/components/objective/objective.component.scss +++ b/frontend/src/app/components/objective/objective.component.scss @@ -1,4 +1,4 @@ -@import "../style/variables"; +@import '../style/variables'; .objective { max-width: 750px; diff --git a/frontend/src/app/shared/custom/dialog-template-core/dialog-template-core.component.scss b/frontend/src/app/shared/custom/dialog-template-core/dialog-template-core.component.scss index 769a21b288..e8e54c3606 100644 --- a/frontend/src/app/shared/custom/dialog-template-core/dialog-template-core.component.scss +++ b/frontend/src/app/shared/custom/dialog-template-core/dialog-template-core.component.scss @@ -1,4 +1,4 @@ -@import "custom_bootstrap"; +@import 'custom_bootstrap'; mat-dialog-content { //scrollbar-gutter: stable both-edges; diff --git a/frontend/src/app/shared/custom/scoring/scoring.component.scss b/frontend/src/app/shared/custom/scoring/scoring.component.scss index fb974a0fea..cd0c366aa8 100644 --- a/frontend/src/app/shared/custom/scoring/scoring.component.scss +++ b/frontend/src/app/shared/custom/scoring/scoring.component.scss @@ -39,7 +39,7 @@ .stretch-div { width: 100%; - background-image: url("./../../../../assets/images/scoring-stars.svg"); + background-image: url('./../../../../assets/images/scoring-stars.svg'); height: 21px; margin-bottom: 3.5px; } @@ -57,7 +57,7 @@ } .score-stretch { - background-image: url("../../../../assets/images/scoring-stars.svg"); + background-image: url('../../../../assets/images/scoring-stars.svg'); } .value-label { diff --git a/frontend/src/app/shared/sidepanel/sidepanel.component.scss b/frontend/src/app/shared/sidepanel/sidepanel.component.scss index cc8b211b4b..a60a843a8a 100644 --- a/frontend/src/app/shared/sidepanel/sidepanel.component.scss +++ b/frontend/src/app/shared/sidepanel/sidepanel.component.scss @@ -1,4 +1,4 @@ -@import "../style/variables"; +@import '../style/variables'; .sidebar__content { padding: 32px; } diff --git a/frontend/src/app/team-management/add-edit-team-dialog/add-edit-team-dialog.component.scss b/frontend/src/app/team-management/add-edit-team-dialog/add-edit-team-dialog.component.scss index 004d42b7c7..4f1ff31381 100644 --- a/frontend/src/app/team-management/add-edit-team-dialog/add-edit-team-dialog.component.scss +++ b/frontend/src/app/team-management/add-edit-team-dialog/add-edit-team-dialog.component.scss @@ -1,4 +1,4 @@ -@import "../style/variables"; +@import '../style/variables'; .input-fields { margin-bottom: 0.5rem; diff --git a/frontend/src/app/team-management/edit-okr-champion/edit-okr-champion.component.scss b/frontend/src/app/team-management/edit-okr-champion/edit-okr-champion.component.scss index 42fd67b801..67dffa8bef 100644 --- a/frontend/src/app/team-management/edit-okr-champion/edit-okr-champion.component.scss +++ b/frontend/src/app/team-management/edit-okr-champion/edit-okr-champion.component.scss @@ -1,4 +1,4 @@ -@import "variables"; +@import 'variables'; :host { height: 40px; diff --git a/frontend/src/app/team-management/member-list/member-list-mobile/member-list-mobile.component.scss b/frontend/src/app/team-management/member-list/member-list-mobile/member-list-mobile.component.scss index d0705913e0..f4943b7964 100644 --- a/frontend/src/app/team-management/member-list/member-list-mobile/member-list-mobile.component.scss +++ b/frontend/src/app/team-management/member-list/member-list-mobile/member-list-mobile.component.scss @@ -1,4 +1,4 @@ -@import "variables"; +@import 'variables'; :host { padding-top: 2rem; diff --git a/frontend/src/app/team-management/member-list/member-list-table/member-list-table.component.scss b/frontend/src/app/team-management/member-list/member-list-table/member-list-table.component.scss index 2f0dd5c531..f08215edec 100644 --- a/frontend/src/app/team-management/member-list/member-list-table/member-list-table.component.scss +++ b/frontend/src/app/team-management/member-list/member-list-table/member-list-table.component.scss @@ -1,4 +1,4 @@ -@import "variables"; +@import 'variables'; .mat-column-icon { width: 40px; diff --git a/frontend/src/app/team-management/member-list/member-list.component.scss b/frontend/src/app/team-management/member-list/member-list.component.scss index be6472086d..6d448e985d 100644 --- a/frontend/src/app/team-management/member-list/member-list.component.scss +++ b/frontend/src/app/team-management/member-list/member-list.component.scss @@ -1,4 +1,4 @@ -@import "../../../style/_variables.scss"; +@import '../../../style/_variables.scss'; :host { width: 100%; diff --git a/frontend/src/app/team-management/team-list/team-list.component.scss b/frontend/src/app/team-management/team-list/team-list.component.scss index 40f9dab8e7..4c36a89425 100644 --- a/frontend/src/app/team-management/team-list/team-list.component.scss +++ b/frontend/src/app/team-management/team-list/team-list.component.scss @@ -1,4 +1,4 @@ -@import "../../../style/_variables.scss"; +@import '../../../style/_variables.scss'; :host { width: 100%; diff --git a/frontend/src/app/team-management/team-management-banner/team-management-banner.component.scss b/frontend/src/app/team-management/team-management-banner/team-management-banner.component.scss index edb1f2d3e6..979ed0b788 100644 --- a/frontend/src/app/team-management/team-management-banner/team-management-banner.component.scss +++ b/frontend/src/app/team-management/team-management-banner/team-management-banner.component.scss @@ -1,4 +1,4 @@ -@import "../../../style/_variables.scss"; +@import '../../../style/_variables.scss'; #okrBanner { position: relative; diff --git a/frontend/src/style/custom_angular.components.scss b/frontend/src/style/custom_angular.components.scss index 46e8b82be5..c9fc92c0dc 100644 --- a/frontend/src/style/custom_angular.components.scss +++ b/frontend/src/style/custom_angular.components.scss @@ -1,4 +1,4 @@ -@import "variables"; +@import 'variables'; .mdc-button { border-radius: 0.5rem !important; @@ -77,7 +77,7 @@ $scale-gap: 0.1; @for $i from calc($scale-start / $scale-gap) through calc($scale-end / $scale-gap) { $scale-value: $i * $scale-gap; - $selector: ".scale-#{$scale-value * 10}"; + $selector: '.scale-#{$scale-value * 10}'; #{$selector} { transform: scale(#{$scale-value}) !important; diff --git a/frontend/src/style/custom_angular.scss b/frontend/src/style/custom_angular.scss index 93b6a501ae..24dbe400b1 100644 --- a/frontend/src/style/custom_angular.scss +++ b/frontend/src/style/custom_angular.scss @@ -1,6 +1,6 @@ -@use "@angular/material" as mat; -@import "_variables"; -@import "custom_angular.components"; +@use '@angular/material' as mat; +@import '_variables'; +@import 'custom_angular.components'; $my-primary: mat.m2-define-palette($pz-dark-blue-palette, 500); $my-accent: mat.m2-define-palette(mat.$m2-grey-palette, 900); diff --git a/frontend/src/style/custom_bootstrap.scss b/frontend/src/style/custom_bootstrap.scss index d85da68297..301c6548d9 100644 --- a/frontend/src/style/custom_bootstrap.scss +++ b/frontend/src/style/custom_bootstrap.scss @@ -1,10 +1,10 @@ -@import "_variables"; +@import '_variables'; $theme-colors: ( - "pz-dark-blue": $pz-dark-blue, - "eggshell": $eggshell, - "display-element": $display-element, - "keyResult-attribute": $keyResult-attribute-bg, - "error": $error, + 'pz-dark-blue': $pz-dark-blue, + 'eggshell': $eggshell, + 'display-element': $display-element, + 'keyResult-attribute': $keyResult-attribute-bg, + 'error': $error, ); $enable-negative-margins: true; -@import "bootstrap"; +@import 'bootstrap'; diff --git a/frontend/src/style/styles.scss b/frontend/src/style/styles.scss index 9c376768f2..c7ab62b63c 100644 --- a/frontend/src/style/styles.scss +++ b/frontend/src/style/styles.scss @@ -1,8 +1,8 @@ -@import "custom_angular"; -@import "_variables"; -@import "custom_bootstrap"; -@import "fonts/Roboto"; -@import "fonts/MaterialIcons"; +@import 'custom_angular'; +@import '_variables'; +@import 'custom_bootstrap'; +@import 'fonts/Roboto'; +@import 'fonts/MaterialIcons'; html, body.okr { @@ -10,68 +10,68 @@ body.okr { margin: 0; padding: 0; background: var(--okr-overview-background-color); - font-family: Roboto, "sans-serif"; + font-family: Roboto, 'sans-serif'; --bs-body-font-family: Roboto; h1 { - font-family: Roboto, "sans-serif"; + font-family: Roboto, 'sans-serif'; font-size: 1.5rem; - font-variation-settings: "wght" 600; + font-variation-settings: 'wght' 600; } h2 { - font-family: Roboto, "sans-serif"; + font-family: Roboto, 'sans-serif'; font-size: 1.25rem; - font-variation-settings: "wght" 600; + font-variation-settings: 'wght' 600; word-wrap: anywhere; @extend .linebreak; margin-bottom: 0; } h3 { - font-family: Roboto, "sans-serif"; + font-family: Roboto, 'sans-serif'; font-size: 1rem; - font-variation-settings: "wght" 400; + font-variation-settings: 'wght' 400; word-wrap: anywhere; margin-bottom: 0; } h4 { - font-family: Roboto, "sans-serif"; + font-family: Roboto, 'sans-serif'; font-size: 0.875rem; font-weight: 400; margin-bottom: 0; } h5 { - font-family: Roboto, "sans-serif"; + font-family: Roboto, 'sans-serif'; font-size: 0.875rem; margin-bottom: 0; font-weight: 400; } p { - font-family: Roboto, "sans-serif"; - font-variation-settings: "wght" 400; + font-family: Roboto, 'sans-serif'; + font-variation-settings: 'wght' 400; margin: 0; font-size: 14px; } span { - font-family: Roboto, "sans-serif"; - font-variation-settings: "wght" 400; + font-family: Roboto, 'sans-serif'; + font-variation-settings: 'wght' 400; font-size: 14px; } .quarter-filter-text span { - font-family: Roboto, "sans-serif"; - font-variation-settings: "wght" 400; + font-family: Roboto, 'sans-serif'; + font-variation-settings: 'wght' 400; font-size: 16px; } a { - font-family: Roboto, "sans-serif"; - font-variation-settings: "wght" 400; + font-family: Roboto, 'sans-serif'; + font-variation-settings: 'wght' 400; color: $pz-dark-blue; text-decoration: none; font-size: 0.875rem; @@ -79,16 +79,16 @@ body.okr { } .font-size-14 { - font-family: Roboto, "sans-serif"; - font-variation-settings: "wght" 400; + font-family: Roboto, 'sans-serif'; + font-variation-settings: 'wght' 400; font-size: 0.875rem; } } // TODO: Find a better way to override the Angular Material default font once Angular 19 is installed. https://material.angular.io/guide/theming * { - font-family: Roboto, "sans-serif"; - font-variation-settings: "wght" 400; + font-family: Roboto, 'sans-serif'; + font-variation-settings: 'wght' 400; } .linebreak { @@ -125,15 +125,15 @@ body pzsh-backdrop { } .text-small { - font-family: Roboto, "sans-serif"; - font-variation-settings: "wght" 400; + font-family: Roboto, 'sans-serif'; + font-variation-settings: 'wght' 400; font-size: 1rem; } @media screen and (max-width: 580px) { .text-small { - font-family: Roboto, "sans-serif"; - font-variation-settings: "wght" 400; + font-family: Roboto, 'sans-serif'; + font-variation-settings: 'wght' 400; font-size: 0.8rem; } } @@ -171,7 +171,7 @@ input textarea { textarea, input:not([type]), -input[type="text"] { +input[type='text'] { @extend .ps-1; } @@ -186,8 +186,8 @@ input[type="text"] { } .mat-mdc-checkbox .mdc-form-field { - font-family: Roboto, "sans-serif"; - font-variation-settings: "wght" 400; + font-family: Roboto, 'sans-serif'; + font-variation-settings: 'wght' 400; font-size: 1rem !important; } @@ -262,8 +262,8 @@ mat-form-field.quarter-filter .mat-mdc-text-field-wrapper { } .sub-title-keyresult { - font-family: Roboto, "sans-serif"; - font-variation-settings: "wght" 400; + font-family: Roboto, 'sans-serif'; + font-variation-settings: 'wght' 400; font-size: 0.9rem !important; } @@ -277,8 +277,8 @@ img.add-cross-button { } .add-text { - font-family: Roboto, "sans-serif"; - font-variation-settings: "wght" 500; + font-family: Roboto, 'sans-serif'; + font-variation-settings: 'wght' 500; margin-top: 1px; height: 2rem; } @@ -339,8 +339,8 @@ table.okr-table { } > th { - font-family: Roboto, "sans-serif"; - font-variation-settings: "wght" 700; + font-family: Roboto, 'sans-serif'; + font-variation-settings: 'wght' 700; vertical-align: bottom; font-size: 0.75rem; border: none; @@ -403,7 +403,7 @@ table.okr-table { } } -@import "custom_bootstrap"; +@import 'custom_bootstrap'; .spinner-container { @extend .mt-5;