displace buttons for nav and stepper

This commit is contained in:
Tykayn 2021-12-09 10:38:13 +01:00 committed by tykayn
parent c673bfaf52
commit 7575e9ca50
5 changed files with 57 additions and 35 deletions

View File

@ -1,30 +1,32 @@
<div class="bottom-step-buttons"> <div class="bottom-step-buttons">
<div class="columns"> <div class="container">
<div class="column"> <div class="columns half-columns">
<button <div class="column is-narrow-mobile">
*ngIf="display_previous_button" <button
class="button button-previous is-secondary is-fullwidth" *ngIf="display_previous_button"
[routerLink]="['/administration/step/' + previous_step_number]" class="button button-previous is-secondary is-fullwidth"
> [routerLink]="['/administration/step/' + previous_step_number]"
Précédent >
</button> Précédent
</div> </button>
<div class="column"> </div>
<button <div class="column is-narrow-mobile">
*ngIf="display_next_button" <button
class="button button-next is-fullwidth" *ngIf="display_next_button"
[ngClass]="{ 'is-finish': is_finish_step, 'is-primary': !is_finish_step }" class="button button-next is-fullwidth"
[routerLink]="['/administration/step/' + next_step_number]" [ngClass]="{ 'is-finish': is_finish_step, 'is-primary': !is_finish_step }"
(click)="runEndAction()" [routerLink]="['/administration/step/' + next_step_number]"
> (click)="runEndAction()"
<span *ngIf="is_finish_step"> >
<i class="fa fa-save"></i> <span *ngIf="is_finish_step">
Enregistrer le sondage <i class="fa fa-save"></i>
</span> Enregistrer le sondage
<span *ngIf="!is_finish_step"> </span>
Suivant <span *ngIf="!is_finish_step">
</span> Suivant
</button> </span>
</button>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -51,22 +51,29 @@
> >
</div> </div>
<div class="step-info"> <div class="step-info">
<div class="columns"> <div class="columns half-columns">
<div class="column is-narrow is-hidden-mobile">
<a class="navbar-item is-block" [routerLink]="['/']" routerLinkActive="active">
<img src="assets/img/icone_home.png" alt="logo framadate" />
</a>
</div>
<div class="column"> <div class="column">
<a
class="navbar-item is-block pull-left is-hidden-mobile"
[routerLink]="['/']"
routerLinkActive="active"
>
<img src="assets/img/icone_home.png" alt="accueil FramaDate" />
</a>
<h2 class="step-title-poll" *ngIf="pollService.step_current == 1"> <h2 class="step-title-poll" *ngIf="pollService.step_current == 1">
{{ 'creation.title' | translate }} {{ 'creation.title' | translate }}
</h2> </h2>
<h2 class="step-title-poll" *ngIf="pollService.step_current >= 2"> <h2 class="step-title-poll" *ngIf="pollService.step_current >= 2">
{{ pollService.form.value.title }} <span class="poll-title-filled" *ngIf="pollService.form.value.title.length">
{{ pollService.form.value.title }}
</span>
<span class="poll-title-empty" *ngIf="!pollService.form.value.title.length">
(Aucun titre)
</span>
</h2> </h2>
<h3 class="step-counter-text">Étape {{ step_current }} sur {{ step_max }}</h3> <h3 class="step-counter-text">Étape {{ step_current }} sur {{ step_max }}</h3>
</div> </div>
<div class="column has-text-right is-narrow"> <div class="column has-text-right">
<a class="cancel-button" (click)="showCancelDialog()"> Annuler <i class="fa fa-times"></i> </a> <a class="cancel-button" (click)="showCancelDialog()"> Annuler <i class="fa fa-times"></i> </a>
</div> </div>
</div> </div>

View File

@ -61,7 +61,7 @@
} }
.step-info { .step-info {
padding: 0.85rem 0.85rem 2rem; padding: 9px 10px;
background: $white; background: $white;
i { i {

View File

@ -108,6 +108,7 @@ a span.ui-steps-number {
} }
.bottom-step-buttons { .bottom-step-buttons {
box-shadow: 0px -2px 4px rgba(0, 0, 0, 0.05);
position: fixed; position: fixed;
bottom: 0; bottom: 0;
left: 0; left: 0;

View File

@ -34,3 +34,15 @@ main {
} }
} }
} }
.columns {
&.half-columns {
max-width: 900px;
margin: 0 auto;
.column {
padding: 0;
width: 50% !important;
float: left;
}
}
}