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°7793 Add breaking changes introduced by adding common SCSS variables between backoffice and end-user portal (#675)

Browse Source 
* N°7793 Add breaking changes induce by adding common SCSS variables between backoffice and end-user portal

* N°7793 Handle breaking changes in darkmoon theme
This commit is contained in:
Stephen Abello
2024-11-08 10:04:56 +01:00
committed by GitHub
parent 317cd585b2
commit be5e4458ba
9 changed files with 152 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
css/backoffice/base/_base.scss
View File

@@ -4,7 +4,7 @@
*/
$ibo-scrollbar--scrollbar-width: $common-scrollbar--scrollbar-width !default;
$ibo-scrollbar--scrollbar-height: $ibo-scrollbar--scrollbar-width !default; /* For horizontal scrollbars */
$ibo-scrollbar--scrollbar-height: $common-scrollbar--scrollbar-height !default; /* For horizontal scrollbars */
$ibo-scrollbar--scrollbar-track-background-color: $common-scrollbar--scrollbar-track-background-color !default;
$ibo-scrollbar--scrollbar-track-border-radius: $common-scrollbar--scrollbar-track-border-radius !default;
$ibo-scrollbar--scrollbar-thumb-background-color: $common-scrollbar--scrollbar-thumb-background-color !default;

4
css/backoffice/utils/helpers/_sticky-header.scss
View File

@@ -14,9 +14,9 @@ $ibo-sticky-sentinel--left: $common-sticky-sentinel--left !default;
$ibo-sticky-sentinel--right: $common-sticky-sentinel--right !default;
$ibo-sticky-sentinel--height: $common-sticky-sentinel--height !default;
$ibo-sticky-sentinel-top--top: $common-sticky-sentinel-top--top !default;
$ibo-sticky-sentinel-top--height: $ibo-sticky-sentinel--height !default;
$ibo-sticky-sentinel-top--height: $common-sticky-sentinel-top--height !default;
$ibo-sticky-sentinel-bottom--bottom: $common-sticky-sentinel-bottom--bottom !default;
$ibo-sticky-sentinel-bottom--height: $ibo-sticky-sentinel--height !default;
$ibo-sticky-sentinel-bottom--height: $common-sticky-sentinel-bottom--height !default;
/* Rules */
.ibo-sticky-sentinel {

12
css/backoffice/utils/helpers/_text-decoration.scss
View File

@@ -12,12 +12,12 @@ $ibo-has-description--font-size: $common-has-description--font-size !default; /*
$ibo-is-code--background-color: $common-is-code--background-color !default;
$ibo-is-code--padding: $common-is-code--padding !default;
$ibo-hyperlink-color: $ibo-color-primary-700 !default;
$ibo-hyperlink-text-decoration: none !default;
$ibo-hyperlink-color--on-hover: $ibo-color-primary-800 !default;
$ibo-hyperlink-text-decoration--on-hover: $ibo-hyperlink-text-decoration !default;
$ibo-hyperlink-color--on-active: $ibo-color-primary-900 !default;
$ibo-hyperlink-text-decoration--on-active: $ibo-hyperlink-text-decoration !default;
$ibo-hyperlink-color: $common-hyperlink-color !default;
$ibo-hyperlink-text-decoration: $common-hyperlink-text-decoration !default;
$ibo-hyperlink-color--on-hover: $common-hyperlink-color--on-hover !default;
$ibo-hyperlink-text-decoration--on-hover: $common-hyperlink-text-decoration--on-hover !default;
$ibo-hyperlink-color--on-active: $common-hyperlink-color--on-active !default;
$ibo-hyperlink-text-decoration--on-active: $common-hyperlink-text-decoration--on-active !default;
$ibo-figure--spacing-x: $common-figure--spacing-x !default; /* Mind that this matches Bulma rule for figure */
$ibo-figure--spacing-y: $common-figure--spacing-y !default;

4
css/backoffice/utils/variables/_base.scss
View File

@@ -5,5 +5,5 @@
// These are the base variables used throughout the backoffice, if you don't know what to use, these are probably good :)
$ibo-base-variable--text-color: $ibo-color-grey-900 !default;
$ibo-base-variable--border-radius: $ibo-border-radius-300 !default;;
$ibo-base-variable--text-color: $common-base-variable--text-color !default;
$ibo-base-variable--border-radius: $common-base-variable--border-radius !default;;

43
css/backoffice/utils/variables/_spacing.scss
View File

@@ -3,27 +3,28 @@
* @license http://opensource.org/licenses/AGPL-3.0
*/
$ibo-spacing-0: $ibo-size-0 !default;
$ibo-spacing-100: $ibo-size-50 !default;
$ibo-spacing-200: $ibo-size-100 !default;
$ibo-spacing-300: $ibo-size-150 !default;
$ibo-spacing-400: $ibo-size-200 !default;
$ibo-spacing-500: $ibo-size-250 !default;
$ibo-spacing-600: $ibo-size-300 !default;
$ibo-spacing-700: $ibo-size-350 !default;
$ibo-spacing-800: $ibo-size-400 !default;
$ibo-spacing-900: $ibo-size-450 !default;
$ibo-spacing-950: $ibo-size-500 !default;
$ibo-spacing-0: $common-spacing-0 !default;
$ibo-spacing-100: $common-spacing-100 !default;
$ibo-spacing-200: $common-spacing-200 !default;
$ibo-spacing-300: $common-spacing-300 !default;
$ibo-spacing-400: $common-spacing-400 !default;
$ibo-spacing-500: $common-spacing-500 !default;
$ibo-spacing-600: $common-spacing-600 !default;
$ibo-spacing-700: $common-spacing-700 !default;
$ibo-spacing-800: $common-spacing-800 !default;
$ibo-spacing-900: $common-spacing-900 !default;
$ibo-spacing-950: $common-spacing-950 !default;
:root{
--ibo-spacing-0: #{$ibo-size-0};
--ibo-spacing-100: #{$ibo-size-50};
--ibo-spacing-200: #{$ibo-size-100};
--ibo-spacing-300: #{$ibo-size-150};
--ibo-spacing-400: #{$ibo-size-200};
--ibo-spacing-500: #{$ibo-size-250};
--ibo-spacing-600: #{$ibo-size-300};
--ibo-spacing-700: #{$ibo-size-350};
--ibo-spacing-800: #{$ibo-size-400};
--ibo-spacing-900: #{$ibo-size-450};
--ibo-spacing-0: #{$ibo-spacing-0};
--ibo-spacing-100: #{$ibo-spacing-100};
--ibo-spacing-200: #{$ibo-spacing-200};
--ibo-spacing-300: #{$ibo-spacing-300};
--ibo-spacing-400: #{$ibo-spacing-400};
--ibo-spacing-500: #{$ibo-spacing-500};
--ibo-spacing-600: #{$ibo-spacing-600};
--ibo-spacing-700: #{$ibo-spacing-700};
--ibo-spacing-800: #{$ibo-spacing-800};
--ibo-spacing-900: #{$ibo-spacing-900};
--ibo-spacing-950: #{$ibo-spacing-950};
}

2
css/backoffice/utils/variables/_typography.scss
View File

@@ -35,7 +35,7 @@ $ibo-font-weight-950: $common-font-weight-950 !default; /* 950 Extra Black (Ultr
$ibo-font-family-base: $common-font-family-base !default;
$ibo-font-family-fallbacks: $common-font-family-fallbacks !default;
$ibo-font-family-monospace: $common-font-family-monospace !default;
$ibo-font-family-code: $ibo-font-family-monospace !default;
$ibo-font-family-code: $common-font-family-code !default;
:root {
--ibo-font-size-50: #{$ibo-font-size-50};

32
css/backoffice/utils/variables/colors/_lifecycle-palette.scss
View File

@@ -5,24 +5,24 @@
/* Lifecycle palette */
/* - For workflow */
$ibo-lifecycle-new-state-primary-color: $ibo-color-blue-800 !default;
$ibo-lifecycle-new-state-secondary-color: $ibo-color-white-100 !default;
$ibo-lifecycle-neutral-state-primary-color: $ibo-color-blue-800 !default;
$ibo-lifecycle-neutral-state-secondary-color: $ibo-color-white-100 !default;
$ibo-lifecycle-waiting-state-primary-color: $ibo-color-orange-400 !default;
$ibo-lifecycle-waiting-state-secondary-color: $ibo-color-white-100 !default;
$ibo-lifecycle-success-state-primary-color: $ibo-color-green-700 !default;
$ibo-lifecycle-success-state-secondary-color: $ibo-color-white-100 !default;
$ibo-lifecycle-failure-state-primary-color: $ibo-color-pink-700 !default;
$ibo-lifecycle-failure-state-secondary-color: $ibo-color-white-100 !default;
$ibo-lifecycle-frozen-state-primary-color: $ibo-color-grey-200 !default;
$ibo-lifecycle-frozen-state-secondary-color: $ibo-color-grey-700 !default;
$ibo-lifecycle-new-state-primary-color: $common-lifecycle-new-state-primary-color !default;
$ibo-lifecycle-new-state-secondary-color: $common-lifecycle-new-state-secondary-color !default;
$ibo-lifecycle-neutral-state-primary-color: $common-lifecycle-neutral-state-primary-color !default;
$ibo-lifecycle-neutral-state-secondary-color: $common-lifecycle-neutral-state-secondary-color !default;
$ibo-lifecycle-waiting-state-primary-color: $common-lifecycle-waiting-state-primary-color !default;
$ibo-lifecycle-waiting-state-secondary-color: $common-lifecycle-waiting-state-secondary-color !default;
$ibo-lifecycle-success-state-primary-color: $common-lifecycle-success-state-primary-color !default;
$ibo-lifecycle-success-state-secondary-color: $common-lifecycle-success-state-secondary-color !default;
$ibo-lifecycle-failure-state-primary-color: $common-lifecycle-failure-state-primary-color !default;
$ibo-lifecycle-failure-state-secondary-color: $common-lifecycle-failure-state-secondary-color !default;
$ibo-lifecycle-frozen-state-primary-color: $common-lifecycle-frozen-state-primary-color !default;
$ibo-lifecycle-frozen-state-secondary-color: $common-lifecycle-frozen-state-secondary-color !default;
/* - For basic lifecycle */
$ibo-lifecycle-active-state-primary-color: $ibo-color-green-700 !default;
$ibo-lifecycle-active-state-secondary-color: $ibo-color-white-100 !default;
$ibo-lifecycle-inactive-state-primary-color: $ibo-color-orange-400 !default;
$ibo-lifecycle-inactive-state-secondary-color: $ibo-color-white-100 !default;
$ibo-lifecycle-active-state-primary-color: $common-lifecycle-active-state-primary-color !default;
$ibo-lifecycle-active-state-secondary-color: $common-lifecycle-active-state-secondary-color !default;
$ibo-lifecycle-inactive-state-primary-color: $common-lifecycle-inactive-state-primary-color !default;
$ibo-lifecycle-inactive-state-secondary-color: $common-lifecycle-inactive-state-secondary-color !default;
$ibo-lifecycle-states-colors: (
'new': (

158
css/backoffice/utils/variables/colors/_semantic-palette.scss
View File

@@ -5,99 +5,99 @@
/* Semantic palettes */
/* - Primary color of the brand */
$ibo-color-primary-100: $ibo-color-orange-100 !default;
$ibo-color-primary-200: $ibo-color-orange-200 !default;
$ibo-color-primary-300: $ibo-color-orange-300 !default;
$ibo-color-primary-400: $ibo-color-orange-400 !default;
$ibo-color-primary-500: $ibo-color-orange-500 !default;
$ibo-color-primary-600: $ibo-color-orange-600 !default;
$ibo-color-primary-700: $ibo-color-orange-700 !default;
$ibo-color-primary-800: $ibo-color-orange-800 !default;
$ibo-color-primary-900: $ibo-color-orange-900 !default;
$ibo-color-primary-950: $ibo-color-orange-950 !default;
$ibo-color-primary-100: $common-color-primary-100 !default;
$ibo-color-primary-200: $common-color-primary-200 !default;
$ibo-color-primary-300: $common-color-primary-300 !default;
$ibo-color-primary-400: $common-color-primary-400 !default;
$ibo-color-primary-500: $common-color-primary-500 !default;
$ibo-color-primary-600: $common-color-primary-600 !default;
$ibo-color-primary-700: $common-color-primary-700 !default;
$ibo-color-primary-800: $common-color-primary-800 !default;
$ibo-color-primary-900: $common-color-primary-900 !default;
$ibo-color-primary-950: $common-color-primary-950 !default;
/* - Secondary color of the brand */
$ibo-color-secondary-100: $ibo-color-grey-100 !default;
$ibo-color-secondary-200: $ibo-color-grey-200 !default;
$ibo-color-secondary-300: $ibo-color-grey-300 !default;
$ibo-color-secondary-400: $ibo-color-grey-400 !default;
$ibo-color-secondary-500: $ibo-color-grey-500 !default;
$ibo-color-secondary-600: $ibo-color-grey-600 !default;
$ibo-color-secondary-700: $ibo-color-grey-700 !default;
$ibo-color-secondary-800: $ibo-color-grey-800 !default;
$ibo-color-secondary-900: $ibo-color-grey-900 !default;
$ibo-color-secondary-950: $ibo-color-grey-950 !default;
$ibo-color-secondary-100: $common-color-secondary-100 !default;
$ibo-color-secondary-200: $common-color-secondary-200 !default;
$ibo-color-secondary-300: $common-color-secondary-300 !default;
$ibo-color-secondary-400: $common-color-secondary-400 !default;
$ibo-color-secondary-500: $common-color-secondary-500 !default;
$ibo-color-secondary-600: $common-color-secondary-600 !default;
$ibo-color-secondary-700: $common-color-secondary-700 !default;
$ibo-color-secondary-800: $common-color-secondary-800 !default;
$ibo-color-secondary-900: $common-color-secondary-900 !default;
$ibo-color-secondary-950: $common-color-secondary-950 !default;
/* - Information: messages / actions that should neither seem as success, warning or failure */
$ibo-color-information-100: $ibo-color-blue-100 !default;
$ibo-color-information-200: $ibo-color-blue-200 !default;
$ibo-color-information-300: $ibo-color-blue-300 !default;
$ibo-color-information-400: $ibo-color-blue-400 !default;
$ibo-color-information-500: $ibo-color-blue-500 !default;
$ibo-color-information-600: $ibo-color-blue-600 !default;
$ibo-color-information-700: $ibo-color-blue-700 !default;
$ibo-color-information-800: $ibo-color-blue-800 !default;
$ibo-color-information-900: $ibo-color-blue-900 !default;
$ibo-color-information-950: $ibo-color-blue-950 !default;
$ibo-color-information-100: $common-color-information-100 !default;
$ibo-color-information-200: $common-color-information-200 !default;
$ibo-color-information-300: $common-color-information-300 !default;
$ibo-color-information-400: $common-color-information-400 !default;
$ibo-color-information-500: $common-color-information-500 !default;
$ibo-color-information-600: $common-color-information-600 !default;
$ibo-color-information-700: $common-color-information-700 !default;
$ibo-color-information-800: $common-color-information-800 !default;
$ibo-color-information-900: $common-color-information-900 !default;
$ibo-color-information-950: $common-color-information-950 !default;
/* Success: messages of success, safe actions, ... */
$ibo-color-success-100: $ibo-color-green-100 !default;
$ibo-color-success-200: $ibo-color-green-200 !default;
$ibo-color-success-300: $ibo-color-green-300 !default;
$ibo-color-success-400: $ibo-color-green-400 !default;
$ibo-color-success-500: $ibo-color-green-500 !default;
$ibo-color-success-600: $ibo-color-green-600 !default;
$ibo-color-success-700: $ibo-color-green-700 !default;
$ibo-color-success-800: $ibo-color-green-800 !default;
$ibo-color-success-900: $ibo-color-green-900 !default;
$ibo-color-success-950: $ibo-color-green-950 !default;
$ibo-color-success-100: $common-color-success-100 !default;
$ibo-color-success-200: $common-color-success-200 !default;
$ibo-color-success-300: $common-color-success-300 !default;
$ibo-color-success-400: $common-color-success-400 !default;
$ibo-color-success-500: $common-color-success-500 !default;
$ibo-color-success-600: $common-color-success-600 !default;
$ibo-color-success-700: $common-color-success-700 !default;
$ibo-color-success-800: $common-color-success-800 !default;
$ibo-color-success-900: $common-color-success-900 !default;
$ibo-color-success-950: $common-color-success-950 !default;
/* Warning: messages of warning, actions that would be done carefully, ... */
$ibo-color-warning-100: $ibo-color-orange-100 !default;
$ibo-color-warning-200: $ibo-color-orange-200 !default;
$ibo-color-warning-300: $ibo-color-orange-300 !default;
$ibo-color-warning-400: $ibo-color-orange-400 !default;
$ibo-color-warning-500: $ibo-color-orange-500 !default;
$ibo-color-warning-600: $ibo-color-orange-600 !default;
$ibo-color-warning-700: $ibo-color-orange-700 !default;
$ibo-color-warning-800: $ibo-color-orange-800 !default;
$ibo-color-warning-900: $ibo-color-orange-900 !default;
$ibo-color-warning-950: $ibo-color-orange-950 !default;
$ibo-color-warning-100: $common-color-warning-100 !default;
$ibo-color-warning-200: $common-color-warning-200 !default;
$ibo-color-warning-300: $common-color-warning-300 !default;
$ibo-color-warning-400: $common-color-warning-400 !default;
$ibo-color-warning-500: $common-color-warning-500 !default;
$ibo-color-warning-600: $common-color-warning-600 !default;
$ibo-color-warning-700: $common-color-warning-700 !default;
$ibo-color-warning-800: $common-color-warning-800 !default;
$ibo-color-warning-900: $common-color-warning-900 !default;
$ibo-color-warning-950: $common-color-warning-950 !default;
/* Danger: messages of failure, error, ... */
$ibo-color-error-100: $ibo-color-red-100 !default;
$ibo-color-error-200: $ibo-color-red-200 !default;
$ibo-color-error-300: $ibo-color-red-300 !default;
$ibo-color-error-400: $ibo-color-red-400 !default;
$ibo-color-error-500: $ibo-color-red-500 !default;
$ibo-color-error-600: $ibo-color-red-600 !default;
$ibo-color-error-700: $ibo-color-red-700 !default;
$ibo-color-error-800: $ibo-color-red-800 !default;
$ibo-color-error-900: $ibo-color-red-900 !default;
$ibo-color-error-950: $ibo-color-red-950 !default;
$ibo-color-error-100: $common-color-error-100 !default;
$ibo-color-error-200: $common-color-error-200 !default;
$ibo-color-error-300: $common-color-error-300 !default;
$ibo-color-error-400: $common-color-error-400 !default;
$ibo-color-error-500: $common-color-error-500 !default;
$ibo-color-error-600: $common-color-error-600 !default;
$ibo-color-error-700: $common-color-error-700 !default;
$ibo-color-error-800: $common-color-error-800 !default;
$ibo-color-error-900: $common-color-error-900 !default;
$ibo-color-error-950: $common-color-error-950 !default;
/* Danger: messages of danger, actions that cannot be undone, ... */
$ibo-color-danger-100: $ibo-color-red-100 !default;
$ibo-color-danger-200: $ibo-color-red-200 !default;
$ibo-color-danger-300: $ibo-color-red-300 !default;
$ibo-color-danger-400: $ibo-color-red-400 !default;
$ibo-color-danger-500: $ibo-color-red-500 !default;
$ibo-color-danger-600: $ibo-color-red-600 !default;
$ibo-color-danger-700: $ibo-color-red-700 !default;
$ibo-color-danger-800: $ibo-color-red-800 !default;
$ibo-color-danger-900: $ibo-color-red-900 !default;
$ibo-color-danger-950: $ibo-color-red-950 !default;
$ibo-color-danger-100: $common-color-danger-100 !default;
$ibo-color-danger-200: $common-color-danger-200 !default;
$ibo-color-danger-300: $common-color-danger-300 !default;
$ibo-color-danger-400: $common-color-danger-400 !default;
$ibo-color-danger-500: $common-color-danger-500 !default;
$ibo-color-danger-600: $common-color-danger-600 !default;
$ibo-color-danger-700: $common-color-danger-700 !default;
$ibo-color-danger-800: $common-color-danger-800 !default;
$ibo-color-danger-900: $common-color-danger-900 !default;
$ibo-color-danger-950: $common-color-danger-950 !default;
$ibo-semantic-colors: ('primary', 'secondary', 'information', 'success', 'warning', 'danger');
$ibo-semantic-colors: $common-semantic-colors !default;
$ibo-caselog-highlight-color-1: $ibo-color-green-700 !default;
$ibo-caselog-highlight-color-2: $ibo-color-pink-700 !default;
$ibo-caselog-highlight-color-3: $ibo-color-orange-400 !default;
$ibo-caselog-highlight-color-4: $ibo-color-blue-600 !default;
$ibo-caselog-highlight-color-5: $ibo-color-cyan-200 !default;
$ibo-caselog-highlight-color-6: $ibo-color-green-200 !default;
$ibo-caselog-highlight-color-7: $ibo-color-pink-300 !default;
$ibo-caselog-highlight-colors: ($ibo-caselog-highlight-color-1, $ibo-caselog-highlight-color-2, $ibo-caselog-highlight-color-3, $ibo-caselog-highlight-color-4, $ibo-caselog-highlight-color-5, $ibo-caselog-highlight-color-6, $ibo-caselog-highlight-color-7) !default;
$ibo-caselog-highlight-color-1: $common-caselog-highlight-color-1 !default;
$ibo-caselog-highlight-color-2: $common-caselog-highlight-color-2 !default;
$ibo-caselog-highlight-color-3: $common-caselog-highlight-color-3 !default;
$ibo-caselog-highlight-color-4: $common-caselog-highlight-color-4 !default;
$ibo-caselog-highlight-color-5: $common-caselog-highlight-color-5 !default;
$ibo-caselog-highlight-color-6: $common-caselog-highlight-color-6 !default;
$ibo-caselog-highlight-color-7: $common-caselog-highlight-color-7 !default;
$ibo-caselog-highlight-colors: $common-caselog-highlight-colors !default;
/* CSS variables */
:root {

23
datamodels/2.x/combodo-backoffice-darkmoon-theme/scss/scss-variables.scss
View File

@@ -21,6 +21,29 @@ $ibo-color-red-600: $nord11;
$ibo-color-red-700: darken($nord11, 7%);
$ibo-color-red-800: darken($nord11, 15%);
$ibo-color-red-900: darken($nord11, 22%);
$ibo-color-red-950: darken($nord11, 25%);
$ibo-color-error-100: $ibo-color-red-100;
$ibo-color-error-200: $ibo-color-red-200;
$ibo-color-error-300: $ibo-color-red-300;
$ibo-color-error-400: $ibo-color-red-400;
$ibo-color-error-500: $ibo-color-red-500;
$ibo-color-error-600: $ibo-color-red-600;
$ibo-color-error-700: $ibo-color-red-700;
$ibo-color-error-800: $ibo-color-red-800;
$ibo-color-error-900: $ibo-color-red-900;
$ibo-color-error-950: $ibo-color-red-950;
$ibo-color-danger-100: $ibo-color-red-100;
$ibo-color-danger-200: $ibo-color-red-200;
$ibo-color-danger-300: $ibo-color-red-300;
$ibo-color-danger-400: $ibo-color-red-400;
$ibo-color-danger-500: $ibo-color-red-500;
$ibo-color-danger-600: $ibo-color-red-600;
$ibo-color-danger-700: $ibo-color-red-700;
$ibo-color-danger-800: $ibo-color-red-800;
$ibo-color-danger-900: $ibo-color-red-900;
$ibo-color-danger-950: $ibo-color-red-950;
$ibo-color-primary-100: lighten($nord8, 15%);
$ibo-color-primary-200: darken($ibo-color-primary-100, 7%);