composer/iTop
6
0
Fork 0
mirror of https://github.com/Combodo/iTop.git synced 2026-02-13 07:24:13 +01:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

14
css/backoffice/blocks-integrations/input/_input-with-label.scss
View File

@@ -12,17 +12,3 @@ select + label, label + select, label > select,
input + label, label + input, label > input {
margin-left: $ibo-input--spacing-left--with-label;
}
.ibo-input-with-label--label {
&.ibo-has-description {
&::after {
content: $ibo-field--label--description--content;
padding-left: $ibo-field--label--description--padding-left;
vertical-align: top;
cursor: pointer;
color: $ibo-field--label--description--color;
@extend %ibo-font-ral-bol-50;
}
}
}

16
css/backoffice/components/_field.scss
View File

@@ -6,10 +6,6 @@
/* SCSS variables */
$ibo-field--value--color: $ibo-color-grey-800 !default;
$ibo-field--label--description--content: "?" !default;
$ibo-field--label--description--padding-left: $ibo-spacing-200 !default;
$ibo-field--label--description--color: $ibo-color-grey-600 !default;
$ibo-field--background-color--is-fullscreen: $ibo-color-white-100 !default;
$ibo-field--label--width--is-fullscreen: 100% !default;
@@ -162,18 +158,6 @@ $ibo-field--enable-bulk--checkbox--margin-left: $ibo-spacing-300 !default;
width: 30%;
word-break: break-word; /* We want labels to wrap if it is very long if it has no spaces */
@extend %ibo-font-weight-600;
> .ibo-has-description {
&::after {
content: $ibo-field--label--description--content;
padding-left: $ibo-field--label--description--padding-left;
vertical-align: top;
cursor: pointer;
color: $ibo-field--label--description--color;
@extend %ibo-font-ral-bol-50;
}
}
}
.ibo-field--label-small .ibo-field--label{
width: 20em;

21
css/backoffice/utils/helpers/_text-decoration.scss
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;