@alfalab/core-components-vars 9.12.0 → 9.13.0

package/border-radius.css

@@ -11,14 +11,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/cssm/border-radius.css

@@ -11,14 +11,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/cssm/bundle/click.css

@@ -1380,14 +1380,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/cssm/bundle/corp.css

@@ -1380,14 +1380,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/cssm/bundle/intranet.css

@@ -1380,14 +1380,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/cssm/bundle/mobile.css

@@ -1380,14 +1380,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/cssm/bundle/site.css

@@ -1380,14 +1380,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/cssm/index.css

@@ -1474,14 +1474,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/cssm/index.d.ts

@@ -1445,14 +1445,15 @@ export const borderRadius3xl: "24px";
 export const borderRadiusCircle: "50%";
 export const borderRadiusPill: "99px";
 export const borderRadius0: "0";
-export const borderRadius4: "4px";
+export const borderRadius2: "var(--border-radius-xs)";
+export const borderRadius4: "var(--border-radius-s)";
 export const borderRadius6: "6px";
-export const borderRadius8: "8px";
+export const borderRadius8: "var(--border-radius-m)";
 export const borderRadius10: "10px";
-export const borderRadius12: "12px";
-export const borderRadius16: "16px";
-export const borderRadius20: "20px";
-export const borderRadius24: "24px";
+export const borderRadius12: "var(--border-radius-l)";
+export const borderRadius16: "var(--border-radius-xl)";
+export const borderRadius20: "var(--border-radius-xxl)";
+export const borderRadius24: "var(--border-radius-3xl)";
 export const borderRadius32: "32px";
 export const borderRadius36: "36px";
 export const borderRadius64: "64px";

package/cssm/index.js

@@ -1445,14 +1445,15 @@ module.exports.borderRadius3xl = "24px";
 module.exports.borderRadiusCircle = "50%";
 module.exports.borderRadiusPill = "99px";
 module.exports.borderRadius0 = "0";
-module.exports.borderRadius4 = "4px";
+module.exports.borderRadius2 = "var(--border-radius-xs)";
+module.exports.borderRadius4 = "var(--border-radius-s)";
 module.exports.borderRadius6 = "6px";
-module.exports.borderRadius8 = "8px";
+module.exports.borderRadius8 = "var(--border-radius-m)";
 module.exports.borderRadius10 = "10px";
-module.exports.borderRadius12 = "12px";
-module.exports.borderRadius16 = "16px";
-module.exports.borderRadius20 = "20px";
-module.exports.borderRadius24 = "24px";
+module.exports.borderRadius12 = "var(--border-radius-l)";
+module.exports.borderRadius16 = "var(--border-radius-xl)";
+module.exports.borderRadius20 = "var(--border-radius-xxl)";
+module.exports.borderRadius24 = "var(--border-radius-3xl)";
 module.exports.borderRadius32 = "32px";
 module.exports.borderRadius36 = "36px";
 module.exports.borderRadius64 = "64px";

package/esm/index.d.ts

@@ -1445,14 +1445,15 @@ export const borderRadius3xl: "24px";
 export const borderRadiusCircle: "50%";
 export const borderRadiusPill: "99px";
 export const borderRadius0: "0";
-export const borderRadius4: "4px";
+export const borderRadius2: "var(--border-radius-xs)";
+export const borderRadius4: "var(--border-radius-s)";
 export const borderRadius6: "6px";
-export const borderRadius8: "8px";
+export const borderRadius8: "var(--border-radius-m)";
 export const borderRadius10: "10px";
-export const borderRadius12: "12px";
-export const borderRadius16: "16px";
-export const borderRadius20: "20px";
-export const borderRadius24: "24px";
+export const borderRadius12: "var(--border-radius-l)";
+export const borderRadius16: "var(--border-radius-xl)";
+export const borderRadius20: "var(--border-radius-xxl)";
+export const borderRadius24: "var(--border-radius-3xl)";
 export const borderRadius32: "32px";
 export const borderRadius36: "36px";
 export const borderRadius64: "64px";

package/esm/index.js

@@ -1445,14 +1445,15 @@ export const borderRadius3xl = "24px";
 export const borderRadiusCircle = "50%";
 export const borderRadiusPill = "99px";
 export const borderRadius0 = "0";
-export const borderRadius4 = "4px";
+export const borderRadius2 = "var(--border-radius-xs)";
+export const borderRadius4 = "var(--border-radius-s)";
 export const borderRadius6 = "6px";
-export const borderRadius8 = "8px";
+export const borderRadius8 = "var(--border-radius-m)";
 export const borderRadius10 = "10px";
-export const borderRadius12 = "12px";
-export const borderRadius16 = "16px";
-export const borderRadius20 = "20px";
-export const borderRadius24 = "24px";
+export const borderRadius12 = "var(--border-radius-l)";
+export const borderRadius16 = "var(--border-radius-xl)";
+export const borderRadius20 = "var(--border-radius-xxl)";
+export const borderRadius24 = "var(--border-radius-3xl)";
 export const borderRadius32 = "32px";
 export const borderRadius36 = "36px";
 export const borderRadius64 = "64px";

