minolith 1.3.2 → 1.3.4

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.
Files changed (17) hide show
  1. package/dist/css/minolith-skelton.css +110 -101
  2. package/dist/css/minolith-skelton.css.map +1 -1
  3. package/dist/css/minolith-skelton.min.css +110 -101
  4. package/dist/css/minolith-skelton.min.css.map +1 -1
  5. package/dist/css/minolith.css +882 -873
  6. package/dist/css/minolith.css.map +1 -1
  7. package/dist/css/minolith.min.css +4 -4
  8. package/dist/css/minolith.min.css.map +1 -1
  9. package/package.json +1 -1
  10. package/src/css-variables/index.scss +1 -0
  11. package/src/css-variables/layout.scss +11 -0
  12. package/src/css-variables/miscellaneous.scss +3 -3
  13. package/src/layouts/columns.scss +2 -2
  14. package/src/layouts/container.scss +5 -5
  15. package/src/mixins/responsive.scss +8 -8
  16. package/src/variables/layout.scss +13 -11
  17. package/src/variables/miscellaneous.scss +0 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "minolith",
3
- "version": "1.3.2",
3
+ "version": "1.3.4",
4
4
  "description": "design system by minominolyly",
5
5
  "main": "src/minolith.scss",
6
6
  "scripts": {
package/src/css-variables/index.scss CHANGED
@@ -3,5 +3,6 @@
3
3
  @forward "./border.scss";
4
4
  @forward "./color.scss";
5
5
  @forward "./components/index.scss";
6
+ @forward "./layout.scss";
6
7
  @forward "./miscellaneous.scss";
7
8
  @forward "./typography.scss";
package/src/css-variables/layout.scss ADDED
@@ -0,0 +1,11 @@
1
+ @use "../variables/index.scss" as variables;
2
+
3
+ :where(:root) {
4
+ --#{variables.$prefix}responsive-breakpoint-xsmall: #{variables.$responsive-breakpoint-xsmall};
5
+ --#{variables.$prefix}responsive-breakpoint-small: #{variables.$responsive-breakpoint-small};
6
+ --#{variables.$prefix}responsive-breakpoint-medium: #{variables.$responsive-breakpoint-medium};
7
+ --#{variables.$prefix}responsive-breakpoint-large: #{variables.$responsive-breakpoint-large};
8
+ --#{variables.$prefix}responsive-breakpoint-xlarge: #{variables.$responsive-breakpoint-xlarge};
9
+
10
+ --#{variables.$prefix}responsive-breakpoint-max-width-offset: #{variables.$responsive-breakpoint-max-width-offset};
11
+ }
package/src/css-variables/miscellaneous.scss CHANGED
@@ -1,8 +1,8 @@
1
1
  @use "../variables/index.scss" as variables;
2
2
 
3
3
  :where(:root) {
4
- --#{variables.$prefix}z-index-tabula: #{variables.$z-index-tabula};
4
+ --#{variables.$prefix}z-index-tabula: #{variables.$z-index-tabula};
5
5
 
6
- --#{variables.$prefix}z-index-modal: #{variables.$z-index-modal};
7
- --#{variables.$prefix}z-index-modal-content: #{variables.$z-index-modal-content};
6
+ --#{variables.$prefix}z-index-modal: #{variables.$z-index-modal};
7
+ --#{variables.$prefix}z-index-modal-content: #{variables.$z-index-modal-content};
8
8
  }
package/src/layouts/columns.scss CHANGED
@@ -32,10 +32,10 @@
32
32
  --#{variables.$prefix}columns-gutter-x: #{($p * 0.25rem)};
33
33
  --#{variables.$prefix}columns-gutter-y: #{($p * 0.25rem)};
34
34
  }
35
- @include mixins.is-responsive("has-columns-gutter-x", "-#{$escapedQuarter}rem") {
35
+ @include mixins.is-responsive("has-gutter-x", "-#{$escapedQuarter}rem") {
36
36
  --#{variables.$prefix}columns-gutter-x: #{($p * 0.25rem)};
37
37
  }
38
- @include mixins.is-responsive("has-columns-gutter-y", "-#{$escapedQuarter}rem") {
38
+ @include mixins.is-responsive("has-gutter-y", "-#{$escapedQuarter}rem") {
39
39
  --#{variables.$prefix}columns-gutter-y: #{($p * 0.25rem)};
40
40
  }
41
41
  }
package/src/layouts/container.scss CHANGED
@@ -21,10 +21,10 @@
21
21
  --#{variables.$prefix}container-gutter-x: #{($p * 0.25rem)};
22
22
  --#{variables.$prefix}container-gutter-y: #{($p * 0.25rem)};
23
23
  }
24
- &.has-container-gutter-x-#{$escapedQuarter}rem {
24
+ &.has-gutter-x-#{$escapedQuarter}rem {
25
25
  --#{variables.$prefix}container-gutter-x: #{($p * 0.25rem)};
26
26
  }
27
- &.has-container-gutter-y-#{$escapedQuarter}rem {
27
+ &.has-gutter-y-#{$escapedQuarter}rem {
28
28
  --#{variables.$prefix}container-gutter-y: #{($p * 0.25rem)};
