beathers 5.7.3 → 5.7.5

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.

Potentially problematic release.


This version of beathers might be problematic. Click here for more details.

@@ -1,62 +1,62 @@
1
- @use '../settings/index' as settings;
2
- @use '../variables' as vars;
3
- @use '../settings/defaults' as defs;
4
-
5
- // Definitions
6
- $useLoader: if(vars.$useLoader != null, vars.$useLoader, settings.$useLoader);
7
- $useColorsLightMode: if(vars.$useColorsLightMode != null, vars.$useColorsLightMode, settings.$useColorsLightMode);
8
- $useColorsDarkMode: if(vars.$useColorsDarkMode != null, vars.$useColorsDarkMode, settings.$useColorsDarkMode);
9
- $loaderColorMain: if(vars.$loaderColorMain != null, vars.$loaderColorMain, defs.$loaderColorMain);
10
- $loaderColorSecond: if(vars.$loaderColorSecond != null, vars.$loaderColorSecond, defs.$loaderColorSecond);
11
- $loaderDuration: if(vars.$loaderDuration != null, vars.$loaderDuration, defs.$loaderDuration);
12
-
13
- @if $useLoader {
14
- $colorMainLight: colors.hexToRgba(map.get($colorMain, 'light'), 0.4, 'Glass.light');
15
- $colorMainDark: colors.hexToRgba(map.get($colorMain, 'dark'), 0.4, 'Glass.dark');
16
- $colorSecondLight: colors.hexToRgba(map.get($colorSecond, 'light'), 0.4, 'Glass.light');
17
- $colorSecondDark: colors.hexToRgba(map.get($colorSecond, 'dark'), 0.4, 'Glass.dark');
18
-
19
- .skeleton {
20
- $skeletonsVariants: (
21
- 'rounded': 8px,
22
- 'sharp': unset,
23
- 'circle': 100vw,
24
- 'square': 5px,
25
- 'text': 3px,
26
- ) !default;
27
-
28
- display: inline-block;
29
- background: linear-gradient(
30
- 110deg,
31
- var(--skeleton-main-color, $colorMainLight) 0%,
32
- var(--skeleton-second-color, $colorSecondLight) 30%,
33
- var(--skeleton-second-color, $colorSecondLight) 30%,
34
- var(--skeleton-main-color, $colorMainLight) 100%
35
- );
36
- background-size: 200% 100%;
37
- animation: var(--skeleton-duration, $loaderDuration) shine linear infinite;
38
-
39
- @each $variant, $radius in $skeletonsVariants {
40
- &.#{$variant} {
41
- border-radius: $radius;
42
- aspect-ratio: if($variant == 'circle' or $variant == 'square', 1, unset);
43
- }
44
- }
45
-
46
- .dark & {
47
- background: linear-gradient(
48
- 110deg,
49
- var(--skeleton-main-color, $colorMainDark) 0%,
50
- var(--skeleton-second-color, $colorSecondDark) 30%,
51
- var(--skeleton-second-color, $colorSecondDark) 30%,
52
- var(--skeleton-main-color, $colorMainDark) 100%
53
- );
54
- }
55
-
56
- @keyframes shine {
57
- to {
58
- background-position-x: -200%;
59
- }
60
- }
61
- }
62
- }
1
+ @use '../settings/index' as settings;
2
+ @use '../variables' as vars;
3
+ @use '../settings/defaults' as defs;
4
+
5
+ // Definitions
6
+ $useLoader: if(vars.$useLoader != null, vars.$useLoader, settings.$useLoader);
7
+ $useColorsLightMode: if(vars.$useColorsLightMode != null, vars.$useColorsLightMode, settings.$useColorsLightMode);
8
+ $useColorsDarkMode: if(vars.$useColorsDarkMode != null, vars.$useColorsDarkMode, settings.$useColorsDarkMode);
9
+ $loaderColorMain: if(vars.$loaderColorMain != null, vars.$loaderColorMain, defs.$loaderColorMain);
10
+ $loaderColorSecond: if(vars.$loaderColorSecond != null, vars.$loaderColorSecond, defs.$loaderColorSecond);
11
+ $loaderDuration: if(vars.$loaderDuration != null, vars.$loaderDuration, defs.$loaderDuration);
12
+
13
+ @if $useLoader {
14
+ $colorMainLight: colors.hexToRgba(map.get($colorMain, 'light'), 0.4, 'Glass.light');
15
+ $colorMainDark: colors.hexToRgba(map.get($colorMain, 'dark'), 0.4, 'Glass.dark');
16
+ $colorSecondLight: colors.hexToRgba(map.get($colorSecond, 'light'), 0.4, 'Glass.light');
17
+ $colorSecondDark: colors.hexToRgba(map.get($colorSecond, 'dark'), 0.4, 'Glass.dark');
18
+
19
+ .skeleton {
20
+ $skeletonsVariants: (
21
+ 'rounded': 8px,
22
+ 'sharp': unset,
23
+ 'circle': 100vw,
24
+ 'square': 5px,
25
+ 'text': 3px,
26
+ ) !default;
27
+
28
+ display: inline-block;
29
+ background: linear-gradient(
30
+ 110deg,
31
+ var(--skeleton-main-color, $colorMainLight) 0%,
32
+ var(--skeleton-second-color, $colorSecondLight) 30%,
33
+ var(--skeleton-second-color, $colorSecondLight) 30%,
34
+ var(--skeleton-main-color, $colorMainLight) 100%
35
+ );
36
+ background-size: 200% 100%;
37
+ animation: var(--skeleton-duration, $loaderDuration) shine linear infinite;
38
+
39
+ @each $variant, $radius in $skeletonsVariants {
40
+ &.#{$variant} {
41
+ border-radius: $radius;
42
+ aspect-ratio: if($variant == 'circle' or $variant == 'square', 1, unset);
43
+ }
44
+ }
45
+
46
+ .dark & {
47
+ background: linear-gradient(
48
+ 110deg,
49
+ var(--skeleton-main-color, $colorMainDark) 0%,
50
+ var(--skeleton-second-color, $colorSecondDark) 30%,
51
+ var(--skeleton-second-color, $colorSecondDark) 30%,
52
+ var(--skeleton-main-color, $colorMainDark) 100%
53
+ );
54
+ }
55
+
56
+ @keyframes shine {
57
+ to {
58
+ background-position-x: -200%;
59
+ }
60
+ }
61
+ }
62
+ }
@@ -1,168 +1,168 @@
1
- @use '../settings/configs' as configs;
2
- @use '../settings/defaults' as defs;
3
- @use '../variables' as vars;
4
- @use '../functions/colors' as colors;
5
- @use '../settings/index' as settings;
6
-
7
- // Definitions
8
- $defaultFontFamilies: if(vars.$defaultFontFamilies != null, vars.$defaultFontFamilies, defs.$defaultFontFamilies);
9
- $useColors: if(vars.$useColors != null, vars.$useColors, settings.$useColors);
10
- $useColorsLightMode: if(vars.$useColorsLightMode != null, vars.$useColorsLightMode, settings.$useColorsLightMode);
11
- $useColorsDarkMode: if(vars.$useColorsDarkMode != null, vars.$useColorsDarkMode, settings.$useColorsDarkMode);
12
-
13
- html {
14
- scroll-behavior: smooth;
15
- interpolate-size: allow-keywords;
16
- }
17
-
18
- body {
19
- position: relative;
20
- font-family: 'regular', $defaultFontFamilies;
21
- overflow-x: hidden;
22
- }
23
-
24
- *,
25
- ::before,
26
- ::after {
27
- font-family: 'regular', $defaultFontFamilies;
28
- margin: 0;
29
- padding: 0;
30
- box-sizing: border-box;
31
- }
32
-
33
- input,
34
- textarea,
35
- select,
36
- button,
37
- kbd,
38
- samp,
39
- table,
40
- table *,
41
- h1,
42
- h2,
43
- h3,
44
- h4,
45
- h5,
46
- h6 {
47
- font-family: inherit;
48
- }
49
-
50
- table {
51
- border-collapse: collapse;
52
- border-spacing: 0;
53
- }
54
-
55
- fieldset {
56
- border: 0;
57
- margin: 0;
58
- padding: 0;
59
- }
60
-
61
- legend {
62
- padding: 0;
63
- }
64
-
65
- details {
66
- display: block;
67
- }
68
-
69
- summary {
70
- display: list-item;
71
- }
72
-
73
- img,
74
- video,
75
- svg {
76
- max-width: 100%;
77
- height: auto;
78
- display: block;
79
- }
80
-
81
- ul {
82
- margin: unset;
83
- list-style: none;
84
- padding: 0;
85
-
86
- li {
87
- margin-bottom: unset;
88
- }
89
- }
90
-
91
- hr {
92
- border: 0;
93
- height: 1px;
94
- background: currentColor;
95
- }
96
-
97
- p,
98
- figure,
99
- blockquote,
100
- dl,
101
- dd {
102
- margin: 0;
103
- }
104
-
105
- a {
106
- text-decoration: unset;
107
- }
108
-
109
- @if $useColors {
110
- @if $useColorsLightMode {
111
- .light::selection {
112
- background-color: colors.useColorWithMap('third');
113
- color: colors.useColorWithMap('black');
114
- }
115
- }
116
- @if $useColorsDarkMode {
117
- .dark::selection {
118
- background-color: colors.useColorWithMap('third', 'dark');
119
- color: colors.useColorWithMap('white');
120
- }
121
- }
122
- }
123
-
124
- ::-webkit-scrollbar {
125
- width: 6px;
126
-
127
- &-track {
128
- background-color: transparent;
129
- border-radius: unset;
130
- }
131
- &-thumb {
132
- border-radius: 100vw;
133
- }
134
- }
135
- @if $useColors {
136
- @if $useColorsLightMode {
137
- .light::-webkit-scrollbar-thumb {
138
- background: colors.useColorWithMap('third');
139
- }
140
- }
141
- @if $useColorsDarkMode {
142
- .dark::-webkit-scrollbar-thumb {
143
- background: colors.useColorWithMap('third', 'dark');
144
- }
145
- }
146
- }
147
-
148
- @each $option, $properties in configs.$clearanceOptions {
149
- @each $property, $value in $properties {
150
- .i\:#{$option} {
151
- /* stylelint-disable declaration-no-important */
152
- #{$property}: $value !important;
153
- }
154
- .#{$option} {
155
- #{$property}: $value;
156
- }
157
- }
158
- }
159
-
160
- @each $cursor in configs.$cursors {
161
- .cursor#{\:}#{$cursor} {
162
- cursor: #{$cursor};
163
- }
164
- }
165
-
166
- .scroll-smooth {
167
- scroll-behavior: smooth;
168
- }
1
+ @use '../settings/configs' as configs;
2
+ @use '../settings/defaults' as defs;
3
+ @use '../variables' as vars;
4
+ @use '../functions/colors' as colors;
5
+ @use '../settings/index' as settings;
6
+
7
+ // Definitions
8
+ $defaultFontFamilies: if(vars.$defaultFontFamilies != null, vars.$defaultFontFamilies, defs.$defaultFontFamilies);
9
+ $useColors: if(vars.$useColors != null, vars.$useColors, settings.$useColors);
10
+ $useColorsLightMode: if(vars.$useColorsLightMode != null, vars.$useColorsLightMode, settings.$useColorsLightMode);
11
+ $useColorsDarkMode: if(vars.$useColorsDarkMode != null, vars.$useColorsDarkMode, settings.$useColorsDarkMode);
12
+
13
+ html {
14
+ scroll-behavior: smooth;
15
+ interpolate-size: allow-keywords;
16
+ }
17
+
18
+ body {
19
+ position: relative;
20
+ font-family: 'regular', $defaultFontFamilies;
21
+ overflow-x: hidden;
22
+ }
23
+
24
+ *,
25
+ ::before,
26
+ ::after {
27
+ font-family: 'regular', $defaultFontFamilies;
28
+ margin: 0;
29
+ padding: 0;
30
+ box-sizing: border-box;
31
+ }
32
+
33
+ input,
34
+ textarea,
35
+ select,
36
+ button,
37
+ kbd,
38
+ samp,
39
+ table,
40
+ table *,
41
+ h1,
42
+ h2,
43
+ h3,
44
+ h4,
45
+ h5,
46
+ h6 {
47
+ font-family: inherit;
48
+ }
49
+
50
+ table {
51
+ border-collapse: collapse;
52
+ border-spacing: 0;
53
+ }
54
+
55
+ fieldset {
56
+ border: 0;
57
+ margin: 0;
58
+ padding: 0;
59
+ }
60
+
61
+ legend {
62
+ padding: 0;
63
+ }
64
+
65
+ details {
66
+ display: block;
67
+ }
68
+
69
+ summary {
70
+ display: list-item;
71
+ }
72
+
73
+ img,
74
+ video,
75
+ svg {
76
+ max-width: 100%;
77
+ height: auto;
78
+ display: block;
79
+ }
80
+
81
+ ul {
82
+ margin: unset;
83
+ list-style: none;
84
+ padding: 0;
85
+
86
+ li {
87
+ margin-bottom: unset;
88
+ }
89
+ }
90
+
91
+ hr {
92
+ border: 0;
93
+ height: 1px;
94
+ background: currentColor;
95
+ }
96
+
97
+ p,
98
+ figure,
99
+ blockquote,
100
+ dl,
101
+ dd {
102
+ margin: 0;
103
+ }
104
+
105
+ a {
106
+ text-decoration: unset;
107
+ }
108
+
109
+ @if $useColors {
110
+ @if $useColorsLightMode {
111
+ .light::selection {
112
+ background-color: colors.useColorWithMap('third');
113
+ color: colors.useColorWithMap('black');
114
+ }
115
+ }
116
+ @if $useColorsDarkMode {
117
+ .dark::selection {
118
+ background-color: colors.useColorWithMap('third', 'dark');
119
+ color: colors.useColorWithMap('white');
120
+ }
121
+ }
122
+ }
123
+
124
+ ::-webkit-scrollbar {
125
+ width: 6px;
126
+
127
+ &-track {
128
+ background-color: transparent;
129
+ border-radius: unset;
130
+ }
131
+ &-thumb {
132
+ border-radius: 100vw;
133
+ }
134
+ }
135
+ @if $useColors {
136
+ @if $useColorsLightMode {
137
+ .light::-webkit-scrollbar-thumb {
138
+ background: colors.useColorWithMap('third');
139
+ }
140
+ }
141
+ @if $useColorsDarkMode {
142
+ .dark::-webkit-scrollbar-thumb {
143
+ background: colors.useColorWithMap('third', 'dark');
144
+ }
145
+ }
146
+ }
147
+
148
+ @each $option, $properties in configs.$clearanceOptions {
149
+ @each $property, $value in $properties {
150
+ .i\:#{$option} {
151
+ /* stylelint-disable declaration-no-important */
152
+ #{$property}: $value !important;
153
+ }
154
+ .#{$option} {
155
+ #{$property}: $value;
156
+ }
157
+ }
158
+ }
159
+
160
+ @each $cursor in configs.$cursors {
161
+ .cursor#{\:}#{$cursor} {
162
+ cursor: #{$cursor};
163
+ }
164
+ }
165
+
166
+ .scroll-smooth {
167
+ scroll-behavior: smooth;
168
+ }