cps-ui-kit 0.114.0 → 0.116.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cps-ui-kit",
-  "version": "0.114.0",
+  "version": "0.116.0",
   "peerDependencies": {
     "@angular/common": "15 - 16",
     "@angular/core": "15 - 16",

package/styles/{colors.scss → _colors.scss}

@@ -242,215 +242,26 @@
   --cps-color-error-darken3: #940000;
   --cps-color-error-darken4: #760000;
 
-  // --cps-color-info-soft: #3fa8e3;
-  // --cps-color-info-soft-lighten5: #deffff;
-  // --cps-color-info-soft-lighten4: #bfffff;
-  // --cps-color-info-soft-lighten3: #a1fcff;
-  // --cps-color-info-soft-lighten2: #82dfff;
-  // --cps-color-info-soft-lighten1: #62c3ff;
-  // --cps-color-info-soft-darken1: #028ec7;
-  // --cps-color-info-soft-darken2: #0074ab;
-  // --cps-color-info-soft-darken3: #005c91;
-  // --cps-color-info-soft-darken4: #004477;
-
-  // --cps-color-success-soft: #61c246;
-  // --cps-color-success-soft-lighten5: #f3ffce;
-  // --cps-color-success-soft-lighten4: #d5ffb2;
-  // --cps-color-success-soft-lighten3: #b8ff96;
-  // --cps-color-success-soft-lighten2: #9bfb7b;
-  // --cps-color-success-soft-lighten1: #7ede60;
-  // --cps-color-success-soft-darken1: #43a62b;
-  // --cps-color-success-soft-darken2: #208b08;
-  // --cps-color-success-soft-darken3: #007100;
-  // --cps-color-success-soft-darken4: #005800;
-
-  // --cps-color-warn-soft: #f09937;
-  // --cps-color-warn-soft-lighten5: #ffffbf;
-  // --cps-color-warn-soft-lighten4: #ffffa3;
-  // --cps-color-warn-soft-lighten3: #ffec87;
-  // --cps-color-warn-soft-lighten2: #ffd06c;
-  // --cps-color-warn-soft-lighten1: #ffb452;
-  // --cps-color-warn-soft-darken1: #d17f1a;
-  // --cps-color-warn-soft-darken2: #b26600;
-  // --cps-color-warn-soft-darken3: #944d00;
-  // --cps-color-warn-soft-darken4: #783600;
-
-  // --cps-color-error-soft: #eb5545;
-  // --cps-color-error-soft-lighten5: #ffe3c6;
-  // --cps-color-error-soft-lighten4: #ffc6ab;
-  // --cps-color-error-soft-lighten3: #ffa990;
-  // --cps-color-error-soft-lighten2: #ff8d76;
-  // --cps-color-error-soft-lighten1: #ff715d;
-  // --cps-color-error-soft-darken1: #cb382e;
-  // --cps-color-error-soft-darken2: #ac1518;
-  // --cps-color-error-soft-darken3: #8d0000;
-  // --cps-color-error-soft-darken4: #6f0000;
-
+  // States backgrounds
   --cps-color-info-bg: #f7fcfe;
-  // --cps-color-info-bg-lighten5: #ffffff;
-  // --cps-color-info-bg-lighten4: #ffffff;
-  // --cps-color-info-bg-lighten3: #ffffff;
-  // --cps-color-info-bg-lighten2: #ffffff;
-  // --cps-color-info-bg-lighten1: #ffffff;
-  // --cps-color-info-bg-darken1: #dbdfe1;
-  // --cps-color-info-bg-darken2: #bfc3c5;
-  // --cps-color-info-bg-darken3: #a4a8aa;
-  // --cps-color-info-bg-darken4: #898e90;
-
   --cps-color-success-bg: #f8fbf7;
-  // --cps-color-success-bg-lighten5: #ffffff;
-  // --cps-color-success-bg-lighten4: #ffffff;
-  // --cps-color-success-bg-lighten3: #ffffff;
-  // --cps-color-success-bg-lighten2: #ffffff;
-  // --cps-color-success-bg-lighten1: #ffffff;
-  // --cps-color-success-bg-darken1: #dbdedb;
-  // --cps-color-success-bg-darken2: #c0c3bf;
-  // --cps-color-success-bg-darken3: #a5a7a4;
-  // --cps-color-success-bg-darken4: #8a8d89;
-
   --cps-color-warn-bg: #fffcf7;
-  // --cps-color-warn-bg-lighten5: #ffffff;
-  // --cps-color-warn-bg-lighten4: #ffffff;
-  // --cps-color-warn-bg-lighten3: #ffffff;
-  // --cps-color-warn-bg-lighten2: #ffffff;
-  // --cps-color-warn-bg-lighten1: #ffffff;
-  // --cps-color-warn-bg-darken1: #e2dfdb;
-  // --cps-color-warn-bg-darken2: #c6c3bf;
-  // --cps-color-warn-bg-darken3: #aba8a4;
-  // --cps-color-warn-bg-darken4: #918e89;
-
   --cps-color-error-bg: #fef8f8;
-  // --cps-color-error-bg-lighten5: #ffffff;
-  // --cps-color-error-bg-lighten4: #ffffff;
-  // --cps-color-error-bg-lighten3: #ffffff;
-  // --cps-color-error-bg-lighten2: #ffffff;
-  // --cps-color-error-bg-lighten1: #ffffff;
-  // --cps-color-error-bg-darken1: #e1dbdb;
-  // --cps-color-error-bg-darken2: #c5c0c0;
-  // --cps-color-error-bg-darken3: #aaa5a5;
-  // --cps-color-error-bg-darken4: #908a8a;
 
   //Backgrounds
   --cps-color-bg-light: #f9f8f8;
-  // --cps-color-bg-light-lighten5: #ffffff;
-  // --cps-color-bg-light-lighten4: #ffffff;
-  // --cps-color-bg-light-lighten3: #ffffff;
-  // --cps-color-bg-light-lighten2: #ffffff;
-  // --cps-color-bg-light-lighten1: #ffffff;
-  // --cps-color-bg-light-darken1: #dcdbdb;
-  // --cps-color-bg-light-darken2: #c1c0c0;
-  // --cps-color-bg-light-darken3: #a5a5a5;
-  // --cps-color-bg-light-darken4: #8b8a8a;
-
   --cps-color-bg-mid: #f4f3f3;
-  // --cps-color-bg-mid-lighten5: #ffffff;
-  // --cps-color-bg-mid-lighten4: #ffffff;
-  // --cps-color-bg-mid-lighten3: #ffffff;
-  // --cps-color-bg-mid-lighten2: #ffffff;
-  // --cps-color-bg-mid-lighten1: #ffffff;
-  // --cps-color-bg-mid-darken1: #d8d7d7;
-  // --cps-color-bg-mid-darken2: #bcbbbb;
-  // --cps-color-bg-mid-darken3: #a1a0a0;
-  // --cps-color-bg-mid-darken4: #878686;
-
   --cps-color-bg-dark: #eeeded;
-  // --cps-color-bg-dark-lighten5: #ffffff;
-  // --cps-color-bg-dark-lighten4: #ffffff;
-  // --cps-color-bg-dark-lighten3: #ffffff;
-  // --cps-color-bg-dark-lighten2: #ffffff;
-  // --cps-color-bg-dark-lighten1: #ffffff;
-  // --cps-color-bg-dark-darken1: #d2d1d1;
-  // --cps-color-bg-dark-darken2: #b6b5b5;
-  // --cps-color-bg-dark-darken3: #9b9a9a;
-  // --cps-color-bg-dark-darken4: #818080;
 
   //Lines
   --cps-color-line-light: #e3e2e2;
-  // --cps-color-line-light-lighten5: #ffffff;
-  // --cps-color-line-light-lighten4: #ffffff;
-  // --cps-color-line-light-lighten3: #ffffff;
-  // --cps-color-line-light-lighten2: #ffffff;
-  // --cps-color-line-light-lighten1: #ffffff;
-  // --cps-color-line-light-darken1: #c7c6c6;
-  // --cps-color-line-light-darken2: #acabab;
-  // --cps-color-line-light-darken3: #919090;
-  // --cps-color-line-light-darken4: #787777;
-
   --cps-color-line-mid: #d7d5d5;
-  // --cps-color-line-mid-lighten5: #ffffff;
-  // --cps-color-line-mid-lighten4: #ffffff;
-  // --cps-color-line-mid-lighten3: #ffffff;
-  // --cps-color-line-mid-lighten2: #ffffff;
-  // --cps-color-line-mid-lighten1: #f3f1f1;
-  // --cps-color-line-mid-darken1: #bbb9b9;
-  // --cps-color-line-mid-darken2: #a09e9e;
-  // --cps-color-line-mid-darken3: #868484;
-  // --cps-color-line-mid-darken4: #6d6b6b;
-
   --cps-color-line-dark: #cac7c7;
-  // --cps-color-line-dark-lighten5: #ffffff;
-  // --cps-color-line-dark-lighten4: #ffffff;
-  // --cps-color-line-dark-lighten3: #ffffff;
-  // --cps-color-line-dark-lighten2: #ffffff;
-  // --cps-color-line-dark-lighten1: #e6e3e3;
-  // --cps-color-line-dark-darken1: #afacac;
-  // --cps-color-line-dark-darken2: #949191;
-  // --cps-color-line-dark-darken3: #7a7878;
-  // --cps-color-line-dark-darken4: #615f5f;
 
   //Text
   --cps-color-text-darkest: #2d2323;
-  // --cps-color-text-darkest-lighten5: #a79a9a;
-  // --cps-color-text-darkest-lighten4: #8d8080;
-  // --cps-color-text-darkest-lighten3: #736767;
-  // --cps-color-text-darkest-lighten2: #5b4f4f;
-  // --cps-color-text-darkest-lighten1: #433838;
-  // --cps-color-text-darkest-darken1: #190d0d;
-  // --cps-color-text-darkest-darken2: #000000;
-  // --cps-color-text-darkest-darken3: #000000;
-  // --cps-color-text-darkest-darken4: #000000;
-
   --cps-color-text-dark: #524a4a;
-  // --cps-color-text-dark-lighten5: #d4caca;
-  // --cps-color-text-dark-lighten4: #b8afaf;
-  // --cps-color-text-dark-lighten3: #9d9494;
-  // --cps-color-text-dark-lighten2: #837b7b;
-  // --cps-color-text-dark-lighten1: #6a6262;
-  // --cps-color-text-dark-darken1: #3b3333;
-  // --cps-color-text-dark-darken2: #251e1e;
-  // --cps-color-text-dark-darken3: #110505;
-  // --cps-color-text-dark-darken4: #000000;
-
   --cps-color-text-mild: #787272;
-  // --cps-color-text-mild-lighten5: #fff9f9;
-  // --cps-color-text-mild-lighten4: #e4dddd;
-  // --cps-color-text-mild-lighten3: #c8c1c1;
-  // --cps-color-text-mild-lighten2: #aca6a6;
-  // --cps-color-text-mild-lighten1: #928b8b;
-  // --cps-color-text-mild-darken1: #5f5a5a;
-  // --cps-color-text-mild-darken2: #484242;
-  // --cps-color-text-mild-darken3: #312c2c;
-  // --cps-color-text-mild-darken4: #1c1818;
-
   --cps-color-text-light: #9a9595;
-  // --cps-color-text-light-lighten5: #ffffff;
-  // --cps-color-text-light-lighten4: #ffffff;
-  // --cps-color-text-light-lighten3: #ede7e7;
-  // --cps-color-text-light-lighten2: #d0cbcb;
-  // --cps-color-text-light-lighten1: #b5b0b0;
-  // --cps-color-text-light-darken1: #807b7b;
-  // --cps-color-text-light-darken2: #676262;
-  // --cps-color-text-light-darken3: #4f4b4b;
-  // --cps-color-text-light-darken4: #383434;
-
   --cps-color-text-lightest: #b5b2b2;
-  // --cps-color-text-lightest-lighten5: #ffffff;
-  // --cps-color-text-lightest-lighten4: #ffffff;
-  // --cps-color-text-lightest-lighten3: #ffffff;
-  // --cps-color-text-lightest-lighten2: #edeaea;
-  // --cps-color-text-lightest-lighten1: #d1cdcd;
-  // --cps-color-text-lightest-darken1: #9a9797;
-  // --cps-color-text-lightest-darken2: #807d7d;
-  // --cps-color-text-lightest-darken3: #676464;
-  // --cps-color-text-lightest-darken4: #4f4d4d;
 }

