tykayn
/
funky-framadate-front
mirror of https://framagit.org/framasoft/framadate/funky-framadate-front.git
1
1
Fork 0
Code Issues Projects Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/app/features/administration/stepper/stepper.component.html
View File

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

13
src/app/features/administration/stepper/stepper.component.scss
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;
}
} }