@alfalab/core-components-vars 9.8.0 → 9.9.0

package/src/colors-students.css

@@ -0,0 +1,4 @@
+:root {
+    --color-static-students-electric-lime: #8fff00;
+    --color-static-students-razzle-rose: #fe34c6;
+}

package/src/colors-students.ts

@@ -0,0 +1,4 @@
+// eslint-disable-next-line import/no-webpack-loader-syntax
+import styles from '!!css-loader!@alfalab/core-components/vars/colors-students.css';
+
+export default styles.toString();

package/src/colors-transparent.css

@@ -1,28 +1,28 @@
 :root {
-    --color-dynamic-nulled: rgba(0, 0, 0, 0);
-    --color-dynamic-primary-dark: rgba(0, 0, 0, 0.8);
-    --color-dynamic-primary-light: rgba(255, 255, 255, 0.8);
-    --color-dynamic-quaternary-dark: rgba(0, 0, 0, 0.32);
-    --color-dynamic-quaternary-light: rgba(255, 255, 255, 0.32);
-    --color-dynamic-quinary-dark: rgba(0, 0, 0, 0.16);
-    --color-dynamic-quinary-light: rgba(255, 255, 255, 0.16);
-    --color-dynamic-secondary-dark: rgba(0, 0, 0, 0.64);
-    --color-dynamic-secondary-light: rgba(255, 255, 255, 0.64);
-    --color-dynamic-senary-dark: rgba(0, 0, 0, 0.12);
-    --color-dynamic-senary-light: rgba(255, 255, 255, 0.12);
-    --color-dynamic-tertiary-dark: rgba(0, 0, 0, 0.48);
-    --color-dynamic-tertiary-light: rgba(255, 255, 255, 0.48);
-    --color-static-nulled: rgba(0, 0, 0, 0);
-    --color-static-primary-dark: rgba(0, 0, 0, 0.8);
-    --color-static-primary-light: rgba(255, 255, 255, 0.8);
-    --color-static-quaternary-dark: rgba(0, 0, 0, 0.32);
-    --color-static-quaternary-light: rgba(255, 255, 255, 0.32);
-    --color-static-quinary-dark: rgba(0, 0, 0, 0.16);
-    --color-static-quinary-light: rgba(255, 255, 255, 0.16);
-    --color-static-secondary-dark: rgba(0, 0, 0, 0.64);
-    --color-static-secondary-light: rgba(255, 255, 255, 0.64);
-    --color-static-senary-dark: rgba(0, 0, 0, 0.12);
-    --color-static-senary-light: rgba(255, 255, 255, 0.12);
-    --color-static-tertiary-dark: rgba(0, 0, 0, 0.48);
-    --color-static-tertiary-light: rgba(255, 255, 255, 0.48);
+    --color-dynamic-nulled: rgba(0, 0, 0, 0); /* deprecated */
+    --color-dynamic-primary-dark: rgba(0, 0, 0, 0.8); /* deprecated */
+    --color-dynamic-primary-light: rgba(255, 255, 255, 0.8); /* deprecated */
+    --color-dynamic-quaternary-dark: rgba(0, 0, 0, 0.32); /* deprecated */
+    --color-dynamic-quaternary-light: rgba(255, 255, 255, 0.32); /* deprecated */
+    --color-dynamic-quinary-dark: rgba(0, 0, 0, 0.16); /* deprecated */
+    --color-dynamic-quinary-light: rgba(255, 255, 255, 0.16); /* deprecated */
+    --color-dynamic-secondary-dark: rgba(0, 0, 0, 0.64); /* deprecated */
+    --color-dynamic-secondary-light: rgba(255, 255, 255, 0.64); /* deprecated */
+    --color-dynamic-senary-dark: rgba(0, 0, 0, 0.12); /* deprecated */
+    --color-dynamic-senary-light: rgba(255, 255, 255, 0.12); /* deprecated */
+    --color-dynamic-tertiary-dark: rgba(0, 0, 0, 0.48); /* deprecated */
+    --color-dynamic-tertiary-light: rgba(255, 255, 255, 0.48); /* deprecated */
+    --color-static-nulled: rgba(0, 0, 0, 0); /* deprecated */
+    --color-static-primary-dark: rgba(0, 0, 0, 0.8); /* deprecated */
+    --color-static-primary-light: rgba(255, 255, 255, 0.8); /* deprecated */
+    --color-static-quaternary-dark: rgba(0, 0, 0, 0.32); /* deprecated */
+    --color-static-quaternary-light: rgba(255, 255, 255, 0.32); /* deprecated */
+    --color-static-quinary-dark: rgba(0, 0, 0, 0.16); /* deprecated */
+    --color-static-quinary-light: rgba(255, 255, 255, 0.16); /* deprecated */
+    --color-static-secondary-dark: rgba(0, 0, 0, 0.64); /* deprecated */
+    --color-static-secondary-light: rgba(255, 255, 255, 0.64); /* deprecated */
+    --color-static-senary-dark: rgba(0, 0, 0, 0.12); /* deprecated */
+    --color-static-senary-light: rgba(255, 255, 255, 0.12); /* deprecated */
+    --color-static-tertiary-dark: rgba(0, 0, 0, 0.48); /* deprecated */
+    --color-static-tertiary-light: rgba(255, 255, 255, 0.48); /* deprecated */
 }