package/styles/styles.scss

@@ -1,10 +1,26 @@
-@import 'bootstrap-grid';
-@import 'variables.scss';
-@import 'fonts.scss';
-@import 'cps-tooltip-style.scss';
+@import './_bootstrap-grid';
+@import './_colors.scss';
+@import './_fonts.scss';
 
 *,
 *::before,
 *::after {
   box-sizing: border-box;
 }
+
+.cps-tooltip {
+  position: absolute;
+  top: 0;
+  cursor: default;
+  font-size: 14px;
+  background: #f9f5f6;
+  color: var(--cps-color-text-darkest);
+  font-family: 'Source Sans Pro', sans-serif;
+  border: 1px solid var(--cps-color-calm);
+  overflow-wrap: break-word;
+  border-radius: 3px;
+  padding: 3px;
+  transition: opacity 0.2s;
+  opacity: 0;
+  z-index: 1500;
+}

package/styles/cps-tooltip-style.scss

@@ -1,16 +0,0 @@
-.cps-tooltip {
-  position: absolute;
-  top: 0;
-  cursor: default;
-  font-size: 14px;
-  background: #f9f5f6;
-  color: var(--cps-color-text-darkest);
-  font-family: 'Source Sans Pro', sans-serif;
-  border: 1px solid var(--cps-color-calm);
-  overflow-wrap: break-word;
-  border-radius: 3px;
-  padding: 3px;
-  transition: opacity 0.2s;
-  opacity: 0;
-  z-index: 2100;
-}

package/styles/variables.scss

@@ -1 +0,0 @@
-@import 'colors.scss';