@appartmint/mint 1.0.8 → 1.0.9

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 (8) hide show
  1. package/dist/css/mint.css +134 -95
  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/overrides/_amplify.scss +33 -30
  7. package/src/scss/imports/overrides/_material.scss +7 -2
  8. package/src/scss/imports/util/_vars.scss +36 -1
package/dist/css/mint.css CHANGED
@@ -30,14 +30,14 @@
30
30
  filter: opacity(1) blur(0.15vw);
31
31
  }
32
32
 
33
- .mint-btn, .mint-select,
33
+ .mint-btn, :root:root [amplify-button], .mint-select,
34
34
  .mint-btn-group,
35
35
  .mint-btn-icon,
36
36
  .mint-pill {
37
37
  flex-shrink: 0;
38
38
  }
39
39
 
40
- .mint-btn, .mint-select,
40
+ .mint-btn, :root:root [amplify-button], .mint-select,
41
41
  .mint-btn-icon,
42
42
  .mint-pill {
43
43
  width: fit-content;
@@ -50,7 +50,7 @@
50
50
  transition: color var(--mint-delay-default), background-color var(--mint-delay-default), border-color var(--mint-delay-default);
51
51
  }
52
52
 
53
- .mint-btn, .mint-select,
53
+ .mint-btn, :root:root [amplify-button], .mint-select,
54
54
  .mint-btn-group,
55
55
  .mint-pill {
56
56
  display: inline-block;
@@ -61,35 +61,35 @@
61
61
  text-align: center;
62
62
  }
63
63
  @media (min-width: 480px) {
64
- .mint-btn, .mint-select,
64
+ .mint-btn, :root:root [amplify-button], .mint-select,
65
65
  .mint-btn-group,
66
66
  .mint-pill {
67
67
  width: fit-content;
68
68
  }
69
69
  }
70
- .mint-btn:hover, .mint-select:hover,
70
+ .mint-btn:hover, :root:root [amplify-button]:hover, .mint-select:hover,
71
71
  .mint-btn-group:hover,
72
72
  .mint-pill:hover {
73
73
  color: var(--mint-back);
74
74
  background: var(--mint-brand-4);
75
75
  }
76
- .mint-btn:hover i, .mint-select:hover i,
76
+ .mint-btn:hover i, :root:root [amplify-button]:hover i, .mint-select:hover i,
77
77
  .mint-btn-group:hover i,
78
78
  .mint-pill:hover i {
79
79
  color: inherit !important;
80
80
  }
81
- .mint-btn:focus-visible, .mint-select:focus-visible,
81
+ .mint-btn:focus-visible, :root:root [amplify-button]:focus-visible, .mint-select:focus-visible,
82
82
  .mint-btn-group:focus-visible,
83
83
  .mint-pill:focus-visible {
84
84
  color: var(--mint-back);
85
85
  background: var(--mint-brand-4);
86
86
  }
87
- .mint-btn:focus-visible i, .mint-select:focus-visible i,
87
+ .mint-btn:focus-visible i, :root:root [amplify-button]:focus-visible i, .mint-select:focus-visible i,
88
88
  .mint-btn-group:focus-visible i,
89
89
  .mint-pill:focus-visible i {
90
90
  color: inherit !important;
91
91
  }
92
- .mint-btn:active, .mint-select:active, .mint-btn.mint-active, .mint-active.mint-select,
92
+ .mint-btn:active, :root:root [amplify-button]:active, .mint-select:active, .mint-btn.mint-active, :root:root .mint-active[amplify-button], .mint-active.mint-select,
93
93
  .mint-btn-group:active,
94
94
  .mint-btn-group.mint-active,
95
95
  .mint-pill:active,
@@ -97,32 +97,32 @@
97
97
  color: var(--mint-back);
98
98
  background: var(--mint-brand-4);
99
99
  }
100
- .mint-btn:active i, .mint-select:active i, .mint-btn.mint-active i, .mint-active.mint-select i,
100
+ .mint-btn:active i, :root:root [amplify-button]:active i, .mint-select:active i, .mint-btn.mint-active i, :root:root .mint-active[amplify-button] i, .mint-active.mint-select i,
101
101
  .mint-btn-group:active i,
102
102
  .mint-btn-group.mint-active i,
103
103
  .mint-pill:active i,
104
104
  .mint-pill.mint-active i {
105
105
  color: inherit !important;
106
106
  }
107
- .mint-btn.mint-reverse, .mint-reverse.mint-select,
107
+ .mint-btn.mint-reverse, :root:root .mint-reverse[amplify-button], .mint-reverse.mint-select,
108
108
  .mint-btn-group.mint-reverse,
