N°5905 - Refactor CSS class .ibo-has-description so it can be used on any element

This commit is contained in:
Molkobain
2023-01-27 15:40:31 +01:00
parent 27bd78d76b
commit 0374e303e4
3 changed files with 21 additions and 30 deletions

View File

@@ -4,6 +4,11 @@
*/
/* SCSS variables */
$ibo-has-description--content: "?" !default;
$ibo-has-description--padding-left: $ibo-spacing-200 !default;
$ibo-has-description--color: $ibo-color-grey-600 !default;
$ibo-has-description--font-size: 0.7em !default; /* Font size is em on purpose as we want it to be proportional to its context */
$ibo-is-code--background-color: $ibo-color-white-200 !default;
$ibo-is-code--padding: 1.25rem 1.5rem !default;
@@ -33,6 +38,22 @@ $ibo-is-code--padding: 1.25rem 1.5rem !default;
cursor: help;
}
/* Class to display a hint on elements that have a tooltip for further description */
.ibo-has-description {
&::after {
content: $ibo-has-description--content;
padding-left: $ibo-has-description--padding-left;
vertical-align: top;
cursor: pointer;
color: $ibo-has-description--color;
/* We don't use a %ibo-font-ral-xxx-yyy as we need a specific size */
@extend %ibo-font-weight-700;
font-size: $ibo-has-description--font-size;
}
}
.ibo-is-code {
background-color: $ibo-is-code--background-color;
padding: $ibo-is-code--padding;