@cuby-ui/core 0.0.350 → 0.0.352

package/styles/mixins/lists.scss

@@ -1,42 +1,42 @@
-@use '../variables/colors' as colors;
-
-@mixin cui-clear-list() {
-  padding: 0;
-  margin: 0;
-  list-style: none;
-}
-
-// The list should have no padding or border
-// The $offset should correspond to the border-radius of the elements
-@mixin cui-line-between-items($offset) {
-    position: relative;
-
-    & > * {
-        z-index: 1;
-    }
-
-    &:has(> :nth-child(2))::before {
-        content: '';
-        position: absolute;
-        top: 0;
-        bottom: 0;
-        left: $offset;
-        width: 1px;
-        background: colors.$cui-base-200;
-    }
-}
-
-@mixin cui-line-after-item($offset, $list-gap) {
-    position: relative;
-
-    &:not(:last-child)::before {
-        content: '';
-        position: absolute;
-        top: 0;
-        left: $offset;
-        bottom: -$list-gap;
-        z-index: -1;
-        width: 1px;
-        background: colors.$cui-base-200;
-    }
-}
+@use '../variables/colors' as colors;
+
+@mixin cui-clear-list() {
+  padding: 0;
+  margin: 0;
+  list-style: none;
+}
+
+// The list should have no padding or border
+// The $offset should correspond to the border-radius of the elements
+@mixin cui-line-between-items($offset) {
+    position: relative;
+
+    & > * {
+        z-index: 1;
+    }
+
+    &:has(> :nth-child(2))::before {
+        content: '';
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        left: $offset;
+        width: 1px;
+        background: colors.$cui-base-200;
+    }
+}
+
+@mixin cui-line-after-item($offset, $list-gap) {
+    position: relative;
+
+    &:not(:last-child)::before {
+        content: '';
+        position: absolute;
+        top: 0;
+        left: $offset;
+        bottom: -$list-gap;
+        z-index: -1;
+        width: 1px;
+        background: colors.$cui-base-200;
+    }
+}

package/styles/mixins/paddings.scss

@@ -1,35 +1,35 @@
-$space: 8px;
-
-@mixin cui-padding($direction, $size, $offset: 0) {
-  $padding: $space * $size - $offset;
-
-  @if ($direction == all) {
-    padding: $padding;
-  }
-
-  @if ($direction == top) {
-    padding-top: $padding;
-  }
-
-  @if ($direction == bottom) {
-    padding-bottom: $padding;
-  }
-
-  @if ($direction == vertical) {
-    padding-top: $padding;
-    padding-bottom: $padding;
-  }
-
-  @if ($direction == left) {
-    padding-left: $padding;
-  }
-
-  @if ($direction == right) {
-    padding-right: $padding;
-  }
-
-  @if ($direction == horizontal) {
-    padding-right: $padding;
-    padding-left: $padding;
-  }
-}
+$space: 8px;
+
+@mixin cui-padding($direction, $size, $offset: 0) {
+  $padding: $space * $size - $offset;
+
+  @if ($direction == all) {
+    padding: $padding;
+  }
+
+  @if ($direction == top) {
+    padding-top: $padding;
+  }
+
+  @if ($direction == bottom) {
+    padding-bottom: $padding;
+  }
+
+  @if ($direction == vertical) {
+    padding-top: $padding;
+    padding-bottom: $padding;
+  }
+
+  @if ($direction == left) {
+    padding-left: $padding;
+  }
+
+  @if ($direction == right) {
+    padding-right: $padding;
+  }
+
+  @if ($direction == horizontal) {
+    padding-right: $padding;
+    padding-left: $padding;
+  }
+}

package/styles/mixins/shadows.scss

