N°2847 - Improve SCSS files structure

- Refactor some mixins into helpers
- CSS3 variables set via SCSS variables are now using "interpolation" (#{$my-var} instead of just $my-var) to be compatible with more SCSS compiler
- Overloading some Bulma variables such as font-family
This commit is contained in:
Molkobain
2020-07-16 14:01:03 +02:00
parent fab58d503b
commit f5df442e8b
16 changed files with 369 additions and 134 deletions

View File

@@ -0,0 +1,18 @@
/*!
* Copyright (C) 2013-2020 Combodo SARL
*
* This file is part of iTop.
*
* iTop is free software; you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* iTop is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
*/

View File

@@ -1,262 +0,0 @@
/*!
* Copyright (C) 2013-2020 Combodo SARL
*
* This file is part of iTop.
*
* iTop is free software; you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* iTop is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
*/
/* Fonts
Value Common weight name (https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight)
100 Thin (Hairline)
200 Extra Light (Ultra Light)
300 Light
400 Normal (Regular)
500 Medium
600 Semi Bold (Demi Bold)
700 Bold
800 Extra Bold (Ultra Bold)
900 Black (Heavy)
950 Extra Black (Ultra Black)
*/
@mixin ibo-font-ral-nor-50 {
font-size: $ibo-font-size-50;
font-family: "Monorale";
font-weight: 400;
}
@mixin ibo-font-ral-nor-100 {
font-size: $ibo-font-size-100;
font-family: "Monorale";
font-weight: 400;
}
@mixin ibo-font-ral-nor-150 {
font-size: $ibo-font-size-150;
font-family: "Monorale";
font-weight: 400;
}
@mixin ibo-font-ral-nor-200 {
font-size: $ibo-font-size-200;
font-family: "Monorale";
font-weight: 400;
}
@mixin ibo-font-ral-nor-250 {
font-size: $ibo-font-size-250;
font-family: "Monorale";
font-weight: 400;
}
@mixin ibo-font-ral-nor-300 {
font-size: $ibo-font-size-300;
font-family:" Raleway";
font-weight: 400;
}
@mixin ibo-font-ral-nor-350 {
font-size: $ibo-font-size-350;
font-family: "Monorale";
font-weight: 400;
}
@mixin ibo-font-ral-nor-400 {
font-size: $ibo-font-size-400;
font-family: "Monorale";
font-weight: 400;
}
@mixin ibo-font-ral-nor-450 {
font-size: $ibo-font-size-450;
font-family: "Monorale";
font-weight: 400;
}
@mixin ibo-font-ral-nor-500 {
font-size: $ibo-font-size-500;
font-family: "Monorale";
font-weight: 400;
}
@mixin ibo-font-ral-nor-550 {
font-size: $ibo-font-size-550;
font-family: "Monorale";
font-weight: 400;
}
@mixin ibo-font-ral-med-50 {
font-size: $ibo-font-size-50;
font-family: "Monorale";
font-weight: 500;
}
@mixin ibo-font-ral-med-100 {
font-size: $ibo-font-size-100;
font-family: "Monorale";
font-weight: 500;
}
@mixin ibo-font-ral-med-150 {
font-size: $ibo-font-size-150;
font-family: "Monorale";
font-weight: 500;
}
@mixin ibo-font-ral-med-200 {
font-size: $ibo-font-size-200;
font-family: "Monorale";
font-weight: 500;
}
@mixin ibo-font-ral-med-250 {
font-size: $ibo-font-size-250;
font-family: "Monorale";
font-weight: 500;
}
@mixin ibo-font-ral-med-300 {
font-size: $ibo-font-size-300;
font-family:" Raleway";
font-weight: 500;
}
@mixin ibo-font-ral-med-350 {
font-size: $ibo-font-size-350;
font-family: "Monorale";
font-weight: 500;
}
@mixin ibo-font-ral-med-400 {
font-size: $ibo-font-size-400;
font-family: "Monorale";
font-weight: 500;
}
@mixin ibo-font-ral-med-450 {
font-size: $ibo-font-size-450;
font-family: "Monorale";
font-weight: 500;
}
@mixin ibo-font-ral-med-500 {
font-size: $ibo-font-size-500;
font-family: "Monorale";
font-weight: 500;
}
@mixin ibo-font-ral-med-550 {
font-size: $ibo-font-size-550;
font-family: "Monorale";
font-weight: 500;
}
@mixin ibo-font-ral-bol-50 {
font-size: $ibo-font-size-50;
font-family: "Monorale";
font-weight: 700;
}
@mixin ibo-font-ral-bol-100 {
font-size: $ibo-font-size-100;
font-family: "Monorale";
font-weight: 700;
}
@mixin ibo-font-ral-bol-150 {
font-size: $ibo-font-size-150;
font-family: "Monorale";
font-weight: 700;
}
@mixin ibo-font-ral-bol-200 {
font-size: $ibo-font-size-200;
font-family: "Monorale";
font-weight: 700;
}
@mixin ibo-font-ral-bol-250 {
font-size: $ibo-font-size-250;
font-family: "Monorale";
font-weight: 700;
}
@mixin ibo-font-ral-bol-300 {
font-size: $ibo-font-size-300;
font-family: "Monorale";
font-weight: 700;
}
@mixin ibo-font-ral-bol-350 {
font-size: $ibo-font-size-350;
font-family: "Monorale";
font-weight: 700;
}
@mixin ibo-font-ral-bol-400 {
font-size: $ibo-font-size-400;
font-family: "Monorale";
font-weight: 700;
}
@mixin ibo-font-ral-bol-450 {
font-size: $ibo-font-size-450;
font-family: "Monorale";
font-weight: 700;
}
@mixin ibo-font-ral-bol-500 {
font-size: $ibo-font-size-500;
font-family: "Monorale";
font-weight: 700;
}
@mixin ibo-font-ral-bol-550 {
font-size: $ibo-font-size-550;
font-family: "Monorale";
font-weight: 700;
}
@mixin ibo-font-ral-ita-50 {
font-size: $ibo-font-size-50;
font-family: "Monorale";
font-weight: 400;
font-style: italic;
}
@mixin ibo-font-ral-ita-100 {
font-size: $ibo-font-size-100;
font-family: "Monorale";
font-weight: 400;
font-style: italic;
}
@mixin ibo-font-ral-ita-150 {
font-size: $ibo-font-size-150;
font-family: "Monorale";
font-weight: 400;
font-style: italic;
}
@mixin ibo-font-ral-ita-200 {
font-size: $ibo-font-size-200;
font-family: "Monorale";
font-weight: 400;
font-style: italic;
}
@mixin ibo-font-ral-ita-250 {
font-size: $ibo-font-size-250;
font-family: "Monorale";
font-weight: 400;
font-style: italic;
}
@mixin ibo-font-ral-ita-300 {
font-size: $ibo-font-size-300;
font-family: "Monorale";
font-weight: 400;
font-style: italic;
}
@mixin ibo-font-ral-ita-350 {
font-size: $ibo-font-size-350;
font-family: "Monorale";
font-weight: 400;
font-style: italic;
}
@mixin ibo-font-ral-ita-400 {
font-size: $ibo-font-size-400;
font-family: "Monorale";
font-weight: 400;
font-style: italic;
}
@mixin ibo-font-ral-ita-450 {
font-size: $ibo-font-size-450;
font-family: "Monorale";
font-weight: 400;
font-style: italic;
}
@mixin ibo-font-ral-ita-500 {
font-size: $ibo-font-size-500;
font-family: "Monorale";
font-weight: 400;
font-style: italic;
}
@mixin ibo-font-ral-ita-550 {
font-size: $ibo-font-size-550;
font-family: "Monorale";
font-weight: 400;
font-style: italic;
}