109
109
  .mint-pill.mint-reverse {
110
110
  color: var(--mint-back);
111
111
  background: var(--mint-brand-4);
112
112
  }
113
- .mint-btn.mint-reverse:hover, .mint-reverse.mint-select:hover,
113
+ .mint-btn.mint-reverse:hover, :root:root .mint-reverse[amplify-button]:hover, .mint-reverse.mint-select:hover,
114
114
  .mint-btn-group.mint-reverse:hover,
115
115
  .mint-pill.mint-reverse:hover {
116
116
  color: var(--mint-fore);
117
117
  background: var(--mint-brand-2);
118
118
  }
119
- .mint-btn.mint-reverse:focus-visible, .mint-reverse.mint-select:focus-visible,
119
+ .mint-btn.mint-reverse:focus-visible, :root:root .mint-reverse[amplify-button]:focus-visible, .mint-reverse.mint-select:focus-visible,
120
120
  .mint-btn-group.mint-reverse:focus-visible,
121
121
  .mint-pill.mint-reverse:focus-visible {
122
122
  color: var(--mint-fore);
123
123
  background: var(--mint-brand-2);
124
124
  }
125
- .mint-btn.mint-reverse:active, .mint-reverse.mint-select:active, .mint-btn.mint-reverse.mint-active, .mint-reverse.mint-active.mint-select,
125
+ .mint-btn.mint-reverse:active, :root:root .mint-reverse[amplify-button]:active, .mint-reverse.mint-select:active, .mint-btn.mint-reverse.mint-active, :root:root .mint-reverse.mint-active[amplify-button], .mint-reverse.mint-active.mint-select,
126
126
  .mint-btn-group.mint-reverse:active,
127
127
  .mint-btn-group.mint-reverse.mint-active,
128
128
  .mint-pill.mint-reverse:active,
@@ -130,27 +130,27 @@
130
130
  color: var(--mint-fore);
131
131
  background: var(--mint-brand-2);
132
132
  }
133
- .mint-btn.mint-alt, .mint-alt.mint-select,
133
+ .mint-btn.mint-alt, :root:root .mint-alt[amplify-button], .mint-alt.mint-select,
134
134
  .mint-btn-group.mint-alt,
135
135
  .mint-pill.mint-alt {
136
136
  color: var(--mint-brand-4);
137
137
  background: var(--mint-trans);
138
138
  }
139
- .mint-btn.mint-alt:hover, .mint-alt.mint-select:hover,
139
+ .mint-btn.mint-alt:hover, :root:root .mint-alt[amplify-button]:hover, .mint-alt.mint-select:hover,
140
140
  .mint-btn-group.mint-alt:hover,
141
141
  .mint-pill.mint-alt:hover {
142
142
  color: var(--mint-back);
143
143
  background: var(--mint-accent-2);
144
144
  border-color: var(--mint-accent-2);
145
145
  }
146
- .mint-btn.mint-alt:focus-visible, .mint-alt.mint-select:focus-visible,
146
+ .mint-btn.mint-alt:focus-visible, :root:root .mint-alt[amplify-button]:focus-visible, .mint-alt.mint-select:focus-visible,
147
147
  .mint-btn-group.mint-alt:focus-visible,
148
148
  .mint-pill.mint-alt:focus-visible {
149
149
  color: var(--mint-back);
150
150
  background: var(--mint-accent-2);
151
151
  border-color: var(--mint-accent-2);
152
152
  }
153
- .mint-btn.mint-alt:active, .mint-alt.mint-select:active, .mint-btn.mint-alt.mint-active, .mint-alt.mint-active.mint-select,
153
+ .mint-btn.mint-alt:active, :root:root .mint-alt[amplify-button]:active, .mint-alt.mint-select:active, .mint-btn.mint-alt.mint-active, :root:root .mint-alt.mint-active[amplify-button], .mint-alt.mint-active.mint-select,
154
154
  .mint-btn-group.mint-alt:active,
155
155
  .mint-btn-group.mint-alt.mint-active,
156
156
  .mint-pill.mint-alt:active,
@@ -159,28 +159,28 @@
159
159
  background: var(--mint-accent-2);
160
160
  border-color: var(--mint-accent-2);
161
161
  }
162
- .mint-btn.mint-alt.mint-reverse, .mint-alt.mint-reverse.mint-select,
162
+ .mint-btn.mint-alt.mint-reverse, :root:root .mint-alt.mint-reverse[amplify-button], .mint-alt.mint-reverse.mint-select,
163
163
  .mint-btn-group.mint-alt.mint-reverse,