@@ -1,38 +1,38 @@
-@use '../variables/colors' as colors;
-// TODO: вынести все цвета в перемнные
-
-@mixin cui-shadow-10() {
-  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.04),
-              0 1px 4px 0 rgba(0, 0, 0, 0.04);
-}
-
-@mixin cui-shadow-15() {
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06),
-              0 1px 3px 0 rgba(0, 0, 0, 0.10);
-}
-
-@mixin cui-shadow-20() {
-  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.06),
-              0 4px 6px -1px rgba(0, 0, 0, 0.10);
-}
-
-@mixin cui-shadow-25() {
-  box-shadow: 0 4px 6px -2px rgba(0, 0, 0, 0.05),
-              0 10px 15px -3px rgba(0, 0, 0, 0.10);
-}
-
-@mixin cui-shadow-right() {
-  box-shadow: 5px 0 4px 0 rgba(0, 0, 0, 0.05);
-}
-
-@mixin cui-shadow-left() {
-  box-shadow: -5px 0 4px 0 rgba(0, 0, 0, 0.05);
-}
-
-@mixin cui-shadow-focused() {
-  box-shadow: 0 0 0 2px colors.$cui-focus;
-}
-
-@mixin cui-shadow-error-focused() {
-  box-shadow: 0 0 0 2px rgba(217, 45, 32, 0.25);
-}
+@use '../variables/colors' as colors;
+// TODO: вынести все цвета в перемнные
+
+@mixin cui-shadow-10() {
+  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.04),
+              0 1px 4px 0 rgba(0, 0, 0, 0.04);
+}
+
+@mixin cui-shadow-15() {
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06),
+              0 1px 3px 0 rgba(0, 0, 0, 0.10);
+}
+
+@mixin cui-shadow-20() {
+  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.06),
+              0 4px 6px -1px rgba(0, 0, 0, 0.10);
+}
+
+@mixin cui-shadow-25() {
+  box-shadow: 0 4px 6px -2px rgba(0, 0, 0, 0.05),
+              0 10px 15px -3px rgba(0, 0, 0, 0.10);
+}
+
+@mixin cui-shadow-right() {
+  box-shadow: 5px 0 4px 0 rgba(0, 0, 0, 0.05);
+}
+
+@mixin cui-shadow-left() {
+  box-shadow: -5px 0 4px 0 rgba(0, 0, 0, 0.05);
+}
+
+@mixin cui-shadow-focused() {
+  box-shadow: 0 0 0 2px colors.$cui-focus;
+}
+
+@mixin cui-shadow-error-focused() {
+  box-shadow: 0 0 0 2px rgba(217, 45, 32, 0.25);
+}

package/styles/mixins/texts.scss

