diff --git a/sass/colors.scss b/sass/colors.scss index f100c6b..bc54734 100644 --- a/sass/colors.scss +++ b/sass/colors.scss @@ -45,7 +45,7 @@ $pagination-hover-color: rgb(115, 151, 186); --input-font-color: #{$nord3}; --input-color: #{$white}; --input-active-color: #{$nord5}; - + --navbar-color: #{darken($white, 5%)}; --box-bg-color: #F8F9FB; diff --git a/sass/list.scss b/sass/list.scss index 4f2b124..537a60d 100644 --- a/sass/list.scss +++ b/sass/list.scss @@ -30,10 +30,6 @@ border-right: 1px solid var(--border-color); margin-right: -1px; } - - &:hover { - background-color: var(--border-color); - } } .title { @@ -50,4 +46,10 @@ max-width: 90%; } } + + &.hover { + .item:hover { + background-color: var(--border-color); + } + } } \ No newline at end of file diff --git a/views/pages/ajouter-un-album.ejs b/views/pages/ajouter-un-album.ejs index bdebb4e..797bce6 100644 --- a/views/pages/ajouter-un-album.ejs +++ b/views/pages/ajouter-un-album.ejs @@ -15,7 +15,7 @@ -
Se référer à la documentation de Knacss.
- +<div class="field"> <label for="choix1">choix 1</label> - <input type="radio" id="choix1" name="choix" value="choix1" checked> + <input type="radio" id="choix1" name="choix" value="choix1" checked> <label for="choix2">choix 2</label> <input type="radio" id="choix2" name="choix" value="choix2"> </div>
<div class="field"> <label for="checkbox1">choix 1</label> - <input type="checkbox" id="checkbox1" name="checkbox" value="checkbox1" checked> + <input type="checkbox" id="checkbox1" name="checkbox" value="checkbox1" checked> <label for="checkbox2">choix 2</label> <input type="checkbox" id="checkbox2" name="checkbox" value="checkbox2"> </div> @@ -243,11 +243,11 @@
Pas encore inscrit ? Inscrivez-vous
-<button +<button type="button" - class="button is-primary" + class="button is-primary" onclick="showToastr('Ceci est une notification');" > Afficher une notification @@ -318,6 +318,7 @@ .icon-blindLes listes
+Liste normale
-@@ -340,6 +341,29 @@ </div> </div> +Liste avec effet au hover
++++ + {{ item.title }} + +++++++
+ {{ item.lorem }} +++<div class="grid grid-cols-1 md:grid-cols-2 list hover"> + <div class="item"> + Contenu + </div> +</div> +Les paginations