@appartmint/mint 4.0.0 → 4.0.3

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 CHANGED
@@ -1290,6 +1290,27 @@ p .mint-pill, p .mint-btn, :root:root p [amplify-button], p .mint-select {
1290
1290
  }
1291
1291
  }
1292
1292
 
1293
+ .mint-link {
1294
+ border: none;
1295
+ background: none;
1296
+ text-decoration: underline;
1297
+ color: var(--mint-brand-4);
1298
+ transition: color 0.3s ease;
1299
+ cursor: pointer;
1300
+ }
1301
+ .mint-link:hover {
1302
+ color: var(--mint-accent-2);
1303
+ }
1304
+ .mint-link:focus-visible {
1305
+ color: var(--mint-accent-2);
1306
+ }
1307
+ .mint-link:active {
1308
+ color: var(--mint-accent-2);
1309
+ }
1310
+ .mint-link.mint-active {
1311
+ color: var(--mint-accent-2);
1312
+ }
1313
+
1293
1314
  .mint-card, :root:root [data-amplify-authenticator] [data-amplify-container] {
1294
1315
  display: flex;
1295
1316
  flex-direction: column;
@@ -1309,6 +1330,11 @@ p .mint-pill, p .mint-btn, :root:root p [amplify-button], p .mint-select {
1309
1330
  flex-direction: row-reverse;
1310
1331
  }
1311
1332
  }
1333
+ @media (min-width: 1024px) {
1334
+ .mint-card, :root:root [data-amplify-authenticator] [data-amplify-container] {
1335
+ align-items: flex-start;
1336
+ }
1337
+ }
1312
1338
  .mint-card:has(.mint-carousel), :root:root [data-amplify-authenticator] [data-amplify-container]:has(.mint-carousel) {
1313
1339
  box-shadow: none;
1314
1340
  }
@@ -1352,13 +1378,13 @@ p .mint-pill, p .mint-btn, :root:root p [amplify-button], p .mint-select {
1352
1378
  box-shadow: none;
1353
1379
  overflow: visible;
1354
1380
  }
1355
- .mint-card.mint-stagger > .mint-image, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] > .mint-image {
1381
+ .mint-card.mint-stagger > .mint-image, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] > .mint-image, .mint-card.mint-stagger > mint-widget-image .mint-image, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] > mint-widget-image .mint-image {
1356
1382
  width: calc(50% + var(--mint-card-padding));
1357
1383
  height: fit-content;
1358
1384
  margin-right: calc(var(--mint-card-padding) * -2);
1359
1385
  border-radius: var(--mint-card-radius);
1360
1386
  }
1361
- .mint-card.mint-stagger > .mint-image img, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] > .mint-image img {
1387
+ .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-widget-image .mint-image img, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] > mint-widget-image .mint-image img {
1362
1388
  height: 100%;
1363
1389
  object-fit: cover;
1364
1390
  }
@@ -1374,24 +1400,24 @@ p .mint-pill, p .mint-btn, :root:root p [amplify-button], p .mint-select {
1374
1400
  .mint-card.mint-stagger.mint-reverse, :root:root [data-amplify-authenticator] .mint-stagger.mint-reverse[data-amplify-container] {
1375
1401
  flex-direction: row-reverse;
1376
1402
  }
1377
- .mint-card.mint-stagger.mint-reverse > .mint-image, :root:root [data-amplify-authenticator] .mint-stagger.mint-reverse[data-amplify-container] > .mint-image {
1403
+ .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-widget-image .mint-image, :root:root [data-amplify-authenticator] .mint-stagger.mint-reverse[data-amplify-container] > mint-widget-image .mint-image {
1378
1404
  margin-right: 0;
1379
1405
  margin-left: calc(var(--mint-card-padding) * -2);
1380
1406
  }
1381
1407
  }
1382
- .mint-card > .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] > .mint-image {
1408
+ .mint-card > .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] > .mint-image, .mint-card > mint-widget-image .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] > mint-widget-image .mint-image {
1383
1409
  overflow: hidden;
1384
1410
  }
1385
1411
  @media (min-width: 768px) {
1386
- .mint-card > .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] > .mint-image {
1412
+ .mint-card > .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] > .mint-image, .mint-card > mint-widget-image .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] > mint-widget-image .mint-image {
1387
1413
  width: 50%;
1388
1414
  }
1389
1415
  }
