@appartmint/mint 0.12.15 → 0.12.16
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.
- package/dist/css/mint.css +113 -39
- package/dist/css/mint.css.map +1 -1
- package/dist/css/mint.min.css +1 -1
- package/dist/css/mint.min.css.map +1 -1
- package/dist/js/imports/components/header.d.ts +5 -0
- package/dist/js/imports/components/header.d.ts.map +1 -1
- package/dist/js/index.js +36 -3
- package/dist/js/index.js.map +1 -1
- package/dist/js/index.min.js +1 -1
- package/dist/js/index.min.js.map +1 -1
- package/package.json +1 -1
- package/src/scss/imports/components/_cards.scss +3 -3
- package/src/scss/imports/components/_header.scss +95 -4
- package/src/scss/imports/util/_util.scss +7 -5
|
@@ -59,6 +59,93 @@
|
|
|
59
59
|
}
|
|
60
60
|
}
|
|
61
61
|
|
|
62
|
+
&#{class(expand)} {
|
|
63
|
+
@include break(sm) {
|
|
64
|
+
#{class(buttons)} {
|
|
65
|
+
width: auto;
|
|
66
|
+
|
|
67
|
+
#{controls(wrapper)} {
|
|
68
|
+
display: none;
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
#{id(wrapper)} {
|
|
73
|
+
position: static;
|
|
74
|
+
display: flex !important;
|
|
75
|
+
height: 100%;
|
|
76
|
+
padding: 0;
|
|
77
|
+
z-index: 0;
|
|
78
|
+
|
|
79
|
+
&,
|
|
80
|
+
& nav {
|
|
81
|
+
background: css-var(glow-0) !important;
|
|
82
|
+
overflow: visible;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
nav {
|
|
86
|
+
border: none;
|
|
87
|
+
|
|
88
|
+
&>ul {
|
|
89
|
+
flex-direction: row;
|
|
90
|
+
justify-content: flex-end;
|
|
91
|
+
flex-wrap: nowrap;
|
|
92
|
+
|
|
93
|
+
&>li {
|
|
94
|
+
position: relative;
|
|
95
|
+
width: 100%;
|
|
96
|
+
max-width: 200px;
|
|
97
|
+
text-align: center;
|
|
98
|
+
|
|
99
|
+
button,
|
|
100
|
+
ul {
|
|
101
|
+
width: 100%;
|
|
102
|
+
max-width: 200px;
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
button {
|
|
106
|
+
font-size: 1.5rem;
|
|
107
|
+
|
|
108
|
+
$arrow-size: 1rem;
|
|
109
|
+
$arrow-margin: 1rem;
|
|
110
|
+
padding-right: $arrow-margin + $arrow-size;
|
|
111
|
+
|
|
112
|
+
&::after {
|
|
113
|
+
content: '\f054';
|
|
114
|
+
font-family: 'Font Awesome 6 Pro';
|
|
115
|
+
font-weight: 900;
|
|
116
|
+
font-size: $arrow-size;
|
|
117
|
+
position: absolute;
|
|
118
|
+
top: 50%;
|
|
119
|
+
transform: translateY(-50%);
|
|
120
|
+
margin-left: $arrow-margin;
|
|
121
|
+
transition: transform css-var(delay-default);
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
@include states(hover, focus, expanded) {
|
|
125
|
+
&::after {
|
|
126
|
+
transform: translateY(-50%) rotate(90deg);
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
ul {
|
|
132
|
+
position: absolute;
|
|
133
|
+
top: 100%;
|
|
134
|
+
left: 50%;
|
|
135
|
+
transform: translateX(-50%);
|
|
136
|
+
background-color: css-var($header-back);
|
|
137
|
+
}
|
|
138
|
+
}
|
|
139
|
+
}
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
a {
|
|
143
|
+
font-size: 1.25rem;
|
|
144
|
+
}
|
|
145
|
+
}
|
|
146
|
+
}
|
|
147
|
+
}
|
|
148
|
+
|
|
62
149
|
&::before {
|
|
63
150
|
content: '';
|
|
64
151
|
position: absolute;
|
|
@@ -107,7 +194,6 @@
|
|
|
107
194
|
|
|
108
195
|
#{id(navbar)} {
|
|
109
196
|
display: flex;
|
|
110
|
-
flex-direction: column;
|
|
111
197
|
align-items: center;
|
|
112
198
|
flex-direction: row;
|
|
113
199
|
height: 100%;
|
|
@@ -135,7 +221,10 @@
|
|
|
135
221
|
|
|
136
222
|
@include states(hover) {
|
|
137
223
|
#{class(menu-icon)} {
|
|
138
|
-
|
|
224
|
+
|
|
225
|
+
&,
|
|
226
|
+
&::before,
|
|
227
|
+
&::after {
|
|
139
228
|
background-color: css-var($header-link-fore-hover);
|
|
140
229
|
}
|
|
141
230
|
}
|
|
@@ -242,6 +331,7 @@
|
|
|
242
331
|
|
|
243
332
|
@include states(hover, focus) {
|
|
244
333
|
background-color: css-var(shadow-5);
|
|
334
|
+
color: css-var($header-link-fore-hover);
|
|
245
335
|
}
|
|
246
336
|
|
|
247
337
|
@include states(active) {
|
|
@@ -266,8 +356,9 @@
|
|
|
266
356
|
flex-wrap: nowrap;
|
|
267
357
|
justify-content: flex-end;
|
|
268
358
|
width: 100%;
|
|
269
|
-
|
|
270
|
-
a,
|
|
359
|
+
|
|
360
|
+
a,
|
|
361
|
+
button {
|
|
271
362
|
&#{neg(controls(wrapper))} {
|
|
272
363
|
display: flex;
|
|
273
364
|
width: auto;
|
|
@@ -842,10 +842,6 @@ $bootstrap5: false !default;
|
|
|
842
842
|
@if (type-of($state) != 'string') {
|
|
843
843
|
@error 'The states mixin requires a string for each state argument.';
|
|
844
844
|
}
|
|
845
|
-
|
|
846
|
-
@if not($state == 'hover' or $state == 'focus' or $state == 'active' or $state == 'visited' or $state == 'disabled') {
|
|
847
|
-
@error 'The states mixin requires a string of "hover", "focus", "active", "visited", or "disabled" for each state argument.';
|
|
848
|
-
}
|
|
849
845
|
}
|
|
850
846
|
|
|
851
847
|
@if (index($states, 'hover') != null) {
|
|
@@ -855,7 +851,7 @@ $bootstrap5: false !default;
|
|
|
855
851
|
}
|
|
856
852
|
|
|
857
853
|
@if (index($states, 'focus') != null) {
|
|
858
|
-
&:focus {
|
|
854
|
+
&:focus-visible {
|
|
859
855
|
@content;
|
|
860
856
|
}
|
|
861
857
|
}
|
|
@@ -879,6 +875,12 @@ $bootstrap5: false !default;
|
|
|
879
875
|
@content;
|
|
880
876
|
}
|
|
881
877
|
}
|
|
878
|
+
|
|
879
|
+
@if (index($states, 'expanded') != null) {
|
|
880
|
+
&#{expanded(true)} {
|
|
881
|
+
@content;
|
|
882
|
+
}
|
|
883
|
+
}
|
|
882
884
|
}
|
|
883
885
|
|
|
884
886
|
/// Generates flex utility classes
|