N°2847 - Add "information" semantic to color palette, reorder colors like a rainbow 🌈

This commit is contained in:
Molkobain
2020-08-26 17:43:13 +02:00
parent fa406c1f17
commit 3b0ca9d771

View File

@@ -32,36 +32,6 @@ $ibo-color-grey-700: hsla(214, 11.3%, 48.6%, 1) !default;
$ibo-color-grey-800: hsla(215, 16.9%, 30.2%, 1) !default;
$ibo-color-grey-900: hsla(215, 22.4%, 16.7%, 1) !default;
$ibo-color-red-100: hsla(0, 76.9%, 94.9%, 1) !default;
$ibo-color-red-200: hsla(0, 95.1%, 92%, 1) !default;
$ibo-color-red-300: hsla(0, 97.4%, 84.7%, 1) !default;
$ibo-color-red-400: hsla(0, 95.3%, 74.7%, 1) !default;
$ibo-color-red-500: hsla(0, 87.8%, 67.8%, 1) !default;
$ibo-color-red-600: hsla(0, 76.3%, 57.1%, 1) !default;
$ibo-color-red-700: hsla(0, 60.8%, 48%, 1) !default;
$ibo-color-red-800: hsla(0, 55.8%, 39%, 1) !default;
$ibo-color-red-900: hsla(0, 46.8%, 31%, 1) !default;
$ibo-color-orange-100: hsla(40, 100%, 97.1%, 1) !default;
$ibo-color-orange-200: hsla(39, 96.4%, 89%, 1) !default;
$ibo-color-orange-300: hsla(38, 93.2%, 76.9%, 1) !default;
$ibo-color-orange-400: hsla(33, 89.9%, 64.9%, 1) !default;
$ibo-color-orange-500: hsla(28, 82.9%, 51.8%, 1) !default;
$ibo-color-orange-600: hsla(24, 74.7%, 49.6%, 1) !default;
$ibo-color-orange-700: hsla(20, 70.7%, 44.1%, 1) !default;
$ibo-color-orange-800: hsla(16, 65.1%, 37.1%, 1) !default;
$ibo-color-orange-900: hsla(14, 60.8%, 30%, 1) !default;
$ibo-color-green-100: hsla(88, 50.7%, 85.7%, 1) !default;
$ibo-color-green-200: hsla(88, 50%, 76.5%, 1) !default;
$ibo-color-green-300: hsla(88, 50%, 67.1%, 1) !default;
$ibo-color-green-400: hsla(88, 50.2%, 59.8%, 1) !default;
$ibo-color-green-500: hsla(88, 50.2%, 52.7%, 1) !default;
$ibo-color-green-600: hsla(89, 46.1%, 48%, 1) !default;
$ibo-color-green-700: hsla(92, 47.9%, 42.2%, 1) !default;
$ibo-color-green-800: hsla(95, 49.5%, 36.5%, 1) !default;
$ibo-color-green-900: hsla(103, 55.6%, 26.5%, 1) !default;
$ibo-color-blue-grey-50: hsla(210, 36%, 96%, 1) !default;
$ibo-color-blue-grey-100: hsla(198, 15.7%, 83.7%, 1) !default;
$ibo-color-blue-grey-200: hsla(200, 15.3%, 73.1%, 1) !default;
@@ -93,6 +63,36 @@ $ibo-color-cyan-700: hsla(186, 100%, 32.7%, 1) !default;
$ibo-color-cyan-800: hsla(185, 100%, 28%, 1) !default;
$ibo-color-cyan-900: hsla(182, 100%, 19.6%, 1) !default;
$ibo-color-green-100: hsla(88, 50.7%, 85.7%, 1) !default;
$ibo-color-green-200: hsla(88, 50%, 76.5%, 1) !default;
$ibo-color-green-300: hsla(88, 50%, 67.1%, 1) !default;
$ibo-color-green-400: hsla(88, 50.2%, 59.8%, 1) !default;
$ibo-color-green-500: hsla(88, 50.2%, 52.7%, 1) !default;
$ibo-color-green-600: hsla(89, 46.1%, 48%, 1) !default;
$ibo-color-green-700: hsla(92, 47.9%, 42.2%, 1) !default;
$ibo-color-green-800: hsla(95, 49.5%, 36.5%, 1) !default;
$ibo-color-green-900: hsla(103, 55.6%, 26.5%, 1) !default;
$ibo-color-orange-100: hsla(40, 100%, 97.1%, 1) !default;
$ibo-color-orange-200: hsla(39, 96.4%, 89%, 1) !default;
$ibo-color-orange-300: hsla(38, 93.2%, 76.9%, 1) !default;
$ibo-color-orange-400: hsla(33, 89.9%, 64.9%, 1) !default;
$ibo-color-orange-500: hsla(28, 82.9%, 51.8%, 1) !default;
$ibo-color-orange-600: hsla(24, 74.7%, 49.6%, 1) !default;
$ibo-color-orange-700: hsla(20, 70.7%, 44.1%, 1) !default;
$ibo-color-orange-800: hsla(16, 65.1%, 37.1%, 1) !default;
$ibo-color-orange-900: hsla(14, 60.8%, 30%, 1) !default;
$ibo-color-red-100: hsla(0, 76.9%, 94.9%, 1) !default;
$ibo-color-red-200: hsla(0, 95.1%, 92%, 1) !default;
$ibo-color-red-300: hsla(0, 97.4%, 84.7%, 1) !default;
$ibo-color-red-400: hsla(0, 95.3%, 74.7%, 1) !default;
$ibo-color-red-500: hsla(0, 87.8%, 67.8%, 1) !default;
$ibo-color-red-600: hsla(0, 76.3%, 57.1%, 1) !default;
$ibo-color-red-700: hsla(0, 60.8%, 48%, 1) !default;
$ibo-color-red-800: hsla(0, 55.8%, 39%, 1) !default;
$ibo-color-red-900: hsla(0, 46.8%, 31%, 1) !default;
$ibo-color-pink-100: hsla(348, 100%, 98%, 1) !default;
$ibo-color-pink-200: hsla(343, 95%, 92%, 1) !default;
$ibo-color-pink-300: hsla(339, 90%, 85%, 1) !default;
@@ -119,36 +119,6 @@ $ibo-color-pink-900: hsla(318, 51%, 29%, 1) !default;
--ibo-color-grey-800: #{$ibo-color-grey-800};
--ibo-color-grey-900: #{$ibo-color-grey-900};
--ibo-color-red-100: #{$ibo-color-red-100};
--ibo-color-red-200: #{$ibo-color-red-200};
--ibo-color-red-300: #{$ibo-color-red-300};
--ibo-color-red-400: #{$ibo-color-red-400};
--ibo-color-red-500: #{$ibo-color-red-500};
--ibo-color-red-600: #{$ibo-color-red-600};
--ibo-color-red-700: #{$ibo-color-red-700};
--ibo-color-red-800: #{$ibo-color-red-800};
--ibo-color-red-900: #{$ibo-color-red-900};
--ibo-color-orange-100: #{$ibo-color-orange-100};
--ibo-color-orange-200: #{$ibo-color-orange-200};
--ibo-color-orange-300: #{$ibo-color-orange-300};
--ibo-color-orange-400: #{$ibo-color-orange-400};
--ibo-color-orange-500: #{$ibo-color-orange-500};
--ibo-color-orange-600: #{$ibo-color-orange-600};
--ibo-color-orange-700: #{$ibo-color-orange-700};
--ibo-color-orange-800: #{$ibo-color-orange-800};
--ibo-color-orange-900: #{$ibo-color-orange-900};
--ibo-color-green-100: #{$ibo-color-green-100};
--ibo-color-green-200: #{$ibo-color-green-200};
--ibo-color-green-300: #{$ibo-color-green-300};
--ibo-color-green-400: #{$ibo-color-green-400};
--ibo-color-green-500: #{$ibo-color-green-500};
--ibo-color-green-600: #{$ibo-color-green-600};
--ibo-color-green-700: #{$ibo-color-green-700};
--ibo-color-green-800: #{$ibo-color-green-800};
--ibo-color-green-900: #{$ibo-color-green-900};
--ibo-color-blue-grey-50: #{$ibo-color-blue-grey-50};
--ibo-color-blue-grey-100: #{$ibo-color-blue-grey-100};
--ibo-color-blue-grey-200: #{$ibo-color-blue-grey-200};
@@ -180,6 +150,36 @@ $ibo-color-pink-900: hsla(318, 51%, 29%, 1) !default;
--ibo-color-cyan-800: #{$ibo-color-cyan-800};
--ibo-color-cyan-900: #{$ibo-color-cyan-900};
--ibo-color-green-100: #{$ibo-color-green-100};
--ibo-color-green-200: #{$ibo-color-green-200};
--ibo-color-green-300: #{$ibo-color-green-300};
--ibo-color-green-400: #{$ibo-color-green-400};
--ibo-color-green-500: #{$ibo-color-green-500};
--ibo-color-green-600: #{$ibo-color-green-600};
--ibo-color-green-700: #{$ibo-color-green-700};
--ibo-color-green-800: #{$ibo-color-green-800};
--ibo-color-green-900: #{$ibo-color-green-900};
--ibo-color-orange-100: #{$ibo-color-orange-100};
--ibo-color-orange-200: #{$ibo-color-orange-200};
--ibo-color-orange-300: #{$ibo-color-orange-300};
--ibo-color-orange-400: #{$ibo-color-orange-400};
--ibo-color-orange-500: #{$ibo-color-orange-500};
--ibo-color-orange-600: #{$ibo-color-orange-600};
--ibo-color-orange-700: #{$ibo-color-orange-700};
--ibo-color-orange-800: #{$ibo-color-orange-800};
--ibo-color-orange-900: #{$ibo-color-orange-900};
--ibo-color-red-100: #{$ibo-color-red-100};
--ibo-color-red-200: #{$ibo-color-red-200};
--ibo-color-red-300: #{$ibo-color-red-300};
--ibo-color-red-400: #{$ibo-color-red-400};
--ibo-color-red-500: #{$ibo-color-red-500};
--ibo-color-red-600: #{$ibo-color-red-600};
--ibo-color-red-700: #{$ibo-color-red-700};
--ibo-color-red-800: #{$ibo-color-red-800};
--ibo-color-red-900: #{$ibo-color-red-900};
--ibo-color-pink-100: #{$ibo-color-pink-100};
--ibo-color-pink-200: #{$ibo-color-pink-200};
--ibo-color-pink-300: #{$ibo-color-pink-300};
@@ -202,6 +202,26 @@ $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-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-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-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;
@@ -239,7 +259,7 @@ $ibo-caselog-highlight-color-4: $ibo-color-orange-400 !default;
$ibo-caselog-highlight-color-5: $ibo-color-cyan-200 !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) !default;
:root{
:root {
--ibo-color-primary-100: #{$ibo-color-primary-100};
--ibo-color-primary-200: #{$ibo-color-primary-200};
--ibo-color-primary-300: #{$ibo-color-primary-300};
@@ -250,6 +270,26 @@ $ibo-caselog-highlight-colors: ($ibo-caselog-highlight-color-1, $ibo-caselog-hig
--ibo-color-primary-800: #{$ibo-color-primary-800};
--ibo-color-primary-900: #{$ibo-color-primary-900};
--ibo-color-secondary-100: #{$ibo-color-secondary-100};
--ibo-color-secondary-200: #{$ibo-color-secondary-200};
--ibo-color-secondary-300: #{$ibo-color-secondary-300};
--ibo-color-secondary-400: #{$ibo-color-secondary-400};
--ibo-color-secondary-500: #{$ibo-color-secondary-500};
--ibo-color-secondary-600: #{$ibo-color-secondary-600};
--ibo-color-secondary-700: #{$ibo-color-secondary-700};
--ibo-color-secondary-800: #{$ibo-color-secondary-800};
--ibo-color-secondary-900: #{$ibo-color-secondary-900};
--ibo-color-information-100: #{$ibo-color-information-100};
--ibo-color-information-200: #{$ibo-color-information-200};
--ibo-color-information-300: #{$ibo-color-information-300};
--ibo-color-information-400: #{$ibo-color-information-400};
--ibo-color-information-500: #{$ibo-color-information-500};
--ibo-color-information-600: #{$ibo-color-information-600};
--ibo-color-information-700: #{$ibo-color-information-700};
--ibo-color-information-800: #{$ibo-color-information-800};
--ibo-color-information-900: #{$ibo-color-information-900};
--ibo-color-success-100: #{$ibo-color-success-100};
--ibo-color-success-200: #{$ibo-color-success-200};
--ibo-color-success-300: #{$ibo-color-success-300};
@@ -287,26 +327,4 @@ $ibo-caselog-highlight-colors: ($ibo-caselog-highlight-color-1, $ibo-caselog-hig
--ibo-caselog-color-highlight-5: #{$ibo-caselog-highlight-color-5};
}
$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;
:root{
--ibo-color-secondary-100: #{$ibo-color-secondary-100};
--ibo-color-secondary-200: #{$ibo-color-secondary-200};
--ibo-color-secondary-300: #{$ibo-color-secondary-300};
--ibo-color-secondary-400: #{$ibo-color-secondary-400};
--ibo-color-secondary-500: #{$ibo-color-secondary-500};
--ibo-color-secondary-600: #{$ibo-color-secondary-600};
--ibo-color-secondary-700: #{$ibo-color-secondary-700};
--ibo-color-secondary-800: #{$ibo-color-secondary-800};
--ibo-color-secondary-900: #{$ibo-color-secondary-900};
}
$ibo-colors: ('grey', 'red', 'orange', 'green', 'blue-grey', 'blue', 'cyan', 'pink', 'primary', 'seconday')
$ibo-colors: ('grey', 'blue-grey', 'blue', 'cyan', 'green', 'orange', 'red', 'pink', 'primary', 'secondary', 'information', 'success', 'warning', 'danger');