58 lines
1.2 KiB
SCSS
58 lines
1.2 KiB
SCSS
@use "../abstracts/variables" as *;
|
|
|
|
// =============================================================
|
|
// Boutons — bloc composant .btn
|
|
// =============================================================
|
|
|
|
.btn {
|
|
padding: $spacing-sm $spacing-md;
|
|
border-radius: $border-radius;
|
|
text-decoration: none;
|
|
display: inline-block;
|
|
cursor: pointer;
|
|
border: none;
|
|
text-align: center;
|
|
}
|
|
|
|
.btn--primary {
|
|
background: $color-primary;
|
|
color: white;
|
|
}
|
|
|
|
.btn--secondary {
|
|
background: $color-text-muted;
|
|
color: white;
|
|
}
|
|
|
|
.btn--danger {
|
|
background: $color-danger;
|
|
color: white;
|
|
}
|
|
|
|
.btn--sm {
|
|
padding: $spacing-xs $spacing-sm;
|
|
font-size: $font-size-sm;
|
|
}
|
|
|
|
// Modificateur taille — boutons principaux dans les formulaires centrés
|
|
.btn--lg {
|
|
padding: 0.75rem $spacing-lg;
|
|
}
|
|
|
|
// Modificateur largeur — occupe toute la largeur de son conteneur
|
|
.btn--full {
|
|
width: 100%;
|
|
}
|
|
|
|
// Variante autonome du bloc bouton : lien d'action textuel
|
|
// Utilisé sans la classe .btn (pas un modificateur BEM)
|
|
.btn-link {
|
|
background: none;
|
|
border: none;
|
|
color: $color-primary;
|
|
cursor: pointer;
|
|
text-decoration: underline;
|
|
padding: 0;
|
|
font-size: inherit;
|
|
}
|