diff --git a/src/app/core/components/header/header.component.scss b/src/app/core/components/header/header.component.scss index f7f3ff42..724975d3 100644 --- a/src/app/core/components/header/header.component.scss +++ b/src/app/core/components/header/header.component.scss @@ -1,6 +1,12 @@ @import '../../../../styles/variables'; .big-header { height: $home-nav-height; + box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05); + position: fixed; + top: 0; + width: 100%; + background: $white; + z-index: 2; } .app-title { color: $white !important; diff --git a/src/app/features/administration/stepper/stepper.component.html b/src/app/features/administration/stepper/stepper.component.html index 8985ad44..9d704863 100644 --- a/src/app/features/administration/stepper/stepper.component.html +++ b/src/app/features/administration/stepper/stepper.component.html @@ -54,11 +54,7 @@
- - + + menu burger + + + + +
@@ -145,4 +146,7 @@ +
+ coucou le menu mobile +
diff --git a/src/app/features/administration/stepper/stepper.component.ts b/src/app/features/administration/stepper/stepper.component.ts index c26b91de..010acb20 100644 --- a/src/app/features/administration/stepper/stepper.component.ts +++ b/src/app/features/administration/stepper/stepper.component.ts @@ -19,6 +19,7 @@ export class StepperComponent { public step_max: number = 5; public environment = environment; display_cancel_dialog: boolean = false; + display_mobile_menu: boolean = false; constructor( public pollService: PollService, @@ -52,4 +53,8 @@ export class StepperComponent { this.display_cancel_dialog = false; this.router.navigate(['/']); } + + toggle_mobile_menu() { + this.display_mobile_menu = !this.display_mobile_menu; + } } 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 3d68d9c8..f8a00e5f 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 @@ -1,7 +1,6 @@ @import './../../../../../styles/variables'; #lang_selector { - background: white; max-width: 15em; width: 15em !important; .top { @@ -9,6 +8,9 @@ width: 100%; } } +#lang_button_popup { + background: transparent !important; +} .language-selector-container { cursor: pointer; @@ -34,5 +36,5 @@ padding: 0 1rem; display: block; line-height: 2rem; - height: 4rem; + height: $stepper-nav-height; } diff --git a/src/styles/partials/_responsive.scss b/src/styles/partials/_responsive.scss index 1d07c9b5..2558f983 100644 --- a/src/styles/partials/_responsive.scss +++ b/src/styles/partials/_responsive.scss @@ -2,6 +2,12 @@ // small screens @media (max-width: 487px) { + .is-hidden-smallest-screen { + display: none; + } + .is-visible-smallest-screen { + display: block; + } .big-header { height: $home-nav-height-small; } @@ -16,6 +22,14 @@ } } #creation_stepper { + .logo-home-link { + padding: 0; + margin: 0; + img { + padding: 0; + margin: 0; + } + } .step-info { height: 4.5rem; } @@ -30,7 +44,13 @@ max-width: 18ch; } } -@media (min-width: 380px) { +@media (min-width: 488px) { + .is-hidden-smallest-screen { + display: block; + } + .is-visible-smallest-screen { + display: none; + } .feedback-container { //position: fixed; } diff --git a/src/styles/variables.scss b/src/styles/variables.scss index c52e7fab..9662000f 100644 --- a/src/styles/variables.scss +++ b/src/styles/variables.scss @@ -79,8 +79,8 @@ $mobile-size: 25rem; $header-nav-height: 4.85rem; $header-nav-inner-height: 4.5rem; $widescreen-width-main-column: 75rem; -$stepper-nav-height: 4.5rem; -$home-nav-height: 4.5rem; +$stepper-nav-height: 56px; +$home-nav-height: 56px; $home-nav-height-small: 3.5rem; // datepicker $cell-size: 30px;