164
164
  .mint-pill.mint-alt.mint-reverse {
165
165
  color: var(--mint-back);
166
166
  background: var(--mint-accent-2);
167
167
  border-color: var(--mint-accent-2);
168
168
  }
169
- .mint-btn.mint-alt.mint-reverse:hover, .mint-alt.mint-reverse.mint-select:hover,
169
+ .mint-btn.mint-alt.mint-reverse:hover, :root:root .mint-alt.mint-reverse[amplify-button]:hover, .mint-alt.mint-reverse.mint-select:hover,
170
170
  .mint-btn-group.mint-alt.mint-reverse:hover,
171
171
  .mint-pill.mint-alt.mint-reverse:hover {
172
172
  color: var(--mint-brand-4);
173
173
  background: var(--mint-trans);
174
174
  border-color: var(--mint-trans);
175
175
  }
176
- .mint-btn.mint-alt.mint-reverse:focus-visible, .mint-alt.mint-reverse.mint-select:focus-visible,
176
+ .mint-btn.mint-alt.mint-reverse:focus-visible, :root:root .mint-alt.mint-reverse[amplify-button]:focus-visible, .mint-alt.mint-reverse.mint-select:focus-visible,
177
177
  .mint-btn-group.mint-alt.mint-reverse:focus-visible,
178
178
  .mint-pill.mint-alt.mint-reverse:focus-visible {
179
179
  color: var(--mint-brand-4);
180
180
  background: var(--mint-trans);
181
181
  border-color: var(--mint-trans);
182
182
  }
183
- .mint-btn.mint-alt.mint-reverse:active, .mint-alt.mint-reverse.mint-select:active, .mint-btn.mint-alt.mint-reverse.mint-active, .mint-alt.mint-reverse.mint-active.mint-select,
183
+ .mint-btn.mint-alt.mint-reverse:active, :root:root .mint-alt.mint-reverse[amplify-button]:active, .mint-alt.mint-reverse.mint-select:active, .mint-btn.mint-alt.mint-reverse.mint-active, :root:root .mint-alt.mint-reverse.mint-active[amplify-button], .mint-alt.mint-reverse.mint-active.mint-select,
184
184
  .mint-btn-group.mint-alt.mint-reverse:active,
185
185
  .mint-btn-group.mint-alt.mint-reverse.mint-active,
186
186
  .mint-pill.mint-alt.mint-reverse:active,
@@ -189,23 +189,23 @@
189
189
  background: var(--mint-trans);
190
190
  border-color: var(--mint-trans);
191
191
  }
192
- .mint-btn a, .mint-select a,
192
+ .mint-btn a, :root:root [amplify-button] a, .mint-select a,
193
193
  .mint-btn-group a,
194
194
  .mint-pill a {
195
195
  color: inherit;
196
196
  }
197
- .mint-btn a:hover, .mint-select a:hover,
197
+ .mint-btn a:hover, :root:root [amplify-button] a:hover, .mint-select a:hover,
198
198
  .mint-btn-group a:hover,
199
199
  .mint-pill a:hover {
200
200
  color: inherit;
201
201
  }
202
- .mint-btn a i, .mint-select a i,
202
+ .mint-btn a i, :root:root [amplify-button] a i, .mint-select a i,
203
203
  .mint-btn-group a i,
204
204
  .mint-pill a i {
205
205
  display: none;
206
206
  }
207
207
 
