contain mobile menu

This commit is contained in:
Tykayn 2022-02-11 12:18:20 +01:00 committed by tykayn
parent 8a39c43ead
commit 0dfdc0b4e0
2 changed files with 31 additions and 20 deletions

View File

@ -152,6 +152,16 @@
</ng-template> </ng-template>
</p-dialog> </p-dialog>
<div id="mobile_menu" *ngIf="display_mobile_menu"> <div id="mobile_menu" *ngIf="display_mobile_menu">
<div class="menu-content">
<div class="padded">
<button
id="close_menu"
class="button cancel-button-reject pull-right img-marged-left"
(click)="focusOnCancelButton()"
>
{{ 'SENTENCES.Close' | translate }}
<img class="icon" src="assets/icons/x_blue.svg" />
</button>
<h2 class="title is-2 has-text-primary">Menu</h2> <h2 class="title is-2 has-text-primary">Menu</h2>
<div class="langs"> <div class="langs">
<app-language-selector class="nav-button" [idSuffix]="'_mobile'"></app-language-selector> <app-language-selector class="nav-button" [idSuffix]="'_mobile'"></app-language-selector>
@ -167,4 +177,6 @@
</button> </button>
</div> </div>
</div> </div>
</div>
</div>
</section> </section>

View File

@ -45,7 +45,7 @@
margin: 0; margin: 0;
width: 100%; width: 100%;
position: relative; position: relative;
top: 4px; top: 0;
display: block; display: block;
min-width: 1px; min-width: 1px;
height: 4px; height: 4px;
@ -54,7 +54,7 @@
.step-bar-progress { .step-bar-progress {
position: relative; position: relative;
top: 0; top: -4px;
left: 0; left: 0;
height: 4px; height: 4px;
display: block; display: block;
@ -152,11 +152,6 @@
border-color: $primary_color; border-color: $primary_color;
color: $primary_color; color: $primary_color;
} }
#mobile_menu {
.cancel-button-stepper {
padding: 1rem 2rem;
}
}
.cancel-button-confirm { .cancel-button-confirm {
color: $white !important; color: $white !important;
@ -230,8 +225,12 @@
} }
} }
#mobile_menu { #mobile_menu {
top: -4px;
width: 100%; width: 100%;
background: #fff; background: #fff;
padding: 0.75rem; padding: 0.75rem;
height: 100vh; height: 100vh;
.cancel-button-stepper {
padding: 1rem 2rem;
}
} }