63 lines
1.4 KiB
SCSS
63 lines
1.4 KiB
SCSS
|
// Raccords entre Bulma et la charte : ce que ni l'un ni l'autre ne règle seul.
|
||
|
|
|
||
|
|
// Les titres Bulma suivent ceux de la charte : Young Serif en 400.
|
||
|
|
.title,
|
||
|
|
.subtitle {
|
||
|
|
font-family: var(--serif);
|
||
|
|
font-weight: 400;
|
||
|
|
letter-spacing: -0.005em;
|
||
|
|
}
|
||
|
|
|
||
|
|
// La charte souligne tous les liens ; pas les liens habillés en bouton ou en étiquette.
|
||
|
|
a.button,
|
||
|
|
a.tag,
|
||
|
|
a.navbar-item,
|
||
|
|
a.dropdown-item {
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
// La charte ne prépare les <button class="bouton"> que dans un .formulaire :
|
||
|
|
// on les prépare partout (button_to, f.submit…).
|
||
|
|
button.bouton,
|
||
|
|
input.bouton {
|
||
|
|
border: 0;
|
||
|
|
font: inherit;
|
||
|
|
font-weight: 700;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
button.bouton:disabled,
|
||
|
|
input.bouton:disabled {
|
||
|
|
opacity: 0.6;
|
||
|
|
cursor: progress;
|
||
|
|
}
|
||
|
|
|
||
|
|
// button_to enveloppe son bouton dans un formulaire : le garder en ligne dans la navigation.
|
||
|
|
.nav form.button_to {
|
||
|
|
display: inline;
|
||
|
|
}
|
||
|
|
|
||
|
|
// La charte ne vise que les champs email et les zones de texte : on étend aux autres types.
|
||
|
|
.formulaire {
|
||
|
|
input[type="text"],
|
||
|
|
input[type="password"],
|
||
|
|
input[type="date"],
|
||
|
|
input[type="number"],
|
||
|
|
select {
|
||
|
|
display: block;
|
||
|
|
width: 100%;
|
||
|
|
padding: 0.7rem 0.85rem;
|
||
|
|
border: 2px solid var(--bordure-champ);
|
||
|
|
border-radius: var(--arrondi-petit);
|
||
|
|
background: var(--blanc);
|
||
|
|
color: var(--encre);
|
||
|
|
font: inherit;
|
||
|
|
line-height: 1.4;
|
||
|
|
|
||
|
|
&:focus-visible {
|
||
|
|
outline: 3px solid var(--vert);
|
||
|
|
outline-offset: 1px;
|
||
|
|
border-color: var(--encre);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|