[ref] Rends plus lisible les boutons Accepter / Refuser
Parent
d9b1128a85
révision
1aa509cfb0
|
@ -3,7 +3,7 @@
|
|||
<div class="panel">
|
||||
<div class="panel-content">
|
||||
<ul class="items-list">
|
||||
{{# repeat 5 }}
|
||||
{{# repeat 3 }}
|
||||
<li class="reservation item grid-x grid-margin-x align-middle">
|
||||
<div class="medium-5 cell">
|
||||
<a href="{{ root }}evenement.html" class="evenement-nom">
|
||||
|
@ -20,13 +20,57 @@
|
|||
</a>
|
||||
</div>
|
||||
<div class="item-actions medium-shrink cell">
|
||||
<div class="expanded button-group compact">
|
||||
<button type="button" class="success button"{{# ifequal @index 1 }} disabled{{/ ifequal }}>Valider</button>
|
||||
<button type="button" class="alert button"{{# ifequal @index 2 }} disabled{{ else }} data-open="confirm-refus"{{/ ifequal }}>Refuser</button>
|
||||
<div class="reservation-traiter expanded button-group compact">
|
||||
<button type="submit" class="accepter button">Accepter</button>
|
||||
<button type="button" class="refuser alert button" data-open="confirm-refus">Refuser</button>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
{{/ repeat }}
|
||||
<li class="reservation item grid-x grid-margin-x align-middle">
|
||||
<div class="medium-5 cell">
|
||||
<a href="{{ root }}evenement.html" class="evenement-nom">
|
||||
Harmonie municipale : Concert d’automne
|
||||
</a>
|
||||
<div class="evenement-date compact">
|
||||
dim. 15 octobre à 15:00
|
||||
</div>
|
||||
</div>
|
||||
<div class="medium-auto cell">
|
||||
<span class="hide-for-medium">par</span>
|
||||
<a href="{{ root }}agent.html">
|
||||
<h5 class="personne-nom compact">Jean-Michel Dupont</h5>
|
||||
</a>
|
||||
</div>
|
||||
<div class="item-actions medium-shrink cell">
|
||||
<div class="reservation-traiter expanded button-group compact">
|
||||
<div class="accepter button is-active">Accepter</div>
|
||||
<button type="button" class="refuser alert button" data-open="confirm-refus">Refuser</button>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="reservation item grid-x grid-margin-x align-middle">
|
||||
<div class="medium-5 cell">
|
||||
<a href="{{ root }}evenement.html" class="evenement-nom">
|
||||
Harmonie municipale : Concert d’automne
|
||||
</a>
|
||||
<div class="evenement-date compact">
|
||||
dim. 15 octobre à 15:00
|
||||
</div>
|
||||
</div>
|
||||
<div class="medium-auto cell">
|
||||
<span class="hide-for-medium">par</span>
|
||||
<a href="{{ root }}agent.html">
|
||||
<h5 class="personne-nom compact">Jean-Michel Dupont</h5>
|
||||
</a>
|
||||
</div>
|
||||
<div class="item-actions medium-shrink cell">
|
||||
<div class="reservation-traiter expanded button-group compact">
|
||||
<button type="submit" class="accepter button">Accepter</button>
|
||||
<div class="refuser button is-active">Refuser</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -47,3 +47,46 @@
|
|||
.evenement-places {
|
||||
color: $dark-gray;
|
||||
}
|
||||
|
||||
/// Réservations -------------------------------------------------------------
|
||||
|
||||
.reservation-traiter {
|
||||
.button {
|
||||
min-width: 90px;
|
||||
background-color: $white;
|
||||
|
||||
&.accepter {
|
||||
color: $success-color;
|
||||
border: 1px solid $success-color;
|
||||
border-right: 0;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.is-active {
|
||||
background-color: $success-color;
|
||||
}
|
||||
}
|
||||
|
||||
&.refuser {
|
||||
color: $alert-color;
|
||||
border: 1px solid $alert-color;
|
||||
border-left: 1px solid $black;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.is-active {
|
||||
background-color: $alert-color;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.is-active {
|
||||
color: $white;
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Chargement…
Référencer dans un nouveau ticket