@appartmint/mint 2.6.21 → 2.7.0

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 (7) hide show
  1. package/dist/css/mint.css +54 -43
  2. package/dist/css/mint.css.map +1 -1
  3. package/dist/css/mint.min.css +1 -1
  4. package/dist/css/mint.min.css.map +1 -1
  5. package/package.json +1 -1
  6. package/src/scss/imports/global/_grid.scss +34 -33
  7. package/src/scss/imports/global/_inputs.scss +14 -2
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@appartmint/mint",
3
3
  "author": "App Art Mint LLC",
4
- "version": "2.6.21",
4
+ "version": "2.7.0",
5
5
  "license": "MIT",
6
6
  "description": "The front-end TS/SCSS framework of App Art Mint",
7
7
  "keywords": [
package/src/scss/imports/global/_grid.scss CHANGED
@@ -4,11 +4,17 @@
4
4
  /// Grid mixins
5
5
  @mixin grid-2 {
6
6
  @include break(sm) {
7
- grid-template-columns: repeat(2, 1fr);
7
+ grid-template-columns: repeat(12, 1fr);
8
+
9
+ & > * {
10
+ #{class(card)} {
11
+ grid-column: span 6;
12
+ }
13
+ }
8
14
 
9
15
  & > :last-child:nth-child(odd) {
10
16
  #{class(card)} {
11
- grid-column: span 2;
17
+ grid-column: span 12;
12
18
  width: 50%;
13
19
  margin-left: auto;
14
20
  margin-right: auto;
@@ -19,30 +25,36 @@
19
25
 
20
26
  @mixin grid-3 {
21
27
  @include break(lg) {
22
- grid-template-columns: repeat(3, 1fr);
28
+ grid-template-columns: repeat(12, 1fr);
29
+
30
+ & > * {
31
+ #{class(card)} {
32
+ grid-column: span 4;
33
+ }
34
+ }
23
35
 
24
36
  & > :last-child:nth-child(odd) {
25
37
  #{class(card)} {
26
- grid-column: span 1;
38
+ grid-column: span 4;
27
39
  width: 100%;
28
40
  }
29
41
  }
30
42
 
31
43
  & > :last-child:nth-child(#{'3n+1'}) {
32
44
  #{class(card)} {
33
- grid-column: 2;
45
+ grid-column: 4 / span 6;
34
46
  }
35
47
  }
36
48
 
37
49
  & > :last-child:nth-child(#{'3n+2'}) {
38
50
  #{class(card)} {
39
- grid-column: 3;
51
+ grid-column: 7 / span 6;
40
52
  }
41
53
  }
42
54
 
43
55
  & > :nth-last-child(2):nth-child(#{'3n+1'}) {
44
56
  #{class(card)} {
45
- grid-column: 1;
57
+ grid-column: 1 / span 6;
46
58
  }
47
59
  }
48
60
  }
@@ -50,67 +62,60 @@
50
62
 
51
63
  @mixin grid-4 {
52
64
  @include break(xl) {
53
- grid-template-columns: repeat(4, 1fr);
65
+ grid-template-columns: repeat(12, 1fr);
66
+
67
+ & > * {
68
+ #{class(card)} {
69
+ grid-column: span 3;
70
+ }
71
+ }
54
72
 
55
73
  & > :last-child:nth-child(odd),
56
74
  & > :last-child:nth-child(#{'3n+1'}),
57
75
  & > :last-child:nth-child(#{'3n+2'}),
58
76
  & > :nth-last-child(2):nth-child(#{'3n+1'}) {
59
77
  #{class(card)} {
60
- grid-column: span 1;
78
+ grid-column: span 3;
61
79
  width: 100%;
62
80
  }
63
81
  }
64
82
 
65
83
  & > :last-child:nth-child(#{'4n+1'}) {
66
84
  #{class(card)} {
67
- grid-column: 2 / span 2;
68
- width: 50%;
69
- margin-left: auto;
70
- margin-right: auto;
85
+ grid-column: 4 / span 6;
71
86
  }
72
87
  }
73
88
 
74
89
  & > :last-child:nth-child(#{'4n+2'}) {
75
90
  #{class(card)} {
76
- grid-column: 3 / span 2;
77
- width: 50%;
78
- margin-left: auto;
79
- margin-right: auto;
91
+ grid-column: 7 / span 6;
80
92
  }
81
93
  }
82
94
 
83
95
  & > :nth-last-child(2):nth-child(#{'4n+1'}) {
84
96
  #{class(card)} {
85
- grid-column: 1 / span 2;
86
- width: 50%;
87
- margin-left: auto;
88
- margin-right: auto;
97
+ grid-column: 1 / span 6;
89
98
  }
90
99
  }
91
100
 
92
101
  & > :last-child:nth-child(#{'4n+3'}) {
93
102
  #{class(card)} {
94
- grid-column: 4;
103
+ grid-column: 9 / span 4;
95
104
  }
96
105
  }
97
106
 
98
107
  & > :nth-last-child(2):nth-child(#{'4n+2'}) {
99
108
  #{class(card)} {
100
- grid-column: 2 / span 2;
101
- width: 50%;
102
- margin-left: auto;
103
- margin-right: auto;
109
+ grid-column: 5 / span 4;
104
110
  }
105
111
  }
106
112
 
107
113
  & > :nth-last-child(3):nth-child(#{'4n+1'}) {
108
114
  #{class(card)} {
109
- grid-column: 1;
115
+ grid-column: 1 / span 4;
110
116
  }
111
117
  }
112
118
  }
113
-
114
119
  }
115
120
 
116
121
  /// Grid styles
@@ -143,11 +148,7 @@
143
148
 
144
149
  #{class(landscape)} {
145
150
  @include break(sm) {
146
- grid-column: span 2;
147
- }
148
- @include break(lg) {
149
- grid-column: span 3;
151
+ grid-column: span 12;
150
152
  }
151
153
  }
152
154
  }
153
-
package/src/scss/imports/global/_inputs.scss CHANGED
@@ -72,12 +72,17 @@ textarea {
72
72
  filter: grayscale(0);
73
73
 
74
74
  i {
75
- opacity: 1;
75
+ opacity: 0;
76
+
77
+ &:first-child {
78
+ opacity: 1;
79
+ }
76
80
  }
77
81
  }
78
82
  }
79
83
 
80
84
  & + span {
85
+ position: relative;
81
86
  display: flex;
82
87
  align-items: center;
83
88
  justify-content: center;
@@ -93,9 +98,16 @@ textarea {
93
98
  transition: filter 300ms, background-color 300ms, left 300ms;
94
99
 
95
100
  i {
101
+ position: absolute;
102
+ top: 50%;
103
+ left: 50%;
104
+ transform: translate(-50%, -50%);
96
105
  color: css-var(back);
97
- opacity: 0;
98
106
  transition: opacity delay(default);
107
+
108
+ &:first-child {
109
+ opacity: 0;
110
+ }
99
111
  }
100
112
  }
101
113
  }