#issue-19 Amélioration des contrastes

This commit is contained in:
Damien Broqua 2022-02-23 11:33:57 +01:00
parent bd590d7a75
commit c92f465003
6 changed files with 15 additions and 9 deletions

View file

@ -14,12 +14,12 @@
border-radius: 0.375rem; border-radius: 0.375rem;
&.is-danger { &.is-danger {
background-color: #f14668; background-color: #d73455;
border-color: transparent; border-color: transparent;
color: #fff; color: #fff;
&:hover { &:hover {
background-color: #f03a5f; background-color: #d70933;
border-color: transparent; border-color: transparent;
color: #fff; color: #fff;
} }
@ -38,12 +38,12 @@
} }
&.is-primary { &.is-primary {
background-color: #48c78e; background-color: #2d7c58;
border-color: transparent; border-color: transparent;
color: #fff; color: #fff;
&:hover { &:hover {
background-color: #3ec487; background-color: #267953;
} }
} }
} }

View file

@ -1,5 +1,5 @@
.flash { .flash {
background-color: #f14668; background-color: #d73455;
border-radius: 6px; border-radius: 6px;
box-shadow: 0 .5em 1em -.125em rgba(10,10,10,.1),0 0 0 1px rgba(10,10,10,.02); box-shadow: 0 .5em 1em -.125em rgba(10,10,10,.1),0 0 0 1px rgba(10,10,10,.02);
color: #fff; color: #fff;

View file

@ -46,3 +46,7 @@ html {
padding: 0 0.7rem; padding: 0 0.7rem;
} }
} }
.is-hidden {
display: none;
}

View file

@ -27,10 +27,10 @@
.title { .title {
.icon-trash { .icon-trash {
cursor: pointer; cursor: pointer;
color: #f14668; color: #d73455;
&:hover { &:hover {
color: #f03a5f; color: #d70933;
} }
} }
} }

View file

@ -9,7 +9,7 @@
font-size: 17px; font-size: 17px;
padding: 1.25rem 2.5rem 1.25rem 1.5rem; padding: 1.25rem 2.5rem 1.25rem 1.5rem;
background-color: #f14668; background-color: #d73455;
color: #fff; color: #fff;
&.show { &.show {

View file

@ -3,11 +3,13 @@
<div class="grid sm:grid-cols-2"> <div class="grid sm:grid-cols-2">
<div> <div>
<form @submit="search"> <form @submit="search">
<label for="q">Nom de l'album ou code barre</label>
<div class="field has-addons"> <div class="field has-addons">
<input type="text" name="q" v-model="q" placeholder="Nom de l'album ou code barre (ex : Hybrid Theory)" autofocus> <input type="text" name="q" id="q" v-model="q" placeholder="ex : Hybrid Theory" autofocus>
<button class="button is-link" :disabled="loading"> <button class="button is-link" :disabled="loading">
<i class="icon-search" v-if="!loading"></i> <i class="icon-search" v-if="!loading"></i>
<i class="icon-spin animate-spin" v-if="loading"></i> <i class="icon-spin animate-spin" v-if="loading"></i>
<span class="is-hidden">Chercher</span>
</button> </button>
</div> </div>
</form> </form>