208
- .mint-btn, .mint-select {
208
+ .mint-btn, :root:root [amplify-button], .mint-select {
209
209
  padding: 0.5rem 1.75rem;
210
210
  }
211
211
  .mint-btn-icon {
@@ -284,7 +284,7 @@ a.mint-pill, button.mint-pill {
284
284
  min-width: 5rem;
285
285
  }
286
286
 
287
- p .mint-pill, p .mint-btn, p .mint-select {
287
+ p .mint-pill, p .mint-btn, :root:root p [amplify-button], p .mint-select {
288
288
  line-height: 1.5rem;
289
289
  vertical-align: middle;
290
290
  }
@@ -304,7 +304,7 @@ p .mint-pill, p .mint-btn, p .mint-select {
304
304
  .mint-buttons > * {
305
305
  width: 100%;
306
306
  }
307
- .mint-buttons > * .mint-btn, .mint-buttons > * .mint-select, .mint-buttons > * .mint-pill {
307
+ .mint-buttons > * .mint-btn, :root:root .mint-buttons > * [amplify-button], .mint-buttons > * .mint-select, .mint-buttons > * .mint-pill {
308
308
  display: block;
309
309
  }
310
310
  @media (min-width: 480px) {
@@ -324,7 +324,7 @@ p .mint-pill, p .mint-btn, p .mint-select {
324
324
  }
325
325
  }
326
326
 
327
- .mint-card {
327
+ .mint-card, :root:root [data-amplify-authenticator] [data-amplify-container] {
328
328
  display: flex;
329
329
  flex-direction: column;
330
330
  height: 100%;
@@ -335,62 +335,62 @@ p .mint-pill, p .mint-btn, p .mint-select {
335
335
  overflow: hidden;
336
336
  }
337
337
  @media (min-width: 768px) {
338
- .mint-card {
338
+ .mint-card, :root:root [data-amplify-authenticator] [data-amplify-container] {
339
339
  flex-direction: row;
340
340
  }
341
- .mint-card.mint-reverse {
341
+ .mint-card.mint-reverse, :root:root [data-amplify-authenticator] .mint-reverse[data-amplify-container] {
342
342
  flex-direction: row-reverse;
343
343
  }
344
344
  }
345
- .mint-card.mint-center .mint-title {
345
+ .mint-card.mint-center .mint-title, :root:root [data-amplify-authenticator] .mint-center[data-amplify-container] .mint-title {
346
346
  justify-content: center;
347
347
  text-align: center;
348
348
  }
349
- .mint-card.mint-center .mint-title > div {
349
+ .mint-card.mint-center .mint-title > div, :root:root [data-amplify-authenticator] .mint-center[data-amplify-container] .mint-title > div {
350
350
  width: auto;
351
351
  }
352
- .mint-card.mint-center .mint-content > * {
352
+ .mint-card.mint-center .mint-content > *, :root:root [data-amplify-authenticator] .mint-center[data-amplify-container] .mint-content > *, :root:root .mint-card.mint-center [data-amplify-authenticator] [data-amplify-container] [data-amplify-router] > *, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card.mint-center [data-amplify-router] > *, :root:root [data-amplify-authenticator] .mint-center[data-amplify-container] [data-amplify-router] > * {
353
353
  text-align: center;
354
354
  }
355
- .mint-card.mint-center .mint-buttons {
355
+ .mint-card.mint-center .mint-buttons, :root:root [data-amplify-authenticator] .mint-center[data-amplify-container] .mint-buttons {
356
356
  justify-content: center;
357
357
  }
358
- .mint-card.mint-center-title .mint-title {
358
+ .mint-card.mint-center-title .mint-title, :root:root [data-amplify-authenticator] .mint-center-title[data-amplify-container] .mint-title {
359
359
  justify-content: center;
360
360
  text-align: center;
361
361
  }
362
- .mint-card.mint-center-title .mint-title > div {
362
+ .mint-card.mint-center-title .mint-title > div, :root:root [data-amplify-authenticator] .mint-center-title[data-amplify-container] .mint-title > div {
363
363
  width: auto;
364
364
  }
365
- .mint-card.mint-center-content .mint-content > * {
365
+ .mint-card.mint-center-content .mint-content > *, :root:root [data-amplify-authenticator] .mint-center-content[data-amplify-container] .mint-content > *, :root:root .mint-card.mint-center-content [data-amplify-authenticator] [data-amplify-container] [data-amplify-router] > *, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card.mint-center-content [data-amplify-router] > *, :root:root [data-amplify-authenticator] .mint-center-content[data-amplify-container] [data-amplify-router] > * {
366
366
  text-align: center;
367
367
  }
368
- .mint-card.mint-center-btns .mint-buttons {
368
+ .mint-card.mint-center-btns .mint-buttons, :root:root [data-amplify-authenticator] .mint-center-btns[data-amplify-container] .mint-buttons {
369
369
  justify-content: center;
370
370
  }
371
- .mint-card.mint-stagger {
371
+ .mint-card.mint-stagger, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] {
372
372
  position: relative;
373
373
  width: 100%;
374
374
  }
375
375
  @media (min-width: 768px) {
376
- .mint-card.mint-stagger {
376
+ .mint-card.mint-stagger, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] {
377
377
  flex-direction: row;
378
378
  border-radius: 0;
379
379
  box-shadow: none;
380
380
  overflow: visible;
381
381
  }
382
- .mint-card.mint-stagger > .mint-image, .mint-card.mint-stagger > mint-image-widget .mint-image {
382
+ .mint-card.mint-stagger > .mint-image, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] > .mint-image, .mint-card.mint-stagger > mint-image-widget .mint-image, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] > mint-image-widget .mint-image {
383
383
  width: calc(50% + 1.5rem);
384
384
  height: fit-content;
385
385
  margin-right: -3rem;
386
386
  border-radius: 1rem;
387
387
  box-shadow: 0 0 2rem -0.5rem var(--mint-glow-2);
388
388
  }
389
- .mint-card.mint-stagger > .mint-image img, .mint-card.mint-stagger > mint-image-widget .mint-image img {
389
+ .mint-card.mint-stagger > .mint-image img, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] > .mint-image img, .mint-card.mint-stagger > mint-image-widget .mint-image img, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] > mint-image-widget .mint-image img {
390
390
  height: 100%;
391
391
  object-fit: cover;
392
392
  }
393
- .mint-card.mint-stagger > .mint-content {
393
+ .mint-card.mint-stagger > .mint-content, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] > .mint-content, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card.mint-stagger > [data-amplify-router], :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] > [data-amplify-router] {
394
394
  width: calc(50% + 1.5rem);
395
395
  height: fit-content;
396
396
  margin-top: 3rem;
@@ -399,31 +399,31 @@ p .mint-pill, p .mint-btn, p .mint-select {
399
399
  }
400
400
  }
401
401
  @media (min-width: 768px) {
402
- .mint-card.mint-stagger.mint-reverse {
402
+ .mint-card.mint-stagger.mint-reverse, :root:root [data-amplify-authenticator] .mint-stagger.mint-reverse[data-amplify-container] {
403
403
  flex-direction: row-reverse;
404
404
  }
405
- .mint-card.mint-stagger.mint-reverse > .mint-image, .mint-card.mint-stagger.mint-reverse > mint-image-widget .mint-image {
405
+ .mint-card.mint-stagger.mint-reverse > .mint-image, :root:root [data-amplify-authenticator] .mint-stagger.mint-reverse[data-amplify-container] > .mint-image, .mint-card.mint-stagger.mint-reverse > mint-image-widget .mint-image, :root:root [data-amplify-authenticator] .mint-stagger.mint-reverse[data-amplify-container] > mint-image-widget .mint-image {
406
406
  margin-right: 0;
407
407
  margin-left: -3rem;
408
408
  }
409
409
  }
410
- .mint-card > .mint-image:only-child, .mint-card > mint-image-widget:only-child .mint-image {
410
+ .mint-card > .mint-image:only-child, :root:root [data-amplify-authenticator] [data-amplify-container] > .mint-image:only-child, .mint-card > mint-image-widget:only-child .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] > mint-image-widget:only-child .mint-image {
411
411
  width: 100%;
412
412
  }
413
- .mint-card > .mint-image, .mint-card > mint-image-widget .mint-image {
413
+ .mint-card > .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] > .mint-image, .mint-card > mint-image-widget .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] > mint-image-widget .mint-image {
414
414
  overflow: hidden;
415
415
  }
416
416
  @media (min-width: 768px) {
417
- .mint-card > .mint-image, .mint-card > mint-image-widget .mint-image {
417
+ .mint-card > .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] > .mint-image, .mint-card > mint-image-widget .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] > mint-image-widget .mint-image {
418
418
  width: 50%;
419
419
  }
420
420
  }
421
421
  @media (min-width: 768px) {
422
- .mint-card > .mint-image + .mint-content, .mint-card > mint-image-widget .mint-image + .mint-content {
422
+ .mint-card > .mint-image + .mint-content, :root:root [data-amplify-authenticator] [data-amplify-container] > .mint-image + .mint-content, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card > .mint-image + [data-amplify-router], :root:root [data-amplify-authenticator] [data-amplify-container] > .mint-image + [data-amplify-router], .mint-card > mint-image-widget .mint-image + .mint-content, :root:root [data-amplify-authenticator] [data-amplify-container] > mint-image-widget .mint-image + .mint-content, :root:root .mint-card > mint-image-widget [data-amplify-authenticator] [data-amplify-container] .mint-image + [data-amplify-router], :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card > mint-image-widget .mint-image + [data-amplify-router], :root:root [data-amplify-authenticator] [data-amplify-container] > mint-image-widget .mint-image + [data-amplify-router] {
423
423
  width: 50%;
424
424
  }
425
425
  }
426
- .mint-card .mint-content {
426
+ .mint-card .mint-content, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-content, :root:root [data-amplify-authenticator] [data-amplify-container] [data-amplify-router] {
427
427
  display: flex;
428
428
  flex-direction: column;
429
429
  gap: 1rem;
@@ -433,11 +433,11 @@ p .mint-pill, p .mint-btn, p .mint-select {
433
433
  width: 100%;
434
434
  overflow: hidden;
435
435
  }
436
- .mint-card .mint-content > * {
436
+ .mint-card .mint-content > *, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-content > *, :root:root [data-amplify-authenticator] [data-amplify-container] [data-amplify-router] > * {
437
437
  margin-top: 0;
438
438
  margin-bottom: 0;
439
439
  }
440
- .mint-card .mint-title {
440
+ .mint-card .mint-title, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title {
441
441
  display: flex;
442
442
  flex-direction: column;
443
443
  align-items: center;
@@ -446,31 +446,31 @@ p .mint-pill, p .mint-btn, p .mint-select {
446
446
  text-align: center;
447
447
  }
448
448
  @media (min-width: 480px) {
449
- .mint-card .mint-title {
449
+ .mint-card .mint-title, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title {
450
450
  flex-direction: row;
451
451
  text-align: left;
452
452
  }
453
453
  }
454
- .mint-card .mint-title:only-child {
454
+ .mint-card .mint-title:only-child, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title:only-child {
455
455
  height: 100%;
456
456
  }
457
- .mint-card .mint-title > .mint-image, .mint-card .mint-title > mint-image-widget .mint-image {
457
+ .mint-card .mint-title > .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > .mint-image, .mint-card .mint-title > mint-image-widget .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > mint-image-widget .mint-image {
458
458
  width: 100%;
459
459
  height: 100%;
460
460
  max-width: 4rem;
461
461
  max-height: 4rem;
462
462
  }
463
- .mint-card .mint-title > .mint-image.mint-large, .mint-card .mint-title > mint-image-widget .mint-image.mint-large {
463
+ .mint-card .mint-title > .mint-image.mint-large, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > .mint-image.mint-large, .mint-card .mint-title > mint-image-widget .mint-image.mint-large, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > mint-image-widget .mint-image.mint-large {
464
464
  max-width: 8rem;
465
465
  max-height: 8rem;
466
466
  }
467
- .mint-card .mint-title > .mint-image img, .mint-card .mint-title > mint-image-widget .mint-image img {
467
+ .mint-card .mint-title > .mint-image img, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > .mint-image img, .mint-card .mint-title > mint-image-widget .mint-image img, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > mint-image-widget .mint-image img {
468
468
  display: block;
469
469
  width: 100%;
470
470
  height: 100%;
471
471
  object-fit: contain;
472
472
  }
473
- .mint-card .mint-title i {
473
+ .mint-card .mint-title i, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title i {
474
474
  display: flex;
475
475
  align-items: center;
476
476
  justify-content: center;
@@ -479,60 +479,96 @@ p .mint-pill, p .mint-btn, p .mint-select {
479
479
  margin: 0;
480
480
  font-size: 3rem;
481
481
  }
482
- .mint-card .mint-title > div {
482
+ .mint-card .mint-title > div, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > div {
483
483
  width: 100%;
484
484
  }
485
- .mint-card .mint-title > div > * {
485
+ .mint-card .mint-title > div > *, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > div > * {
486
486
  margin: 0;
487
487
  }
488
- .mint-card .mint-date {
488
+ .mint-card .mint-date, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-date {
489
489
  text-align: center;
490
490
  }
491
491
  @media (min-width: 480px) {
492
- .mint-card .mint-date {
492
+ .mint-card .mint-date, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-date {
493
493
  text-align: left;
494
494
  }
495
495
  }
496
496
 
497
- .mint-grid.mint-3 .mint-card,
498
- .mint-grid.mint-4 .mint-card {
497
+ .mint-grid.mint-3 .mint-card, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container], :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container],
498
+ .mint-grid.mint-4 .mint-card,
499
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container],
500
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] {
499
501
  flex-direction: column !important;
500
502
  }
501
- .mint-grid.mint-3 .mint-card > .mint-image, .mint-grid.mint-3 .mint-card > mint-image-widget .mint-image,
503
+ .mint-grid.mint-3 .mint-card > .mint-image, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] > .mint-image, :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] > .mint-image, .mint-grid.mint-3 .mint-card > mint-image-widget .mint-image, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] > mint-image-widget .mint-image, :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] > mint-image-widget .mint-image,
502
504
  .mint-grid.mint-4 .mint-card > .mint-image,
503
- .mint-grid.mint-4 .mint-card > mint-image-widget .mint-image {
505
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > .mint-image,
506
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image,
507
+ .mint-grid.mint-4 .mint-card > mint-image-widget .mint-image,
508
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > mint-image-widget .mint-image,
509
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > mint-image-widget .mint-image {
504
510
  overflow: hidden;
505
511
  }
506
512
  @media (min-width: 768px) {
507
- .mint-grid.mint-3 .mint-card > .mint-image, .mint-grid.mint-3 .mint-card > mint-image-widget .mint-image,
513
+ .mint-grid.mint-3 .mint-card > .mint-image, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] > .mint-image, :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] > .mint-image, .mint-grid.mint-3 .mint-card > mint-image-widget .mint-image, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] > mint-image-widget .mint-image, :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] > mint-image-widget .mint-image,
508
514
  .mint-grid.mint-4 .mint-card > .mint-image,
509
- .mint-grid.mint-4 .mint-card > mint-image-widget .mint-image {
515
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > .mint-image,
516
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image,
517
+ .mint-grid.mint-4 .mint-card > mint-image-widget .mint-image,
518
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > mint-image-widget .mint-image,
519
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > mint-image-widget .mint-image {
510
520
  width: 100%;
511
521
  }
512
522
  }
513
523
  @media (min-width: 768px) {
514
- .mint-grid.mint-3 .mint-card > .mint-image + .mint-content, .mint-grid.mint-3 .mint-card > mint-image-widget .mint-image + .mint-content,
524
+ .mint-grid.mint-3 .mint-card > .mint-image + .mint-content, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] > .mint-image + .mint-content, :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] > .mint-image + .mint-content, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] .mint-card > .mint-image + [data-amplify-router], :root:root [data-amplify-authenticator] [data-amplify-container] .mint-grid.mint-3 .mint-card > .mint-image + [data-amplify-router], :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] > .mint-image + [data-amplify-router], :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] > .mint-image + [data-amplify-router], .mint-grid.mint-3 .mint-card > mint-image-widget .mint-image + .mint-content, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] > mint-image-widget .mint-image + .mint-content, :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] > mint-image-widget .mint-image + .mint-content, :root:root .mint-grid.mint-3 .mint-card > mint-image-widget [data-amplify-authenticator] [data-amplify-container] .mint-image + [data-amplify-router], :root:root [data-amplify-authenticator] [data-amplify-container] .mint-grid.mint-3 .mint-card > mint-image-widget .mint-image + [data-amplify-router], :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] > mint-image-widget .mint-image + [data-amplify-router], :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] > mint-image-widget .mint-image + [data-amplify-router],
515
525
  .mint-grid.mint-4 .mint-card > .mint-image + .mint-content,
516
- .mint-grid.mint-4 .mint-card > mint-image-widget .mint-image + .mint-content {
526
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > .mint-image + .mint-content,
527
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image + .mint-content,
528
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] .mint-card > .mint-image + [data-amplify-router],
529
+ :root:root [data-amplify-authenticator] [data-amplify-container] .mint-grid.mint-4 .mint-card > .mint-image + [data-amplify-router],
530
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > .mint-image + [data-amplify-router],
531
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image + [data-amplify-router],
532
+ .mint-grid.mint-4 .mint-card > mint-image-widget .mint-image + .mint-content,
533
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > mint-image-widget .mint-image + .mint-content,
534
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > mint-image-widget .mint-image + .mint-content,
535
+ :root:root .mint-grid.mint-4 .mint-card > mint-image-widget [data-amplify-authenticator] [data-amplify-container] .mint-image + [data-amplify-router],
536
+ :root:root [data-amplify-authenticator] [data-amplify-container] .mint-grid.mint-4 .mint-card > mint-image-widget .mint-image + [data-amplify-router],
537
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > mint-image-widget .mint-image + [data-amplify-router],
538
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > mint-image-widget .mint-image + [data-amplify-router] {
517
539
  width: 100%;
518
540
  }
519
541
  }
520
- .mint-grid.mint-3 .mint-card .mint-content,
521
- .mint-grid.mint-4 .mint-card .mint-content {
542
+ .mint-grid.mint-3 .mint-card .mint-content, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] .mint-content, :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] .mint-content, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-grid.mint-3 .mint-card [data-amplify-router], :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] [data-amplify-router], :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] [data-amplify-router],
543
+ .mint-grid.mint-4 .mint-card .mint-content,
544
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] .mint-content,
545
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] .mint-content,
546
+ :root:root [data-amplify-authenticator] [data-amplify-container] .mint-grid.mint-4 .mint-card [data-amplify-router],
547
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] [data-amplify-router],
548
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] [data-amplify-router] {
522
549
  height: 100%;
523
550
  }
524
551
  @media (min-width: 480px) {
525
- .mint-grid.mint-3 .mint-card .mint-title,
526
- .mint-grid.mint-4 .mint-card .mint-title {
552
+ .mint-grid.mint-3 .mint-card .mint-title, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] .mint-title, :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] .mint-title,
553
+ .mint-grid.mint-4 .mint-card .mint-title,
554
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] .mint-title,
555
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] .mint-title {
527
556
  flex-direction: column;
528
557
  }
529
558
  }
530
- .mint-grid.mint-3 .mint-card .mint-buttons,
531
- .mint-grid.mint-4 .mint-card .mint-buttons {
559
+ .mint-grid.mint-3 .mint-card .mint-buttons, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] .mint-buttons, :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] .mint-buttons,
560
+ .mint-grid.mint-4 .mint-card .mint-buttons,
561
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] .mint-buttons,
562
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] .mint-buttons {
532
563
  margin-top: auto;
533
564
  }
534
- .mint-grid.mint-3 .mint-card .mint-buttons .mint-btn,
535
- .mint-grid.mint-4 .mint-card .mint-buttons .mint-btn {
565
+ .mint-grid.mint-3 .mint-card .mint-buttons .mint-btn, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] .mint-buttons .mint-btn, :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] .mint-buttons .mint-btn, :root:root .mint-grid.mint-3 .mint-card .mint-buttons [amplify-button], :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] .mint-buttons [amplify-button], :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] .mint-buttons [amplify-button],
566
+ .mint-grid.mint-4 .mint-card .mint-buttons .mint-btn,
567
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] .mint-buttons .mint-btn,
568
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] .mint-buttons .mint-btn,
569
+ :root:root .mint-grid.mint-4 .mint-card .mint-buttons [amplify-button],
570
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] .mint-buttons [amplify-button],
571
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] .mint-buttons [amplify-button] {
536
572
  width: 100%;
537
573
  }
