misc: make timetable cells colors customizable (#63622)

This commit is contained in:
Serghei Mihai 2022-04-06 12:14:57 +02:00
parent 321fa4ab77
commit cf013d606d
2 changed files with 42 additions and 5 deletions

View File

@ -618,6 +618,36 @@ paramètre, la deuxième sa description et la troisième la valeur par défaut.
</td>
<td><p><var>null</var></p></td>
</tr>
<tr>
<td><p><code>$timetable-cell-background</code></p></td>
<td><p>Couleur de fond des créneaux horaires.</p>
</td>
<td><p><var>transparentize($button-background, 0.8)</var></p></td>
</tr>
<tr>
<td><p><code>$timetable-cell-hover-color</code></p></td>
<td><p>Couleur du texte au survol des créneaux horaires.</p>
</td>
<td><p><var>$button-color</var></p></td>
</tr>
<tr>
<td><p><code>$timetable-cell-hover-background</code></p></td>
<td><p>Couleur de fond au survol des créneaux horaires.</p>
</td>
<td><p><var>$button-background</var></p></td>
</tr>
<tr>
<td><p><code>$timetable-cell-selected-color</code></p></td>
<td><p>Couleur du texte du créneau horaire selectionné.</p>
</td>
<td><p><var>$timetable-cell-hover-color</var></p></td>
</tr>
<tr>
<td><p><code>$timetable-cell-selected-background</code></p></td>
<td><p>Couleur de fond du créneau horaire selectionné.</p>
</td>
<td><p><var>$timetable-cell-hover-background</var></p></td>
</tr>
</table>
</section>

View File

@ -12,6 +12,13 @@ $notification_info_color: adjust-hue($notification_base_color, 220deg) !default;
$notification-style: classic !default;
$notification-icon-size: null !default;
$timetable-cell-background: transparentize($button-background, 0.8) !default;
$timetable-cell-hover-color: $button-color !default;
$timetable-cell-hover-background: $button-background !default;
$timetable-cell-selected-color: $timetable-cell-hover-color !default;
$timetable-cell-selected-background: $timetable-cell-hover-background !default;
@if $notification-style == border-bar {
$notification-icon-size: 1.5rem !default;
} @else {
@ -723,15 +730,15 @@ div.timetable-widget {
}
span.timetable-cell.selectable {
background: transparentize($button-background, 0.8);
background: $timetable-cell-background;
&:hover {
background: $button-background;
color: $button-color;
background: $timetable-cell-hover-background;
color: $timetable-cell-hover-color;
box-shadow: 1px 0px 5px $button-background;
}
&.on {
background: $button-background;
color: $button-color;
background: $timetable-cell-selected-background;
color: $timetable-cell-selected-color;
}
}