package/src/colors.css

@@ -1,71 +1,71 @@
 :root {
-    --color-dark-indigo: #0b1f35;
-    --color-dark-indigo-60: rgba(11, 31, 53, 0.6);
-    --color-dark-indigo-30: rgba(11, 31, 53, 0.3);
-    --color-dark-indigo-15: rgba(11, 31, 53, 0.15);
-    --color-dark-indigo-10: rgba(11, 31, 53, 0.1);
-    --color-dark-indigo-07: rgba(11, 31, 53, 0.07);
-    --color-dark-indigo-05: rgba(11, 31, 53, 0.05);
-    --color-dark-indigo-60-flat: #6d7986;
-    --color-dark-indigo-30-flat: #b6bcc3;
-    --color-dark-indigo-15-flat: #dbdee1;
-    --color-dark-indigo-10-flat: #e7e9eb;
-    --color-dark-indigo-07-flat: #eeeff1;
-    --color-dark-indigo-05-flat: #f3f4f5;
-    --color-red-brand: #ef3124;
-    --color-red-brand-85: rgba(239, 49, 36, 0.85);
-    --color-red-brand-70: rgba(239, 49, 36, 0.7);
-    --color-red-brand-50: rgba(239, 49, 36, 0.5);
-    --color-red-brand-30: rgba(239, 49, 36, 0.3);
-    --color-red-brand-20: rgba(239, 49, 36, 0.2);
-    --color-red-brand-10: rgba(239, 49, 36, 0.1);
-    --color-red-brand-85-flat: #f15045;
-    --color-red-brand-70-flat: #f46f66;
-    --color-red-brand-50-flat: #f69791;
-    --color-red-brand-30-flat: #fbc2bd;
-    --color-red-brand-20-flat: #fcd6d3;
-    --color-red-brand-10-flat: #feebea;
-    --color-red-brand-05-flat: #fef5f4;
-    --color-red-dark: #d91d0b;
-    --color-red-error: #ff5c5c;
-    --color-green-text: #13a463;
-    --color-green-text-60: rgba(19, 164, 99, 0.6);
-    --color-green-text-60-flat: #71c8a1;
-    --color-green-done: #2fc26e;
-    --color-green-done-20: rgba(47, 194, 110, 0.2);
-    --color-green-done-10: rgba(47, 194, 110, 0.1);
-    --color-green-done-05: rgba(47, 194, 110, 0.05);
-    --color-green-done-20-flat: #d5f3e2;
-    --color-green-done-10-flat: #ebf9f1;
-    --color-green-done-05-flat: #f4fcf7;
-    --color-blue-action: #0e60b9;
-    --color-blue-swipe-a: #2670c6;
-    --color-blue-swipe-b: #3781d8;
-    --color-blue-swipe-c: #4a90e2;
-    --color-blue-link-mobile: #007aff;
-    --color-blue-link-mobile-10: rgba(0, 122, 255, 0.1);
-    --color-blue-link-mobile-10-flat: #e6f2ff;
-    --color-blue-link-web: #0f62fe;
-    --color-sand: #f6bf65;
-    --color-lavender: #8888ad;
-    --color-amethyst: #a489aa;
-    --color-black: #000;
-    --color-black-60: rgba(0, 0, 0, 0.6);
-    --color-black-30: rgba(0, 0, 0, 0.3);
-    --color-black-10: rgba(0, 0, 0, 0.1);
-    --color-black-60-flat: #666;
-    --color-black-30-flat: #b3b3b3;
-    --color-black-10-flat: #e6e6e6;
-    --color-white: #fff;
-    --color-white-60: rgba(255, 255, 255, 0.6);
-    --color-white-30: rgba(255, 255, 255, 0.3);
-    --color-white-10: rgba(255, 255, 255, 0.1);
-    --color-bg-corporate: #212a33;
-    --color-bg-corporate-90: rgba(33, 42, 51, 0.9);
-    --color-bg-corporate-60: rgba(33, 42, 51, 0.6);
-    --color-bg-corporate-30: rgba(33, 42, 51, 0.3);
-    --color-bg-corporate-90-flat: #384048;
-    --color-bg-corporate-60-flat: #7a7f85;
-    --color-bg-corporate-30-flat: #bdc0c2;
-    --color-light-blue: #f5f7f9;
+    --color-dark-indigo: #0b1f35; /* deprecated */
+    --color-dark-indigo-60: rgba(11, 31, 53, 0.6); /* deprecated */
+    --color-dark-indigo-30: rgba(11, 31, 53, 0.3); /* deprecated */
+    --color-dark-indigo-15: rgba(11, 31, 53, 0.15); /* deprecated */
+    --color-dark-indigo-10: rgba(11, 31, 53, 0.1); /* deprecated */
+    --color-dark-indigo-07: rgba(11, 31, 53, 0.07); /* deprecated */
+    --color-dark-indigo-05: rgba(11, 31, 53, 0.05); /* deprecated */
+    --color-dark-indigo-60-flat: #6d7986; /* deprecated */
+    --color-dark-indigo-30-flat: #b6bcc3; /* deprecated */
+    --color-dark-indigo-15-flat: #dbdee1; /* deprecated */
+    --color-dark-indigo-10-flat: #e7e9eb; /* deprecated */
+    --color-dark-indigo-07-flat: #eeeff1; /* deprecated */
+    --color-dark-indigo-05-flat: #f3f4f5; /* deprecated */
+    --color-red-brand: #ef3124; /* deprecated */
+    --color-red-brand-85: rgba(239, 49, 36, 0.85); /* deprecated */
+    --color-red-brand-70: rgba(239, 49, 36, 0.7); /* deprecated */
+    --color-red-brand-50: rgba(239, 49, 36, 0.5); /* deprecated */
+    --color-red-brand-30: rgba(239, 49, 36, 0.3); /* deprecated */
+    --color-red-brand-20: rgba(239, 49, 36, 0.2); /* deprecated */
+    --color-red-brand-10: rgba(239, 49, 36, 0.1); /* deprecated */
+    --color-red-brand-85-flat: #f15045; /* deprecated */
+    --color-red-brand-70-flat: #f46f66; /* deprecated */
+    --color-red-brand-50-flat: #f69791; /* deprecated */
+    --color-red-brand-30-flat: #fbc2bd; /* deprecated */
+    --color-red-brand-20-flat: #fcd6d3; /* deprecated */
+    --color-red-brand-10-flat: #feebea; /* deprecated */
+    --color-red-brand-05-flat: #fef5f4; /* deprecated */
+    --color-red-dark: #d91d0b; /* deprecated */
+    --color-red-error: #ff5c5c; /* deprecated */
+    --color-green-text: #13a463; /* deprecated */
+    --color-green-text-60: rgba(19, 164, 99, 0.6); /* deprecated */
+    --color-green-text-60-flat: #71c8a1; /* deprecated */
+    --color-green-done: #2fc26e; /* deprecated */
+    --color-green-done-20: rgba(47, 194, 110, 0.2); /* deprecated */
+    --color-green-done-10: rgba(47, 194, 110, 0.1); /* deprecated */
+    --color-green-done-05: rgba(47, 194, 110, 0.05); /* deprecated */
+    --color-green-done-20-flat: #d5f3e2; /* deprecated */
+    --color-green-done-10-flat: #ebf9f1; /* deprecated */
+    --color-green-done-05-flat: #f4fcf7; /* deprecated */
+    --color-blue-action: #0e60b9; /* deprecated */
+    --color-blue-swipe-a: #2670c6; /* deprecated */
+    --color-blue-swipe-b: #3781d8; /* deprecated */
+    --color-blue-swipe-c: #4a90e2; /* deprecated */
+    --color-blue-link-mobile: #007aff; /* deprecated */
+    --color-blue-link-mobile-10: rgba(0, 122, 255, 0.1); /* deprecated */
+    --color-blue-link-mobile-10-flat: #e6f2ff; /* deprecated */
+    --color-blue-link-web: #0f62fe; /* deprecated */
+    --color-sand: #f6bf65; /* deprecated */
+    --color-lavender: #8888ad; /* deprecated */
+    --color-amethyst: #a489aa; /* deprecated */
+    --color-black: #000; /* deprecated */
+    --color-black-60: rgba(0, 0, 0, 0.6); /* deprecated */
+    --color-black-30: rgba(0, 0, 0, 0.3); /* deprecated */
+    --color-black-10: rgba(0, 0, 0, 0.1); /* deprecated */
+    --color-black-60-flat: #666; /* deprecated */
+    --color-black-30-flat: #b3b3b3; /* deprecated */
+    --color-black-10-flat: #e6e6e6; /* deprecated */
+    --color-white: #fff; /* deprecated */
+    --color-white-60: rgba(255, 255, 255, 0.6); /* deprecated */
+    --color-white-30: rgba(255, 255, 255, 0.3); /* deprecated */
+    --color-white-10: rgba(255, 255, 255, 0.1); /* deprecated */
+    --color-bg-corporate: #212a33; /* deprecated */
+    --color-bg-corporate-90: rgba(33, 42, 51, 0.9); /* deprecated */
+    --color-bg-corporate-60: rgba(33, 42, 51, 0.6); /* deprecated */
+    --color-bg-corporate-30: rgba(33, 42, 51, 0.3); /* deprecated */
+    --color-bg-corporate-90-flat: #384048; /* deprecated */
+    --color-bg-corporate-60-flat: #7a7f85; /* deprecated */
+    --color-bg-corporate-30-flat: #bdc0c2; /* deprecated */
+    --color-light-blue: #f5f7f9; /* deprecated */
 }

package/src/mixins.css

@@ -21,7 +21,7 @@
     }
 
     &::-webkit-scrollbar-thumb {
-        background-color: var(--color-light-graphic-primary-alpha-30);
+        background-color: var(--color-light-neutral-translucent-500);
         border-color: transparent;
         border-style: solid;
         border-width: 4px;
@@ -49,7 +49,7 @@
     }
 
     &::-webkit-scrollbar-thumb:active {
-        background-color: var(--color-light-graphic-primary-alpha-60);
+        background-color: var(--color-light-text-secondary);
     }
 
     &::-webkit-resizer {