scss: add carrousel-navigation-color and carrousel-arrows-color variables (#67642)

This commit is contained in:
Corentin Sechet 2022-07-22 12:15:25 +02:00
parent 2e98b86de6
commit 6344f898ca
2 changed files with 20 additions and 3 deletions

View File

@ -965,6 +965,11 @@ paramètre, la deuxième sa description et la troisième la valeur par défaut.
l'autre est affichée. (visible ou none)</p></td>
<td><p><var>visible</var></p></td>
</tr>
<tr>
<td><p><code>$carrousel-navigation-color</code></p></td>
<td><p>Couleur des éléments de navigation (disque et flêches)</p></td>
<td><p><var>$button-color</var></p></td>
</tr>
<tr>
<td><p><code>$carrousel-navigation-bullet-border</code></p></td>
<td><p>Bordure du disque de navigation.</p></td>
@ -973,7 +978,7 @@ paramètre, la deuxième sa description et la troisième la valeur par défaut.
<tr>
<td><p><code>$carrousel-navigation-bullet-color</code></p></td>
<td><p>Couleur du disque de navigation.</p></td>
<td><p><var>$button-color</var></p></td>
<td><p><var>$carrousel-navigation-color</var></p></td>
</tr>
<tr>
<td><p><code>$carrousel-navigation-bullet-size</code></p></td>
@ -986,6 +991,11 @@ paramètre, la deuxième sa description et la troisième la valeur par défaut.
élément à l'autre sont affichées. (visible ou none)</p></td>
<td><p><var>visible</var></p></td>
</tr>
<tr>
<td><p><code>$carrousel-arrows-color</code></p></td>
<td><p>Couleur des flèches de navigation.</p></td>
<td><p><var>$carrousel-navigation-color</var></p></td>
</tr>
<tr>
<td><p><code>$carrousel-item-mask-color</code></p></td>
<td><p>Couleur du masque qui se superpose à l'image de la diapositive</p></td>

View File

@ -11,8 +11,11 @@ $carrousel-text-position: middle !default;
/* $carrousel-navigation: visible or none */
$carrousel-navigation: visible !default;
/* $carrousel-navigation-color : color of navigation items (next, prev, bullet) */
$carrousel-navigation-color: $button-color !default;
/* $carrousel-navigation-bullet-color: color of active slide bullet */
$carrousel-navigation-bullet-color: $button-color !default;
$carrousel-navigation-bullet-color: $carrousel-navigation-color !default;
/* $carrousel-navigation-bullet-size: height/width of slide bullets */
$carrousel-navigation-bullet-size: 12px !default;
@ -24,6 +27,10 @@ $carrousel-navigation-bullet-border: 1px solid white !default;
/* $carrousel-arrows: visible or none */
$carrousel-arrows: visible !default;
/* $carrousel-arrows-color: color of prev and next arrows */
$carrousel-arrows-color: $carrousel-navigation-color !default;
div.carrousel-content {
position: relative;
height: $carrousel-height;
@ -132,7 +139,7 @@ div.carrousel-content {
position: absolute;
text-decoration: none;
top: calc(50% - 3rem);
color: white;
color: $carrousel-arrows-color;
height: 6rem;
line-height: 6rem;
width: 6rem;