entrouvert
/
publik-base-theme
15
1
Fork 1
Code Issues Pull Requests 10 Releases Wiki Activity

scss: add form-titlebar-mode to control form title display mode (#60164)

This commit is contained in:
Frédéric Péters 2021-12-30 13:26:49 +01:00
parent dcb35d27a0
commit 2e524a1114
3 changed files with 20 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
help/fr/misc-scss.page
View File

@ -469,6 +469,13 @@ paramètre, la deuxième sa description et la troisième la valeur par défaut.
<td><p>Espace entre la barre latérale et le formulaire</p></td>
<td><p><var>2%</var></p></td>
</tr>
<tr>
<td><p><code>$form-titlebar-mode</code></p></td>
<td><p>Mode d’affichage du titre de la démarche, soit sur toute la largeur de
page (<var>page</var>), soit sur la largeur et aligné avec le formulaire
(<var>form</var>).</p></td>
<td><p><var>page</var></p></td>
</tr>
<tr>
<td><p><code>$button-background</code></p></td>
<td><p>Couleur de fond des boutons</p></td>

12
static/includes/wcs/_bulk.scss
View File

@ -3,6 +3,10 @@
$form-sidebar-position: left !default;
$form-sidebar-width: 18.5% !default;
$form-sidebar-gutter: 2% !default;
// $form-titlebar-mode: display mode for the title bar, possible values are:
// * page: full page width (i.e. sidebar + form content)
// * form: form width (+ margin to be aligned on top of form)
$form-titlebar-mode: page !default;
// hide a bunch of elements
div#droite,
@ -790,3 +794,11 @@ div.section.foldable {
box-shadow: -0.5em -0.5em 0 .5em hsla(0, 0%, 0%, 0.05);
}
}
@if ($form-titlebar-mode == form) {
@media screen and ($min-desktop-viewport) {
.form-content--with-sidebox .form-content--titlebar {
margin-left: calc(#{$form-sidebar-width} + #{$form-sidebar-gutter});
}
}
}

2
templates/wcs/base.html
View File

@ -20,7 +20,7 @@ wcs-page
<div class="form-content {% if gauche %}form-content--with-sidebox{% endif %}">
{% block wcs-form-title %}
{% if title %}
<div><h1 class="form-content--title">{{title}}</h1></div>
<div class="form-content--titlebar"><h1 class="form-content--title">{{title}}</h1></div>
{% endif %}
{% endblock %}
{% if gauche %}