@@ -1,225 +1,225 @@
-@mixin cui-text-regular() {
-  font-weight: 400;
-}
-
-@mixin cui-text-medium() {
-  font-weight: 500;
-}
-
-@mixin cui-text-semi-bold() {
-  font-weight: 600;
-}
-
-@mixin cui-text-bold() {
-  font-weight: 700;
-}
-
-@mixin cui-text-xxxs() {
-  font-size: 10px;
-  line-height: 12px;
-}
-
-@mixin cui-text-xxxs-regular() {
-  font-weight: 400;
-  font-size: 10px;
-  line-height: 12px;
-}
-
-@mixin cui-text-xxxs-medium() {
-  font-weight: 500;
-  font-size: 10px;
-  line-height: 12px;
-}
-
-@mixin cui-text-xxxs-semi-bold() {
-  font-weight: 600;
-  font-size: 10px;
-  line-height: 12px;
-}
-
-@mixin cui-text-xxxs-bold() {
-  font-weight: 700;
-  font-size: 10px;
-  line-height: 12px;
-}
-
-
-@mixin cui-text-xxs() {
-  font-size: 12px;
-  line-height: 14px;
-}
-
-@mixin cui-text-xxs-regular() {
-  font-weight: 400;
-  font-size: 12px;
-  line-height: 14px;
-}
-
-@mixin cui-text-xxs-medium() {
-  font-weight: 500;
-  font-size: 12px;
-  line-height: 14px;
-}
-
-@mixin cui-text-xxs-semi-bold() {
-  font-weight: 600;
-  font-size: 12px;
-  line-height: 14px;
-}
-
-@mixin cui-text-xxs-bold() {
-  font-weight: 700;
-  font-size: 12px;
-  line-height: 14px;
-}
-
-@mixin cui-text-xs() {
-  font-size: 13px;
-  line-height: 16px;
-}
-
-@mixin cui-text-xs-regular() {
-  font-weight: 400;
-  font-size: 13px;
-  line-height: 16px;
-}
-
-@mixin cui-text-xs-medium() {
-  font-weight: 500;
-  font-size: 13px;
-  line-height: 16px;
-}
-
-@mixin cui-text-xs-semi-bold() {
-  font-weight: 600;
-  font-size: 13px;
-  line-height: 16px;
-}
-
-@mixin cui-text-xs-bold() {
-  font-weight: 700;
-  font-size: 13px;
-  line-height: 16px;
-}
-
-@mixin cui-text-sm() {
-  font-size: 14px;
-  line-height: 20px;
-}
-
-@mixin cui-text-sm-regular() {
-  font-weight: 400;
-  font-size: 14px;
-  line-height: 20px;
-}
-
-@mixin cui-text-sm-medium() {
-  font-weight: 500;
-  font-size: 14px;
-  line-height: 20px;
-}
-
-@mixin cui-text-sm-semi-bold() {
-  font-weight: 600;
-  font-size: 14px;
-  line-height: 20px;
-}
-
-@mixin cui-text-sm-bold() {
-  font-weight: 700;
-  font-size: 14px;
-  line-height: 20px;
-}
-
-@mixin cui-text-md() {
-  font-size: 16px;
-  line-height: 24px;
-}
-
-@mixin cui-text-md-regular() {
-  font-weight: 400;
-  font-size: 16px;
-  line-height: 24px;
-}
-
-@mixin cui-text-md-medium() {
-  font-weight: 500;
-  font-size: 16px;
-  line-height: 24px;
-}
-
-@mixin cui-text-md-semi-bold() {
-  font-weight: 600;
-  font-size: 16px;
-  line-height: 24px;
-}
-
-@mixin cui-text-md-bold() {
-  font-weight: 700;
-  font-size: 16px;
-  line-height: 24px;
-}
-
-@mixin cui-text-lg() {
-  font-size: 18px;
-  line-height: 28px;
-}
-
-@mixin cui-text-lg-regular() {
-  font-weight: 400;
-  font-size: 18px;
-  line-height: 28px;
-}
-
-@mixin cui-text-lg-medium() {
-  font-weight: 500;
-  font-size: 18px;
-  line-height: 28px;
-}
-
-@mixin cui-text-lg-semi-bold() {
-  font-weight: 600;
-  font-size: 18px;
-  line-height: 28px;
-}
-
-@mixin cui-text-lg-bold() {
-  font-weight: 700;
-  font-size: 18px;
-  line-height: 28px;
-}
-
-@mixin cui-text-xl() {
-  font-size: 20px;
-  line-height: 30px;
-}
-
-@mixin cui-text-xl-regular() {
-  font-weight: 400;
-  font-size: 20px;
-  line-height: 30px;
-}
-
-@mixin cui-text-xl-medium() {
-  font-weight: 500;
-  font-size: 20px;
-  line-height: 30px;
-}
-
-@mixin cui-text-xl-semi-bold() {
-  font-weight: 600;
-  font-size: 20px;
-  line-height: 30px;
-}
-
-@mixin cui-text-xl-bold() {
-  font-weight: 700;
-  font-size: 20px;
-  line-height: 30px;
-}
-
-@mixin cui-text-overflow($wrap: nowrap) {
-    white-space: $wrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
+@mixin cui-text-regular() {
+  font-weight: 400;
+}
+
+@mixin cui-text-medium() {
+  font-weight: 500;
+}
+
+@mixin cui-text-semi-bold() {
+  font-weight: 600;
+}
+
+@mixin cui-text-bold() {
+  font-weight: 700;
+}
+
+@mixin cui-text-xxxs() {
+  font-size: 10px;
+  line-height: 12px;
+}
+
+@mixin cui-text-xxxs-regular() {
+  font-weight: 400;
+  font-size: 10px;
+  line-height: 12px;
+}
+
+@mixin cui-text-xxxs-medium() {
+  font-weight: 500;
+  font-size: 10px;
+  line-height: 12px;
+}
+
+@mixin cui-text-xxxs-semi-bold() {
+  font-weight: 600;
+  font-size: 10px;
+  line-height: 12px;
+}
+
+@mixin cui-text-xxxs-bold() {
+  font-weight: 700;
+  font-size: 10px;
+  line-height: 12px;
+}
+
+
+@mixin cui-text-xxs() {
+  font-size: 12px;
+  line-height: 14px;
+}
+
+@mixin cui-text-xxs-regular() {
+  font-weight: 400;
+  font-size: 12px;
+  line-height: 14px;
+}
+
+@mixin cui-text-xxs-medium() {
+  font-weight: 500;
+  font-size: 12px;
+  line-height: 14px;
+}
+
+@mixin cui-text-xxs-semi-bold() {
+  font-weight: 600;
+  font-size: 12px;
+  line-height: 14px;
+}
+
+@mixin cui-text-xxs-bold() {
+  font-weight: 700;
+  font-size: 12px;
+  line-height: 14px;
+}
+
+@mixin cui-text-xs() {
+  font-size: 13px;
+  line-height: 16px;
+}
+
+@mixin cui-text-xs-regular() {
+  font-weight: 400;
+  font-size: 13px;
+  line-height: 16px;
+}
+
+@mixin cui-text-xs-medium() {
+  font-weight: 500;
+  font-size: 13px;
+  line-height: 16px;
+}
+
+@mixin cui-text-xs-semi-bold() {
+  font-weight: 600;
+  font-size: 13px;
+  line-height: 16px;
+}
+
+@mixin cui-text-xs-bold() {
+  font-weight: 700;
+  font-size: 13px;
+  line-height: 16px;
+}
+
+@mixin cui-text-sm() {
+  font-size: 14px;
+  line-height: 20px;
+}
+
+@mixin cui-text-sm-regular() {
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 20px;
+}
+
+@mixin cui-text-sm-medium() {
+  font-weight: 500;
+  font-size: 14px;
+  line-height: 20px;
+}
+
+@mixin cui-text-sm-semi-bold() {
+  font-weight: 600;
+  font-size: 14px;
+  line-height: 20px;
+}
+
+@mixin cui-text-sm-bold() {
+  font-weight: 700;
+  font-size: 14px;
+  line-height: 20px;
+}
+
+@mixin cui-text-md() {
+  font-size: 16px;
+  line-height: 24px;
+}
+
+@mixin cui-text-md-regular() {
+  font-weight: 400;
+  font-size: 16px;
+  line-height: 24px;
+}
+
+@mixin cui-text-md-medium() {
+  font-weight: 500;
+  font-size: 16px;
+  line-height: 24px;
+}
+
+@mixin cui-text-md-semi-bold() {
+  font-weight: 600;
+  font-size: 16px;
+  line-height: 24px;
+}
+
+@mixin cui-text-md-bold() {
+  font-weight: 700;
+  font-size: 16px;
+  line-height: 24px;
+}
+
+@mixin cui-text-lg() {
+  font-size: 18px;
+  line-height: 28px;
+}
+
+@mixin cui-text-lg-regular() {
+  font-weight: 400;
+  font-size: 18px;
+  line-height: 28px;
+}
+
+@mixin cui-text-lg-medium() {
+  font-weight: 500;
+  font-size: 18px;
+  line-height: 28px;
+}
+
+@mixin cui-text-lg-semi-bold() {
+  font-weight: 600;
+  font-size: 18px;
+  line-height: 28px;
+}
+
+@mixin cui-text-lg-bold() {
+  font-weight: 700;
+  font-size: 18px;
+  line-height: 28px;
+}
+
+@mixin cui-text-xl() {
+  font-size: 20px;
+  line-height: 30px;
+}
+
+@mixin cui-text-xl-regular() {
+  font-weight: 400;
+  font-size: 20px;
+  line-height: 30px;
+}
+
+@mixin cui-text-xl-medium() {
+  font-weight: 500;
+  font-size: 20px;
+  line-height: 30px;
+}
+
+@mixin cui-text-xl-semi-bold() {
+  font-weight: 600;
+  font-size: 20px;
+  line-height: 30px;
+}
+
+@mixin cui-text-xl-bold() {
+  font-weight: 700;
+  font-size: 20px;
+  line-height: 30px;
+}
+
+@mixin cui-text-overflow($wrap: nowrap) {
+    white-space: $wrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}