package/index.d.ts

@@ -1445,14 +1445,15 @@ export const borderRadius3xl: "24px";
 export const borderRadiusCircle: "50%";
 export const borderRadiusPill: "99px";
 export const borderRadius0: "0";
-export const borderRadius4: "4px";
+export const borderRadius2: "var(--border-radius-xs)";
+export const borderRadius4: "var(--border-radius-s)";
 export const borderRadius6: "6px";
-export const borderRadius8: "8px";
+export const borderRadius8: "var(--border-radius-m)";
 export const borderRadius10: "10px";
-export const borderRadius12: "12px";
-export const borderRadius16: "16px";
-export const borderRadius20: "20px";
-export const borderRadius24: "24px";
+export const borderRadius12: "var(--border-radius-l)";
+export const borderRadius16: "var(--border-radius-xl)";
+export const borderRadius20: "var(--border-radius-xxl)";
+export const borderRadius24: "var(--border-radius-3xl)";
 export const borderRadius32: "32px";
 export const borderRadius36: "36px";
 export const borderRadius64: "64px";

package/index.js

@@ -1445,14 +1445,15 @@ module.exports.borderRadius3xl = "24px";
 module.exports.borderRadiusCircle = "50%";
 module.exports.borderRadiusPill = "99px";
 module.exports.borderRadius0 = "0";
-module.exports.borderRadius4 = "4px";
+module.exports.borderRadius2 = "var(--border-radius-xs)";
+module.exports.borderRadius4 = "var(--border-radius-s)";
 module.exports.borderRadius6 = "6px";
-module.exports.borderRadius8 = "8px";
+module.exports.borderRadius8 = "var(--border-radius-m)";
 module.exports.borderRadius10 = "10px";
-module.exports.borderRadius12 = "12px";
-module.exports.borderRadius16 = "16px";
-module.exports.borderRadius20 = "20px";
-module.exports.borderRadius24 = "24px";
+module.exports.borderRadius12 = "var(--border-radius-l)";
+module.exports.borderRadius16 = "var(--border-radius-xl)";
+module.exports.borderRadius20 = "var(--border-radius-xxl)";
+module.exports.borderRadius24 = "var(--border-radius-3xl)";
 module.exports.borderRadius32 = "32px";
 module.exports.borderRadius36 = "36px";
 module.exports.borderRadius64 = "64px";

package/mixins.css

@@ -29,7 +29,7 @@
     }
 
     &::-webkit-scrollbar-thumb:vertical {
-        border-radius: var(--border-radius-circle) / 6px;
+        border-radius: var(--border-radius-circle) / var(--border-radius-6);
         min-height: 40px;
     }
 
@@ -39,7 +39,7 @@
     }
 
     &::-webkit-scrollbar-thumb:horizontal {
-        border-radius: 6px / var(--border-radius-circle);
+        border-radius: var(--border-radius-6) / var(--border-radius-circle);
         min-width: 40px;
     }
 
@@ -90,7 +90,7 @@
     -webkit-tap-highlight-color: transparent;
     outline: none;
     border: 0;
-    margin: 0;
+    margin: var(--gap-0);
     box-shadow: none;
     border-radius: 0;
     user-select: none;

package/modern/index.d.ts

@@ -1445,14 +1445,15 @@ export const borderRadius3xl: "24px";
 export const borderRadiusCircle: "50%";
 export const borderRadiusPill: "99px";
 export const borderRadius0: "0";
-export const borderRadius4: "4px";
+export const borderRadius2: "var(--border-radius-xs)";
+export const borderRadius4: "var(--border-radius-s)";
 export const borderRadius6: "6px";
-export const borderRadius8: "8px";
+export const borderRadius8: "var(--border-radius-m)";
 export const borderRadius10: "10px";
-export const borderRadius12: "12px";
-export const borderRadius16: "16px";
-export const borderRadius20: "20px";
-export const borderRadius24: "24px";
+export const borderRadius12: "var(--border-radius-l)";
+export const borderRadius16: "var(--border-radius-xl)";
+export const borderRadius20: "var(--border-radius-xxl)";
+export const borderRadius24: "var(--border-radius-3xl)";
 export const borderRadius32: "32px";
 export const borderRadius36: "36px";
 export const borderRadius64: "64px";

package/modern/index.js

@@ -1445,14 +1445,15 @@ export const borderRadius3xl = "24px";
 export const borderRadiusCircle = "50%";
 export const borderRadiusPill = "99px";
 export const borderRadius0 = "0";
-export const borderRadius4 = "4px";
+export const borderRadius2 = "var(--border-radius-xs)";
+export const borderRadius4 = "var(--border-radius-s)";
 export const borderRadius6 = "6px";
-export const borderRadius8 = "8px";
+export const borderRadius8 = "var(--border-radius-m)";
 export const borderRadius10 = "10px";
