@sorocraft/ui 1.0.57 → 1.0.59

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -101,6 +101,7 @@ $color-input-solid: $color-gray-700;
101
101
  $btn-disabled-color: $color-white;
102
102
  $btn-disabled-bg: $color-primary;
103
103
  $btn-disabled-border-color: $color-primary;
104
+ $btn-color: $color-body-text;
104
105
 
105
106
  $color-tooltip: $color-gray-800;
106
107
  $color-tooltip-bg: $color-white;
@@ -1,12 +1,13 @@
1
1
  @use "sass:list";
2
2
  @use "sass:math";
3
- @import "../variables";
3
+
4
+ @use "../variables" as variables;
4
5
 
5
6
  @function toRem($value...) {
6
7
  $result: ();
7
8
 
8
9
  @each $val in $value {
9
- $result: list.append($result, math.div($val, $base-font-size) * 1rem);
10
+ $result: list.append($result, math.div($val, variables.$base-font-size) * 1rem);
10
11
  }
11
12
  @return $result;
12
13
  }
@@ -1,3 +1,8 @@
1
+ @use "./colors.scss" as *;
2
+ @use "./variables.scss" as *;
3
+ @use "./functions/toRem.scss" as functions;
4
+ @use "sass:list";
5
+
1
6
  @mixin flexCentered {
2
7
  display: flex;
3
8
  justify-content: center;
@@ -149,34 +154,34 @@ $xxl: 1440px;
149
154
  }
150
155
 
151
156
  @mixin apply-ui-type-styles($styles) {
152
- background-color: nth($styles, 1);
153
- color: nth($styles, 2);
157
+ background-color: list.nth($styles, 1);
158
+ color: list.nth($styles, 2);
154
159
  transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
155
160
 
156
161
  i {
157
- color: nth($styles, 2);
162
+ color: list.nth($styles, 2);
158
163
  }
159
164
 
160
165
  svg {
161
- stroke: nth($styles, 2);
166
+ stroke: list.nth($styles, 2);
162
167
  transition: stroke 0.2s ease-in-out;
163
168
 
164
169
  path {
165
- stroke: nth($styles, 2);
170
+ stroke: list.nth($styles, 2);
166
171
  transition: stroke 0.2s ease-in-out;
167
172
  }
168
173
  }
169
174
 
170
175
  &:hover,
171
176
  &.active {
172
- background-color: nth($styles, 3);
173
- color: nth($styles, 4);
177
+ background-color: list.nth($styles, 3);
178
+ color: list.nth($styles, 4);
174
179
 
175
180
  svg {
176
- stroke: nth($styles, 4);
181
+ stroke: list.nth($styles, 4);
177
182
 
178
183
  path {
179
- stroke: nth($styles, 4);
184
+ stroke: list.nth($styles, 4);
180
185
  }
181
186
  }
182
187
  }
@@ -188,3 +193,8 @@ $xxl: 1440px;
188
193
  background-size: 100% 2px;
189
194
  background-repeat: repeat-x;
190
195
  }
196
+
197
+ @mixin avatar-size($size) {
198
+ width: functions.toRem(map-get($avatar-sizes, $size));
199
+ height: functions.toRem(map-get($avatar-sizes, $size));
200
+ }
@@ -1 +1,5 @@
1
- @import "./colors.scss", "./functions/toRem.scss", "./variables.scss", "./mixins", "./animations";
1
+ @forward "./colors.scss";
2
+ @forward "./functions/toRem.scss";
3
+ @forward "./variables.scss";
4
+ @forward "./mixins";
5
+ @forward "./animations";
@@ -1,3 +1,5 @@
1
+ @use "./colors.scss" as *;
2
+
1
3
  $base-font-size: 16px;
2
4
 
3
5
  /* Border radius */
@@ -24,11 +26,10 @@ $btn-font-weight: 500;
24
26
  $btn-line-height: 1;
25
27
  $btn-disabled-opacity: 0.65;
26
28
  $btn-font-size: 0.925rem;
27
- $btn-color: $color-body-text;
28
29
 
29
30
  /* WIDTH */
30
31
  $sidebar-full-width: 320px;
31
- $sidebar-collapsed-width: 70px;
32
+ $sidebar-collapsed-width: 80px;
32
33
  $sidebar-submenu-width: 300px;
33
34
  $right-drawer-width: 420px;
34
35
 
@@ -85,6 +86,15 @@ $size-md: 768px;
85
86
  $size-lg: 992px;
86
87
  $size-xl: 1200px;
87
88
  $size-xxl: 1440px;
89
+ $avatar-sizes: (
90
+ xxs: 24px,
91
+ xs: 32px,
92
+ sm: 48px,
93
+ md: 64px,
94
+ lg: 96px,
95
+ xl: 128px,
96
+ xxl: 512px,
97
+ );
88
98
 
89
99
  /* SHADOW */
90
100
  $task-card-shadow: 0px 0px 10px 0px rgba(56, 71, 109, 0.075);