mirror of
https://framagit.org/framasoft/framadate/funky-framadate-front.git
synced 2023-08-25 13:53:14 +02:00
smaller height of nav
This commit is contained in:
parent
0fde16e14f
commit
cc79114c79
@ -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;
|
||||
|
@ -54,11 +54,7 @@
|
||||
<div class="step-info">
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<a
|
||||
class="logo-home-link navbar-item pull-left is-hidden-mobile"
|
||||
routerLink="/"
|
||||
routerLinkActive="active"
|
||||
>
|
||||
<a class="logo-home-link navbar-item pull-left" routerLink="/" routerLinkActive="active">
|
||||
<img
|
||||
class="stepper-app-logo"
|
||||
*ngIf="environment.appLogo"
|
||||
@ -87,15 +83,20 @@
|
||||
</h1>
|
||||
</div>
|
||||
<div class="column has-text-right is-narrow">
|
||||
<app-language-selector class="nav-button"></app-language-selector>
|
||||
<button
|
||||
class="nav-button cancel-button-stepper"
|
||||
(click)="showCancelDialog()"
|
||||
id="display_cancel_popup_button"
|
||||
aria-haspopup="dialog"
|
||||
>
|
||||
{{ 'nav.leave' | translate }}
|
||||
</button>
|
||||
<span class="is-visible-smallest-screen" (click)="toggle_mobile_menu()">
|
||||
menu burger
|
||||
</span>
|
||||
<span class="is-hidden-smallest-screen">
|
||||
<app-language-selector class="nav-button"></app-language-selector>
|
||||
<button
|
||||
class="nav-button cancel-button-stepper"
|
||||
(click)="showCancelDialog()"
|
||||
id="display_cancel_popup_button"
|
||||
aria-haspopup="dialog"
|
||||
>
|
||||
{{ 'nav.leave' | translate }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -145,4 +146,7 @@
|
||||
</div>
|
||||
</ng-template>
|
||||
</p-dialog>
|
||||
<div id="mobile_menu" *ngIf="display_mobile_menu">
|
||||
coucou le menu mobile
|
||||
</div>
|
||||
</section>
|
||||
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
@ -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;
|
||||
}
|
||||
|
@ -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;
|
||||
}
|
||||
|
@ -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;
|
||||
|
Loading…
Reference in New Issue
Block a user