Co-authored-by: dbroqua <contact@darkou.fr>
Reviewed-on: https://git.darkou.fr/dbroqua/MusicTopus/pulls/31
This commit is contained in:
Damien Broqua 2022-03-06 14:38:26 +01:00
parent ac72c1c13c
commit aeb5df067c
28 changed files with 630 additions and 66 deletions

View file

@ -1,8 +1,9 @@
<main class="layout-maxed" id="app">
<main class="layout-maxed composants" id="app">
<h1>Les composants</h1>
<ul>
<li><a href="#titres">Les titres</a></li>
<li><a href="#couleurs">Les couleurs</a></li>
<li><a href="#grilles">Les grilles</a></li>
<li><a href="#boutons">Les boutons</a></li>
<li><a href="#formulaires">Les formulaires</a></li>
@ -24,6 +25,87 @@
<h5>Titre de niveau 5</h5>
<h6>Titre de niveau 6</h6>
<h2 id="couleurs">Les couleurs</h2>
<h3>Polar Night</h3>
<div class="grid grid-cols-5 gap-5">
<div class="couleur">
<div style="background-color: var(--nord0);">&nbsp;</div>
nord0
</div>
<div class="couleur">
<div style="background-color: var(--nord1);">&nbsp;</div>
nord1
</div>
<div class="couleur">
<div style="background-color: var(--nord2);">&nbsp;</div>
nord2
</div>
<div class="couleur">
<div style="background-color: var(--nord3);">&nbsp;</div>
nord3
</div>
</div>
<h3>Snow Storm</h3>
<div class="grid grid-cols-5 gap-5">
<div class="couleur">
<div style="background-color: var(--nord4);">&nbsp;</div>
nord4
</div>
<div class="couleur">
<div style="background-color: var(--nord5);">&nbsp;</div>
nord5
</div>
<div class="couleur">
<div style="background-color: var(--nord6);">&nbsp;</div>
nord6
</div>
</div>
<h3>Frost</h3>
<div class="grid grid-cols-5 gap-5">
<div class="couleur">
<div style="background-color: var(--nord7);">&nbsp;</div>
nord7
</div>
<div class="couleur">
<div style="background-color: var(--nord8);">&nbsp;</div>
nord8
</div>
<div class="couleur">
<div style="background-color: var(--nord9);">&nbsp;</div>
nord9
</div>
<div class="couleur">
<div style="background-color: var(--nord10);">&nbsp;</div>
nord10
</div>
</div>
<h3>Aurora</h3>
<div class="grid grid-cols-5 gap-5">
<div class="couleur">
<div style="background-color: var(--nord11);">&nbsp;</div>
nord11
</div>
<div class="couleur">
<div style="background-color: var(--nord12);">&nbsp;</div>
nord12
</div>
<div class="couleur">
<div style="background-color: var(--nord13);">&nbsp;</div>
nord13
</div>
<div class="couleur">
<div style="background-color: var(--nord14);">&nbsp;</div>
nord14
</div>
<div class="couleur">
<div style="background-color: var(--nord15);">&nbsp;</div>
nord15
</div>
</div>
<p>
Vous pourrez trouver plus d'informations sur le <a href="https://www.nordtheme.com/" target="_blank" rel="noopener noreferrer">site offciel</a> du projet nord.
</p>
<h2 id="grilles">Les grilles</h2>
<p>
Se référer à la documentation de <a href="https://www.knacss.com/doc.html#grid" target="_blank" rel="noopener noreferrer">Knacss</a>.
@ -225,13 +307,15 @@
<i class="icon-link-ext">.icon-link-ext</i>
<i class="icon-heart">.icon-heart</i>
<i class="icon-eye">.icon-eye</i>
<i class="icon-left-open">.icon-left-open</i>
<i class="icon-right-open">.icon-right-open</i>
<i class="icon-export">.icon-export</i>
<i class="icon-share">.icon-share</i>
<i class="icon-spin">.icon-spin</i>
<i class="icon-sun">.icon-sun</i>
<i class="icon-moon">.icon-moon</i>
<i class="icon-trash">.icon-trash</i>
<i class="icon-blind">.icon-blind</i>
<i class="icon-left-open">.icon-left-open</i>
<i class="icon-right-open">.icon-right-open</i>
<h2 id="listes">Les listes</h2>
<div class="grid grid-cols-1 md:grid-cols-2 list">