change on cancel button style

This commit is contained in:
Tykayn 2021-12-08 18:17:28 +01:00 committed by tykayn
parent c393bee2b4
commit 26baa4447d
3 changed files with 22 additions and 9 deletions

View File

@ -10,9 +10,16 @@
background: $d-grey;
border: solid white 1px;
transition: background-color ease 1.5s;
color: $font-color;
&.is-selected {
border: solid $primary-color 1px;
color: $font_color;
color: $white;
label {
color: $white;
}
.fa {
color: $white;
}
}
&:hover {
background: $secondary_color;

View File

@ -52,7 +52,7 @@
</div>
<div class="step-info">
<div class="columns">
<div class="column is-narrow">
<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>
@ -66,7 +66,7 @@
</h2>
<h3 class="step-counter-text">Étape {{ step_current }} sur {{ step_max }}</h3>
</div>
<div class="column is-half has-text-right">
<div class="column has-text-right is-narrow">
<a class="cancel-button" (click)="showCancelDialog()"> Annuler <i class="fa fa-times"></i> </a>
</div>
</div>

View File

@ -8,10 +8,12 @@
a {
@extend .clickable;
&:hover {
color: $secondary_color;
}
}
.columns,
.column {
padding-bottom: 0;
@ -46,24 +48,27 @@
&.is-active {
background: $font_color;
}
}
&.cancel-button {
background: $border-color;
.cancel-button {
margin-top: -0.5em;
line-height: 2rem;
display: inline-block;
&:hover {
background: $font_color;
}
}
}
.step-info {
padding: 0.85rem 0.85rem 2rem;
background: $white;
i {
margin-left: 1ch;
}
}
.step-title-poll {
font-size: 0.85rem;
color: $d-neutral;
@ -77,6 +82,7 @@
.step-counter-text {
font-weight: 600;
}
.cancel-button-reject,
.cancel-button-confirm {
display: block !important;