-export const borderRadius12 = "12px";
-export const borderRadius16 = "16px";
-export const borderRadius20 = "20px";
-export const borderRadius24 = "24px";
+export const borderRadius12 = "var(--border-radius-l)";
+export const borderRadius16 = "var(--border-radius-xl)";
+export const borderRadius20 = "var(--border-radius-xxl)";
+export const borderRadius24 = "var(--border-radius-3xl)";
 export const borderRadius32 = "32px";
 export const borderRadius36 = "36px";
 export const borderRadius64 = "64px";

package/moderncssm/border-radius.css

@@ -11,14 +11,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/moderncssm/bundle/click.css

@@ -1380,14 +1380,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/moderncssm/bundle/corp.css

@@ -1380,14 +1380,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/moderncssm/bundle/intranet.css

@@ -1380,14 +1380,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/moderncssm/bundle/mobile.css

@@ -1380,14 +1380,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/moderncssm/bundle/site.css

@@ -1380,14 +1380,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/moderncssm/index.css

@@ -1474,14 +1474,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/moderncssm/index.d.ts

@@ -1445,14 +1445,15 @@ export const borderRadius3xl: "24px";
 export const borderRadiusCircle: "50%";
 export const borderRadiusPill: "99px";
 export const borderRadius0: "0";
-export const borderRadius4: "4px";
+export const borderRadius2: "var(--border-radius-xs)";
+export const borderRadius4: "var(--border-radius-s)";
 export const borderRadius6: "6px";
-export const borderRadius8: "8px";
+export const borderRadius8: "var(--border-radius-m)";
 export const borderRadius10: "10px";
-export const borderRadius12: "12px";
-export const borderRadius16: "16px";
-export const borderRadius20: "20px";
-export const borderRadius24: "24px";
+export const borderRadius12: "var(--border-radius-l)";
+export const borderRadius16: "var(--border-radius-xl)";
+export const borderRadius20: "var(--border-radius-xxl)";
+export const borderRadius24: "var(--border-radius-3xl)";
 export const borderRadius32: "32px";
 export const borderRadius36: "36px";
 export const borderRadius64: "64px";

package/moderncssm/index.js

@@ -1445,14 +1445,15 @@ module.exports.borderRadius3xl = "24px";
 module.exports.borderRadiusCircle = "50%";
 module.exports.borderRadiusPill = "99px";
 module.exports.borderRadius0 = "0";
-module.exports.borderRadius4 = "4px";
+module.exports.borderRadius2 = "var(--border-radius-xs)";
+module.exports.borderRadius4 = "var(--border-radius-s)";
 module.exports.borderRadius6 = "6px";
-module.exports.borderRadius8 = "8px";
+module.exports.borderRadius8 = "var(--border-radius-m)";
 module.exports.borderRadius10 = "10px";
-module.exports.borderRadius12 = "12px";
-module.exports.borderRadius16 = "16px";
-module.exports.borderRadius20 = "20px";
-module.exports.borderRadius24 = "24px";
+module.exports.borderRadius12 = "var(--border-radius-l)";
+module.exports.borderRadius16 = "var(--border-radius-xl)";
+module.exports.borderRadius20 = "var(--border-radius-xxl)";
+module.exports.borderRadius24 = "var(--border-radius-3xl)";
 module.exports.borderRadius32 = "32px";
 module.exports.borderRadius36 = "36px";
 module.exports.borderRadius64 = "64px";

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alfalab/core-components-vars",
-    "version": "9.12.0",
+    "version": "9.13.0",
     "description": "",
     "keywords": [],
     "license": "MIT",

package/src/border-radius.css

@@ -11,14 +11,15 @@
 
     /* новые значения, используйте их */
     --border-radius-0: 0;
-    --border-radius-4: 4px;
+    --border-radius-2: var(--border-radius-xs);
+    --border-radius-4: var(--border-radius-s);
     --border-radius-6: 6px;
-    --border-radius-8: 8px;
+    --border-radius-8: var(--border-radius-m);
     --border-radius-10: 10px;
-    --border-radius-12: 12px;
-    --border-radius-16: 16px;
-    --border-radius-20: 20px;
-    --border-radius-24: 24px;
+    --border-radius-12: var(--border-radius-l);
+    --border-radius-16: var(--border-radius-xl);
+    --border-radius-20: var(--border-radius-xxl);
+    --border-radius-24: var(--border-radius-3xl);
     --border-radius-32: 32px;
     --border-radius-36: 36px;
     --border-radius-64: 64px;

package/src/mixins.css

@@ -29,7 +29,7 @@
     }
 
     &::-webkit-scrollbar-thumb:vertical {
-        border-radius: var(--border-radius-circle) / 6px;
+        border-radius: var(--border-radius-circle) / var(--border-radius-6);
         min-height: 40px;
     }
 
@@ -39,7 +39,7 @@
     }
 
     &::-webkit-scrollbar-thumb:horizontal {
-        border-radius: 6px / var(--border-radius-circle);
+        border-radius: var(--border-radius-6) / var(--border-radius-circle);
         min-width: 40px;
     }
 
@@ -90,7 +90,7 @@
     -webkit-tap-highlight-color: transparent;
     outline: none;
     border: 0;
-    margin: 0;
+    margin: var(--gap-0);
     box-shadow: none;
     border-radius: 0;
     user-select: none;