1390
- .mint-card > .mint-image:only-child, :root:root [data-amplify-authenticator] [data-amplify-container] > .mint-image:only-child {
1416
+ .mint-card > .mint-image:only-child, :root:root [data-amplify-authenticator] [data-amplify-container] > .mint-image:only-child, .mint-card > mint-widget-image .mint-image:only-child, :root:root [data-amplify-authenticator] [data-amplify-container] > mint-widget-image .mint-image:only-child {
1391
1417
  width: 100%;
1392
1418
  }
1393
1419
  @media (min-width: 768px) {
1394
- .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] {
1420
+ .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-widget-image .mint-image + .mint-content, :root:root [data-amplify-authenticator] [data-amplify-container] > mint-widget-image .mint-image + .mint-content, :root:root .mint-card > mint-widget-image [data-amplify-authenticator] [data-amplify-container] .mint-image + [data-amplify-router], :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card > mint-widget-image .mint-image + [data-amplify-router], :root:root [data-amplify-authenticator] [data-amplify-container] > mint-widget-image .mint-image + [data-amplify-router] {
1395
1421
  width: 50%;
1396
1422
  }
1397
1423
  }
@@ -1427,17 +1453,17 @@ p .mint-pill, p .mint-btn, :root:root p [amplify-button], p .mint-select {
1427
1453
  .mint-card .mint-title:only-child, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title:only-child {
1428
1454
  height: 100%;
1429
1455
  }
1430
- .mint-card .mint-title > .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > .mint-image {
1456
+ .mint-card .mint-title > .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > .mint-image, .mint-card .mint-title > mint-widget-image .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > mint-widget-image .mint-image {
1431
1457
  width: 100%;
1432
1458
  height: 100%;
1433
1459
  max-width: var(--mint-card-logo-size);
1434
1460
  max-height: var(--mint-card-logo-size);
1435
1461
  }
1436
- .mint-card .mint-title > .mint-image.mint-large, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > .mint-image.mint-large {
1462
+ .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-widget-image .mint-image.mint-large, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > mint-widget-image .mint-image.mint-large {
1437
1463
  max-width: calc(2 * var(--mint-card-logo-size));
1438
1464
  max-height: calc(2 * var(--mint-card-logo-size));
1439
1465
  }
1440
- .mint-card .mint-title > .mint-image img, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > .mint-image img {
1466
+ .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-widget-image .mint-image img, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > mint-widget-image .mint-image img {
1441
1467
  display: block;
1442
1468
  width: 100%;
1443
1469
  height: 100%;
@@ -1525,29 +1551,42 @@ p .mint-pill, p .mint-btn, :root:root p [amplify-button], p .mint-select {
1525
1551
  :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] {
1526
1552
  flex-direction: column !important;
1527
1553
  }
1528
- .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,
1554
+ .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-widget-image .mint-image, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] > mint-widget-image .mint-image, :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] > mint-widget-image .mint-image,
1529
1555
  .mint-grid.mint-4 .mint-card > .mint-image,
1530
1556
  :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > .mint-image,
1531
- :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image {
1557
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image,
1558
+ .mint-grid.mint-4 .mint-card > mint-widget-image .mint-image,
1559
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > mint-widget-image .mint-image,
1560
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > mint-widget-image .mint-image {
1532
1561
  overflow: hidden;
1533
1562
  }
1534
1563
  @media (min-width: 768px) {
1535
- .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,
1564
+ .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-widget-image .mint-image, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] > mint-widget-image .mint-image, :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] > mint-widget-image .mint-image,
1536
1565
  .mint-grid.mint-4 .mint-card > .mint-image,
1537
1566
  :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > .mint-image,
1538
- :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image {
1567
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image,
1568
+ .mint-grid.mint-4 .mint-card > mint-widget-image .mint-image,
1569
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > mint-widget-image .mint-image,
1570
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > mint-widget-image .mint-image {
1539
1571
  width: 100%;
1540
1572
  }
1541
1573
  }
1542
1574
  @media (min-width: 768px) {
1543
- .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],
1575
+ .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-widget-image .mint-image + .mint-content, :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] > mint-widget-image .mint-image + .mint-content, :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] > mint-widget-image .mint-image + .mint-content, :root:root .mint-grid.mint-3 .mint-card > mint-widget-image [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-widget-image .mint-image + [data-amplify-router], :root:root .mint-grid.mint-3 [data-amplify-authenticator] [data-amplify-container] > mint-widget-image .mint-image + [data-amplify-router], :root:root [data-amplify-authenticator] .mint-grid.mint-3 [data-amplify-container] > mint-widget-image .mint-image + [data-amplify-router],
1544
1576
  .mint-grid.mint-4 .mint-card > .mint-image + .mint-content,
1545
1577
  :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > .mint-image + .mint-content,
1546
1578
  :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image + .mint-content,
1547
1579
  :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] .mint-card > .mint-image + [data-amplify-router],
1548
1580
  :root:root [data-amplify-authenticator] [data-amplify-container] .mint-grid.mint-4 .mint-card > .mint-image + [data-amplify-router],
1549
1581
  :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > .mint-image + [data-amplify-router],
1550
- :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image + [data-amplify-router] {
1582
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image + [data-amplify-router],
1583
+ .mint-grid.mint-4 .mint-card > mint-widget-image .mint-image + .mint-content,
1584
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > mint-widget-image .mint-image + .mint-content,
1585
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > mint-widget-image .mint-image + .mint-content,
1586
+ :root:root .mint-grid.mint-4 .mint-card > mint-widget-image [data-amplify-authenticator] [data-amplify-container] .mint-image + [data-amplify-router],
1587
+ :root:root [data-amplify-authenticator] [data-amplify-container] .mint-grid.mint-4 .mint-card > mint-widget-image .mint-image + [data-amplify-router],
1588
+ :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > mint-widget-image .mint-image + [data-amplify-router],
1589
+ :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > mint-widget-image .mint-image + [data-amplify-router] {
1551
1590
  width: 100%;
1552
1591
  }
1553
1592
  }
@@ -3362,6 +3401,90 @@ textarea {
3362
3401
  min-height: calc(100dvh - var(--mint-header-height));
3363
3402
  }
3364
3403
 
3404
+ .mint-display-block {
3405
+ display: block;
3406
+ }
3407
+ .mint-display-block-xs {
3408
+ display: none;
3409
+ }
3410
+ @media (min-width: 480px) {
3411
+ .mint-display-block-xs {
3412
+ display: block;
3413
+ }
3414
+ }
3415
+ .mint-display-block-to-xs {
3416
+ display: block;
3417
+ }
3418
+ @media (min-width: 480px) {
3419
+ .mint-display-block-to-xs {
3420
+ display: none;
3421
+ }
3422
+ }
3423
+ .mint-display-block-sm {
3424
+ display: none;
3425
+ }
3426
+ @media (min-width: 768px) {
3427
+ .mint-display-block-sm {
3428
+ display: block;
3429
+ }
3430
+ }
3431
+ .mint-display-block-to-sm {
3432
+ display: block;
3433
+ }
3434
+ @media (min-width: 768px) {
3435
+ .mint-display-block-to-sm {
3436
+ display: none;
3437
+ }
3438
+ }
3439
+ .mint-display-block-md {
3440
+ display: none;
3441
+ }
3442
+ @media (min-width: 1024px) {
3443
+ .mint-display-block-md {
3444
+ display: block;
3445
+ }
3446
+ }
3447
+ .mint-display-block-to-md {
3448
+ display: block;
3449
+ }
3450
+ @media (min-width: 1024px) {
3451
+ .mint-display-block-to-md {
3452
+ display: none;
3453
+ }
3454
+ }
3455
+ .mint-display-block-lg {
3456
+ display: none;
3457
+ }
3458
+ @media (min-width: 1200px) {
3459
+ .mint-display-block-lg {
3460
+ display: block;
3461
+ }
3462
+ }
3463
+ .mint-display-block-to-lg {
3464
+ display: block;
3465
+ }
3466
+ @media (min-width: 1200px) {
3467
+ .mint-display-block-to-lg {
3468
+ display: none;
3469
+ }
3470
+ }
3471
+ .mint-display-block-xl {
3472
+ display: none;
3473
+ }
3474
+ @media (min-width: 1440px) {
3475
+ .mint-display-block-xl {
3476
+ display: block;
3477
+ }
3478
+ }
3479
+ .mint-display-block-to-xl {
3480
+ display: block;
3481
+ }
3482
+ @media (min-width: 1440px) {
3483
+ .mint-display-block-to-xl {
3484
+ display: none;
3485
+ }
3486
+ }
3487
+
3365
3488
  html, body {
3366
3489
  font-family: sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
3367
3490
  font-size: 1rem;