From 86229138da4e771e29bdef294fcf529900559c09 Mon Sep 17 00:00:00 2001 From: Tykayn Date: Thu, 10 Mar 2022 12:00:31 +0100 Subject: [PATCH] remove dom classes in popups --- .../components/header/header.component.scss | 3 + .../core/components/home/home.component.html | 86 ++++++++++--------- .../option-link/option-link.component.html | 4 +- .../steps/step-four/step-four.component.html | 45 ++++------ .../steps/step-one/step-one.component.html | 2 +- .../stepper/stepper.component.html | 28 +++--- .../language-selector.component.html | 8 +- .../language-selector.component.scss | 4 +- .../language-selector.component.ts | 2 +- src/styles/libraries/_overrides.scss | 54 ++++++++---- src/styles/partials/_buttons.scss | 11 +++ src/styles/partials/_typo.scss | 32 ++----- 12 files changed, 146 insertions(+), 133 deletions(-) diff --git a/src/app/core/components/header/header.component.scss b/src/app/core/components/header/header.component.scss index 8b4ef263..5e796772 100644 --- a/src/app/core/components/header/header.component.scss +++ b/src/app/core/components/header/header.component.scss @@ -8,6 +8,9 @@ width: 100%; background: $white; z-index: 2; + .logo-home-link { + padding: 0; + } } .app-title { color: $white !important; diff --git a/src/app/core/components/home/home.component.html b/src/app/core/components/home/home.component.html index 5264ba4d..8db1d3f7 100644 --- a/src/app/core/components/home/home.component.html +++ b/src/app/core/components/home/home.component.html @@ -3,42 +3,10 @@
-
-

titre h1

-

titre h2

-

titre h3

- - - - - - - - - -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-

+

{{ 'config.landing_title' | translate }} -

-

+ +

{{ 'config.landing_subtitle' | translate: { AppTitle: AppTitle } }}

@@ -68,6 +36,46 @@
+ +
+

Titre h1

+

Titre h2

+

Titre h3

+ + + + + + + + + +
+
+ Autres boutons: + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -75,8 +83,8 @@ -
+
-
+

{{ 'home.search_title' | translate }} diff --git a/src/app/features/administration/form/option-link/option-link.component.html b/src/app/features/administration/form/option-link/option-link.component.html index d889dddd..7af1eed3 100644 --- a/src/app/features/administration/form/option-link/option-link.component.html +++ b/src/app/features/administration/form/option-link/option-link.component.html @@ -36,8 +36,8 @@ -
-
-
- -
-
-

+ +

{{ 'hours.modal.title' | translate }}

@@ -144,18 +139,16 @@
-
-
- - -
+
+ +
diff --git a/src/app/features/administration/form/steps/step-one/step-one.component.html b/src/app/features/administration/form/steps/step-one/step-one.component.html index a304d4b3..91a9a1d9 100644 --- a/src/app/features/administration/form/steps/step-one/step-one.component.html +++ b/src/app/features/administration/form/steps/step-one/step-one.component.html @@ -61,7 +61,7 @@

- +

{{ 'creation.dialog' | translate }}

 diff --git a/src/app/features/administration/stepper/stepper.component.html b/src/app/features/administration/stepper/stepper.component.html index e995b6f9..bebb2f53 100644 --- a/src/app/features/administration/stepper/stepper.component.html +++ b/src/app/features/administration/stepper/stepper.component.html @@ -103,25 +103,23 @@ id="close_stepper" [modal]="true" [(visible)]="display_cancel_dialog" - [breakpoints]="{ '960px': '75vw' }" - [style]="{ width: '454px', 'border-radius': '1rem' }" + [breakpoints]="{ '600px': '75vw', '400px': '95vw' }" + [style]="{ width: '486px', 'border-radius': '1rem' }" [styleClass]="'roundToPercentWidth-borders'" [draggable]="false" [showHeader]="false" [resizable]="false" > -
- -
-

+ +

{{ 'popup.cancel.title' | translate }}

@@ -129,8 +127,8 @@

-
-
+
+
diff --git a/src/app/shared/components/selectors/language-selector/language-selector.component.html b/src/app/shared/components/selectors/language-selector/language-selector.component.html index aee696f6..0367895d 100644 --- a/src/app/shared/components/selectors/language-selector/language-selector.component.html +++ b/src/app/shared/components/selectors/language-selector/language-selector.component.html @@ -20,7 +20,7 @@ [modal]="true" [(visible)]="display_lang_dialog" [breakpoints]="['960px']" - [style]="{ width: '454px' }" + [style]="{ width: '486px' }" [draggable]="false" [showHeader]="false" [resizable]="true" @@ -29,8 +29,8 @@ id="lang_selector_modale" > -
-
+
+
-

+

{{ 'popup.languages.title' | translate }}

diff --git a/src/app/shared/components/selectors/language-selector/language-selector.component.scss b/src/app/shared/components/selectors/language-selector/language-selector.component.scss index 07e7dc91..74134a09 100644 --- a/src/app/shared/components/selectors/language-selector/language-selector.component.scss +++ b/src/app/shared/components/selectors/language-selector/language-selector.component.scss @@ -34,10 +34,10 @@ float: left; height: auto; min-height: auto; - margin: 0.5em; + margin-right: 2rem; + margin-bottom: 1rem; input { - //height: 1.5rem; display: none; } } diff --git a/src/app/shared/components/selectors/language-selector/language-selector.component.ts b/src/app/shared/components/selectors/language-selector/language-selector.component.ts index bacb6858..b061c822 100644 --- a/src/app/shared/components/selectors/language-selector/language-selector.component.ts +++ b/src/app/shared/components/selectors/language-selector/language-selector.component.ts @@ -16,7 +16,7 @@ export class LanguageSelectorComponent implements OnInit { public availableLanguages: any = ['FR', 'EN', 'ES']; language: string; language_to_apply: string; - display_lang_dialog: boolean = false; + display_lang_dialog: boolean = true; display_dynamic_langs: boolean = false; availableLanguagesStatic: any = [ diff --git a/src/styles/libraries/_overrides.scss b/src/styles/libraries/_overrides.scss index f655cd7a..f9f4d52c 100644 --- a/src/styles/libraries/_overrides.scss +++ b/src/styles/libraries/_overrides.scss @@ -22,31 +22,49 @@ $input-shadow: none; } // modal dialog -.p-dialog-content { - border-top-left-radius: 0.5rem; - border-top-right-radius: 0.5rem; -} -.p-dialog-footer { - border-bottom-left-radius: 0.5rem !important; - border-bottom-right-radius: 0.5rem !important; -} + .p-dialog { background: transparent !important; box-shadow: none; + font-family: $title_font !important; + max-width: $widescreen-width-main-column; + box-sizing: border-box; + + .title { + margin-top: 72px; + margin-bottom: 1rem; + @extend .is-3; + } + + .p-dialog-header { + color: $primary_color; + padding: 1rem; + } + + .p-dialog-content { + border-top-left-radius: 8px; + border-top-right-radius: 8px; + padding: 0 1em; + } + + .p-dialog-footer { + border-bottom-left-radius: 8px !important; + border-bottom-right-radius: 8px !important; + padding: 1rem; + + button { + margin-right: 0; + margin-left: 1rem; + } + } } .cancel-button-reject { background: none; - margin-right: -1.55rem; + margin-right: -0.5rem; + margin-top: 0.5rem; + padding: 0.5rem !important; float: right; - - .icon { - margin-left: 1rem; - height: 1rem; - width: 1rem; - margin-top: 0.2rem; - float: right; - } } .round-borders { @@ -81,5 +99,5 @@ button .icon:first-child:last-child, .p-datepicker table td > span:focus, .p-datepicker .p-datepicker-header .p-datepicker-prev:focus, .p-datepicker .p-datepicker-header .p-datepicker-next:focus { - outline: 3px solid $black !important; + outline: 3px solid $outline-color !important; } diff --git a/src/styles/partials/_buttons.scss b/src/styles/partials/_buttons.scss index c45e9aa4..77d5ba4b 100644 --- a/src/styles/partials/_buttons.scss +++ b/src/styles/partials/_buttons.scss @@ -108,6 +108,17 @@ a { .is-closing-popup { background: #fff; color: #6359cf !important; + font-weight: 400; + font-size: 16px; + line-height: 20px; + + .icon { + margin-left: 1rem; + height: 14px; + width: 14px; + margin-top: 0.15rem; + float: right; + } } .buttons-demo button { diff --git a/src/styles/partials/_typo.scss b/src/styles/partials/_typo.scss index 99d73978..5ef5b0c4 100644 --- a/src/styles/partials/_typo.scss +++ b/src/styles/partials/_typo.scss @@ -1,4 +1,5 @@ body { + font-family: $default_font; h1, h2, h3, @@ -27,8 +28,9 @@ body { color: $d-primary-intense; font-family: $title_font; font-weight: 700; - font-size: 20px; - line-height: 23px; + font-style: normal; + font-size: 24px; + line-height: 28px; margin-bottom: 1rem; } } @@ -49,32 +51,12 @@ body { color: $d-primary-intense; font-family: $title_font; font-weight: 700; - font-size: 20px; - line-height: 23px; + font-style: normal; + font-size: 24px; + line-height: 28px; margin-bottom: 1rem; } - .p-dialog { - font-family: $title_font !important; - max-width: $widescreen-width-main-column; - - .p-dialog-header { - color: $primary_color !important; - - .p-dialog-title { - font-size: 2rem; - } - } - - .p-dialog-content { - padding: 1rem 2rem; - } - - .p-dialog-footer { - padding: 3rem 2.5rem; - } - } - .nobold { font-weight: normal; }