29
29
  }
30
30
  @include mixins.is-responsive("has-gutter", "-#{$escapedQuarter}rem") {
@@ -41,19 +41,19 @@
41
41
  }
42
42
 
43
43
  @include mixins.screen("medium") {
44
- max-width: variables.$breakpoint-medium;
44
+ max-width: variables.$responsive-breakpoint-medium;
45
45
  &.is-fluid {
46
46
  max-width: unset;
47
47
  }
48
48
  }
49
49
  @include mixins.screen("large") {
50
- max-width: variables.$breakpoint-large;
50
+ max-width: variables.$responsive-breakpoint-large;
51
51
  &.is-fluid {
52
52
  max-width: unset;
53
53
  }
54
54
  }
55
55
  @include mixins.screen("xlarge") {
56
- max-width: variables.$breakpoint-xlarge;
56
+ max-width: variables.$responsive-breakpoint-xlarge;
57
57
  &.is-fluid {
58
58
  max-width: unset;
59
59
  }
package/src/mixins/responsive.scss CHANGED
@@ -2,13 +2,13 @@
2
2
 
3
3
  @mixin screen($size) {
4
4
  @if ($size == "xsmall") {
5
- $max-width: variables.$breakpoint-small -
5
+ $max-width: variables.$responsive-breakpoint-small -
6
6
  variables.$responsive-breakpoint-max-width-offset;
7
7
  @media screen and (max-width: $max-width) {
8
8
  @content;
9
9
  }
10
10
  } @else if ($size == "xlarge") {
11
- $min-width: variables.$breakpoint-xlarge;
11
+ $min-width: variables.$responsive-breakpoint-xlarge;
12
12
  @media screen and (min-width: $min-width) {
13
13
  @content;
14
14
  }
@@ -16,16 +16,16 @@
16
16
  $min-width: 0;
17
17
  $max-width: 0;
18
18
  @if ($size == "small") {
19
- $min-width: variables.$breakpoint-small;
20
- $max-width: variables.$breakpoint-medium -
19
+ $min-width: variables.$responsive-breakpoint-small;
20
+ $max-width: variables.$responsive-breakpoint-medium -
21
21
  variables.$responsive-breakpoint-max-width-offset;
22
22
  } @else if ($size == "medium") {
23
- $min-width: variables.$breakpoint-medium;
24
- $max-width: variables.$breakpoint-large -
23
+ $min-width: variables.$responsive-breakpoint-medium;
24
+ $max-width: variables.$responsive-breakpoint-large -
25
25
  variables.$responsive-breakpoint-max-width-offset;
26
26
  } @else if ($size == "large") {
27
- $min-width: variables.$breakpoint-large;
28
- $max-width: variables.$breakpoint-xlarge -
27
+ $min-width: variables.$responsive-breakpoint-large;
28
+ $max-width: variables.$responsive-breakpoint-xlarge -
29
29
  variables.$responsive-breakpoint-max-width-offset;
30
30
  } @else {
31
31
  @error "wrong size.";
package/src/variables/layout.scss CHANGED
@@ -1,28 +1,30 @@
1
- $breakpoint-xsmall: 0 !default;
2
- $breakpoint-small: 544px !default;
3
- $breakpoint-medium: 768px !default;
4
- $breakpoint-large: 1024px !default;
5
- $breakpoint-xlarge: 1200px !default;
1
+ $responsive-breakpoint-xsmall: 0 !default;
2
+ $responsive-breakpoint-small: 544px !default;
3
+ $responsive-breakpoint-medium: 768px !default;
4
+ $responsive-breakpoint-large: 1024px !default;
5
+ $responsive-breakpoint-xlarge: 1200px !default;
6
6
 
7
7
  $breakpoints: (
8
8
  (
9
9
  "name": "xsmall",
10
- "value": $breakpoint-xsmall,
10
+ "value": $responsive-breakpoint-xsmall,
11
11
  ),
12
12
  (
13
13
  "name": "small",
14
- "value": $breakpoint-small,
14
+ "value": $responsive-breakpoint-small,
15
15
  ),
16
16
  (
17
17
  "name": "medium",
18
- "value": $breakpoint-medium,
18
+ "value": $responsive-breakpoint-medium,
19
19
  ),
20
20
  (
21
21
  "name": "large",
22
- "value": $breakpoint-large,
22
+ "value": $responsive-breakpoint-large,
23
23
  ),
24
24
  (
25
25
  "name": "xlarge",
26
- "value": $breakpoint-xlarge,
26
+ "value": $responsive-breakpoint-xlarge,
27
27
  )
28
- );
28
+ ) !default;
29
+
30
+ $responsive-breakpoint-max-width-offset: -0.02px !default;
package/src/variables/miscellaneous.scss CHANGED
@@ -10,5 +10,3 @@ $z-index-modal: 100 !default;
10
10
  $z-index-modal-content: auto !default;
11
11
 
12
12
  $columns-count: 12 !default;
13
-
14
- $responsive-breakpoint-max-width-offset: 0.02px !default;