538
574
 
@@ -3212,30 +3248,28 @@ a:active .fa-vimeo, a.mint-active .fa-vimeo {
3212
3248
  color: var(--mint-venmo);
3213
3249
  }
3214
3250
 
3215
- :root:root:root {
3251
+ :root:root {
3216
3252
  --amplify-colors-background-error: var(--mint-glow-0);
3217
- --amplify-colors-border-primary: var(--mint-brand-1);
3218
- --amplify-colors-border-focus: var(--mint-brand-3);
3219
- --amplify-colors-font-hover: var(--mint-brand-0);
3220
- --amplify-colors-font-interactive: var(--mint-brand-1);
3221
- --amplify-colors-font-primary: var(--mint-white);
3222
- --amplify-colors-font-secondary: var(--mint-brand-0);
3223
- --amplify-colors-font-error: var(--mint-danger);
3253
+ --amplify-colors-border-primary: var(--mint-brand-5);
3254
+ --amplify-colors-border-focus: var(--mint-brand-4);
3255
+ --amplify-colors-font-hover: var(--mint-brand-3);
3256
+ --amplify-colors-font-interactive: var(--mint-brand-5);
3257
+ --amplify-colors-font-primary: var(--mint-fore);
3258
+ --amplify-components-fieldcontrol-color: var(--amplify-colors-font-primary);
3259
+ --amplify-colors-font-secondary: var(--mint-brand-6);
3260
+ --amplify-colors-font-error: var(--mint-danger-5);
3224
3261
  --amplify-colors-font-warning: var(--mint-warning);
3225
3262
  --amplify-colors-font-success: var(--mint-success);
3226
3263
  --amplify-colors-font-info: var(--mint-info);
3227
- --amplify-border-widths-small: $border-width;
3264
+ --amplify-border-widths-small: 0.125rem;
3228
3265
  }
3229
-
3230
- [data-amplify-authenticator] [data-amplify-container] [data-amplify-router] {
3266
+ :root:root [data-amplify-authenticator] [data-amplify-container] [data-amplify-router] {
3231
3267
  border: none;
3232
3268
  }
3233
-
3234
- [amplify-button] {
3269
+ :root:root [amplify-button] {
3235
3270
  margin: auto;
3236
3271
  }
3237
-
3238
- .amplify-icon {
3272
+ :root:root .amplify-icon {
3239
3273
  display: block;
3240
3274
  }
3241
3275
 
@@ -3273,7 +3307,12 @@ a:active .fa-vimeo, a.mint-active .fa-vimeo {
3273
3307
  }
3274
3308
 
3275
3309
  :root:root {
3276
- --mat-table-background-color: transparent;
3310
+ --mat-table-background-color: back;
3311
+ --mat-paginator-container-background-color: back;
3312
+ --mat-table-row-item-label-text-color: fore;
3313
+ --mat-table-header-headline-color: fore;
3314
+ --mat-table-header-subheadline-color: fore;
3315
+ --mat-paginator-container-text-color: fore;
3277
3316
  }
3278
3317
 
3279
3318
  .cdk-overlay-container .mat-mdc-select-panel {