@appartmint/css-mint 0.1.0 → 1.0.1

package/dist/amplify.css

@@ -0,0 +1,630 @@
+:root {
+  --mint-btn-pv: calc(var(--mint-gap) * 2);
+  --mint-btn-ph: calc(var(--mint-gap) * 4);
+  --mint-btn-br: var(--mint-br);
+  --mint-btn-bw: var(--mint-bw);
+  --mint-btn-bc: var(--mint-c-brand-4);
+  --mint-btn-fg: var(--mint-c-fg);
+  --mint-btn-fg-hover: var(--mint-c-bg);
+  --mint-btn-fg-alt: var(--mint-btn-bc);
+  --mint-btn-fg-alt-hover: var(--mint-btn-fg-hover);
+  --mint-btn-bg: var(--mint-c-brand-2);
+  --mint-btn-bg-hover: var(--mint-btn-bc);
+  --mint-btn-bg-alt: var(--mint-c-glow-0);
+  --mint-btn-bg-alt-hover: var(--mint-c-accent-2);
+  --mint-pill-pv: 0;
+  --mint-pill-ph: calc(var(--mint-gap) * 3);
+  --mint-pill-br: var(--mint-br);
+}
+
+.mint-theme-dark {
+  --mint-btn-bg: var(--mint-c-brand-5);
+  --mint-btn-bc: var(--mint-c-brand-2);
+}
+
+button,
+a[routerLink] {
+  cursor: pointer;
+}
+
+a,
+button,
+.mint-btn,
+:root:root [amplify-button],
+.mint-select,
+.mint-btn-icon,
+.mint-pill {
+  font-size: inherit;
+}
+a[disabled],
+button[disabled],
+.mint-btn[disabled],
+:root:root [disabled][amplify-button],
+[disabled].mint-select,
+.mint-btn-icon[disabled],
+.mint-pill[disabled] {
+  filter: grayscale(1) brightness(0.75) !important;
+  pointer-events: none !important;
+}
+a[disabled].mint-fall-in:not(.mint-show),
+button[disabled].mint-fall-in:not(.mint-show),
+.mint-btn[disabled].mint-fall-in:not(.mint-show),
+:root:root [disabled].mint-fall-in[amplify-button]:not(.mint-show),
+[disabled].mint-fall-in.mint-select:not(.mint-show),
+.mint-btn-icon[disabled].mint-fall-in:not(.mint-show),
+.mint-pill[disabled].mint-fall-in:not(.mint-show) {
+  filter: grayscale(1) brightness(0.75) opacity(0%) !important;
+}
+a i:first-child,
+button i:first-child,
+.mint-btn i:first-child,
+:root:root [amplify-button] i:first-child,
+.mint-select i:first-child,
+.mint-btn-icon i:first-child,
+.mint-pill i:first-child {
+  margin-right: 0.5em;
+}
+a i:last-child,
+button i:last-child,
+.mint-btn i:last-child,
+:root:root [amplify-button] i:last-child,
+.mint-select i:last-child,
+.mint-btn-icon i:last-child,
+.mint-pill i:last-child {
+  margin-left: 0.5em;
+}
+a i:only-child,
+button i:only-child,
+.mint-btn i:only-child,
+:root:root [amplify-button] i:only-child,
+.mint-select i:only-child,
+.mint-btn-icon i:only-child,
+.mint-pill i:only-child {
+  margin: 0;
+}
+
+.mint-btn, :root:root [amplify-button], .mint-select,
+.mint-pill,
+.mint-btn-group,
+.mint-btn-icon {
+  flex-shrink: 0;
+}
+
+.mint-btn, :root:root [amplify-button], .mint-select,
+.mint-btn-group {
+  border-radius: var(--mint-btn-br);
+}
+
+.mint-btn, :root:root [amplify-button], .mint-select,
+.mint-pill,
+.mint-btn-icon {
+  width: fit-content;
+  max-width: 100%;
+  text-decoration: none;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+  user-select: none;
+  transition-property: color, background-color, border-color;
+  transition-duration: ms(300);
+}
+
+.mint-btn, :root:root [amplify-button], .mint-select,
+.mint-pill,
+.mint-btn-group {
+  display: inline-block;
+  color: var(--mint-btn-fg);
+  background: var(--mint-btn-bg);
+  border: var(--mint-btn-bw) solid var(--mint-btn-bc);
+  text-align: center;
+}
+@media (min-width: 480px) {
+  .mint-btn, :root:root [amplify-button], .mint-select,
+  .mint-pill,
+  .mint-btn-group {
+    width: fit-content;
+  }
+}
+.mint-btn:hover, :root:root [amplify-button]:hover, .mint-select:hover, .mint-pill:hover, .mint-btn-group:hover .mint-btn:focus-visible, :root:root .mint-btn-group:hover [amplify-button]:focus-visible, .mint-btn-group:hover .mint-select:focus-visible, .mint-pill:focus-visible, .mint-btn-group:focus-visible .mint-btn:active, :root:root .mint-btn-group:focus-visible [amplify-button]:active, .mint-btn-group:focus-visible .mint-select:active, .mint-pill:active, .mint-btn-group:active .mint-btn.mint-active, :root:root .mint-btn-group:active .mint-active[amplify-button], .mint-btn-group:active .mint-active.mint-select, .mint-pill.mint-active, .mint-btn-group.mint-active {
+  color: var(--mint-btn-fg-hover);
+  background: var(--mint-btn-bg-hover);
+}
+.mint-btn:hover i, :root:root [amplify-button]:hover i, .mint-select:hover i, .mint-pill:hover i, .mint-btn-group:hover .mint-btn:focus-visible i, :root:root .mint-btn-group:hover [amplify-button]:focus-visible i, .mint-btn-group:hover .mint-select:focus-visible i, .mint-pill:focus-visible i, .mint-btn-group:focus-visible .mint-btn:active i, :root:root .mint-btn-group:focus-visible [amplify-button]:active i, .mint-btn-group:focus-visible .mint-select:active i, .mint-pill:active i, .mint-btn-group:active .mint-btn.mint-active i, :root:root .mint-btn-group:active .mint-active[amplify-button] i, .mint-btn-group:active .mint-active.mint-select i, .mint-pill.mint-active i, .mint-btn-group.mint-active i {
+  color: inherit !important;
+}
+
+.mint-btn.mint-reverse, :root:root .mint-reverse[amplify-button], .mint-reverse.mint-select,
+.mint-pill.mint-reverse,
+.mint-btn-group.mint-reverse {
+  color: var(--mint-btn-fg-hover);
+  background: var(--mint-btn-bg-hover);
+}
+.mint-btn.mint-reverse:hover, :root:root .mint-reverse[amplify-button]:hover, .mint-reverse.mint-select:hover, .mint-pill.mint-reverse:hover, .mint-btn-group.mint-reverse:hover .mint-btn.mint-reverse:focus-visible, :root:root .mint-btn-group.mint-reverse:hover .mint-reverse[amplify-button]:focus-visible, .mint-btn-group.mint-reverse:hover .mint-reverse.mint-select:focus-visible, .mint-pill.mint-reverse:focus-visible, .mint-btn-group.mint-reverse:focus-visible .mint-btn.mint-reverse:active, :root:root .mint-btn-group.mint-reverse:focus-visible .mint-reverse[amplify-button]:active, .mint-btn-group.mint-reverse:focus-visible .mint-reverse.mint-select:active, .mint-pill.mint-reverse:active, .mint-btn-group.mint-reverse:active .mint-btn.mint-reverse.mint-active, :root:root .mint-btn-group.mint-reverse:active .mint-reverse.mint-active[amplify-button], .mint-btn-group.mint-reverse:active .mint-reverse.mint-active.mint-select, .mint-pill.mint-reverse.mint-active, .mint-btn-group.mint-reverse.mint-active {
+  color: var(--mint-btn-fg);
+  background: var(--mint-btn-bg);
+}
+
+.mint-btn.mint-alt, :root:root .mint-alt[amplify-button], .mint-alt.mint-select,
+.mint-pill.mint-alt,
+.mint-btn-group.mint-alt {
+  color: var(--mint-btn-fg-alt);
+  background: var(--mint-btn-bg-alt);
+}
+.mint-btn.mint-alt:hover, :root:root .mint-alt[amplify-button]:hover, .mint-alt.mint-select:hover, .mint-pill.mint-alt:hover, .mint-btn-group.mint-alt:hover .mint-btn.mint-alt:focus-visible, :root:root .mint-btn-group.mint-alt:hover .mint-alt[amplify-button]:focus-visible, .mint-btn-group.mint-alt:hover .mint-alt.mint-select:focus-visible, .mint-pill.mint-alt:focus-visible, .mint-btn-group.mint-alt:focus-visible .mint-btn.mint-alt:active, :root:root .mint-btn-group.mint-alt:focus-visible .mint-alt[amplify-button]:active, .mint-btn-group.mint-alt:focus-visible .mint-alt.mint-select:active, .mint-pill.mint-alt:active, .mint-btn-group.mint-alt:active .mint-btn.mint-alt.mint-active, :root:root .mint-btn-group.mint-alt:active .mint-alt.mint-active[amplify-button], .mint-btn-group.mint-alt:active .mint-alt.mint-active.mint-select, .mint-pill.mint-alt.mint-active, .mint-btn-group.mint-alt.mint-active {
+  color: var(--mint-btn-fg-alt-hover);
+  background: var(--mint-btn-bg-alt-hover);
+  border-color: var(--mint-btn-bg-alt-hover);
+}
+
+.mint-btn.mint-alt.mint-reverse, :root:root .mint-alt.mint-reverse[amplify-button], .mint-alt.mint-reverse.mint-select,
+.mint-pill.mint-alt.mint-reverse,
+.mint-btn-group.mint-alt.mint-reverse {
+  color: var(--mint-btn-fg-alt-hover);
+  background: var(--mint-btn-bg-alt-hover);
+  border-color: var(--mint-btn-bg-alt-hover);
+}
+.mint-btn.mint-alt.mint-reverse:hover, :root:root .mint-alt.mint-reverse[amplify-button]:hover, .mint-alt.mint-reverse.mint-select:hover, .mint-pill.mint-alt.mint-reverse:hover, .mint-btn-group.mint-alt.mint-reverse:hover .mint-btn.mint-alt.mint-reverse:focus-visible, :root:root .mint-btn-group.mint-alt.mint-reverse:hover .mint-alt.mint-reverse[amplify-button]:focus-visible, .mint-btn-group.mint-alt.mint-reverse:hover .mint-alt.mint-reverse.mint-select:focus-visible, .mint-pill.mint-alt.mint-reverse:focus-visible, .mint-btn-group.mint-alt.mint-reverse:focus-visible .mint-btn.mint-alt.mint-reverse:active, :root:root .mint-btn-group.mint-alt.mint-reverse:focus-visible .mint-alt.mint-reverse[amplify-button]:active, .mint-btn-group.mint-alt.mint-reverse:focus-visible .mint-alt.mint-reverse.mint-select:active, .mint-pill.mint-alt.mint-reverse:active, .mint-btn-group.mint-alt.mint-reverse:active .mint-btn.mint-alt.mint-reverse.mint-active, :root:root .mint-btn-group.mint-alt.mint-reverse:active .mint-alt.mint-reverse.mint-active[amplify-button], .mint-btn-group.mint-alt.mint-reverse:active .mint-alt.mint-reverse.mint-active.mint-select, .mint-pill.mint-alt.mint-reverse.mint-active, .mint-btn-group.mint-alt.mint-reverse.mint-active {
+  color: var(--mint-btn-bc);
+  background: var(--mint-btn-bg-alt);
+  border-color: var(--mint-btn-bg-alt);
+}
+
+.mint-btn a, :root:root [amplify-button] a, .mint-select a,
+.mint-pill a,
+.mint-btn-group a {
+  color: inherit;
+}
+.mint-btn a:hover, :root:root [amplify-button] a:hover, .mint-select a:hover,
+.mint-pill a:hover,
+.mint-btn-group a:hover {
+  color: inherit;
+}
+.mint-btn a i, :root:root [amplify-button] a i, .mint-select a i,
+.mint-pill a i,
+.mint-btn-group a i {
+  display: none;
+}
+
+.mint-btn, :root:root [amplify-button], .mint-select {
+  padding: var(--mint-btn-pv) var(--mint-btn-ph);
+  cursor: pointer;
+}
+.mint-btn-icon {
+  display: block;
+  text-align: center;
+  background: none;
+  border: none;
+}
+.mint-btn-icon:hover .mint-btn-icon:focus-visible .mint-btn-icon:active .mint-btn-icon.mint-active i {
+  color: var(--mint-btn-bg-alt-hover);
+}
+
+@media (min-width: 480px) {
+  .mint-btn-icon {
+    display: inline-block;
+  }
+}
+.mint-btn-icon.mint-lg i {
+  font-size: 4rem;
+}
+.mint-btn-icon i {
+  display: inline-flex;
+  align-items: center;
+  margin: 0 !important;
+  color: var(--mint-btn-bc);
+  font-size: 1.5rem;
+}
+.mint-btn-icon i::before {
+  transition: color ms(300);
+  padding: 2px;
+}
+.mint-btn-group {
+  display: flex;
+  width: fit-content;
+  max-width: 100%;
+  margin: auto;
+  padding: 0;
+  overflow: visible;
+  transition: all ms(300);
+}
+.mint-btn-group > *:first-child, .mint-btn-group > *:first-child button {
+  padding: var(--mint-btn-pv) 0 var(--mint-btn-pv) var(--mint-btn-ph);
+  border-top-left-radius: var(--mint-btn-br);
+  border-bottom-left-radius: var(--mint-btn-br);
+}
+.mint-btn-group > *:last-child, .mint-btn-group > *:last-child button {
+  padding: var(--mint-btn-pv) var(--mint-btn-ph) var(--mint-btn-pv) 0;
+  border-top-right-radius: var(--mint-btn-br);
+  border-bottom-right-radius: var(--mint-btn-br);
+}
+.mint-btn-group button {
+  width: 100%;
+  border: none;
+  color: inherit;
+  background: transparent;
+}
+.mint-btn-submit.mint-success[disabled] {
+  filter: none !important;
+}
+
+.mint-pill {
+  padding: var(--mint-pill-pv) var(--mint-pill-ph);
+  border-radius: var(--mint-pill-br);
+  line-height: 2;
+}
+
+a.mint-pill, button.mint-pill {
+  min-width: 5rem;
+}
+
+p .mint-pill, p .mint-btn, :root:root p [amplify-button], p .mint-select {
+  line-height: 1.5rem;
+  vertical-align: middle;
+}
+
+.mint-buttons {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-wrap: wrap;
+  gap: 1rem;
+  overflow: hidden;
+}
+@media (min-width: 480px) {
+  .mint-buttons {
+    justify-content: flex-start;
+  }
+}
+.mint-buttons > * {
+  width: 100%;
+}
+.mint-buttons > * .mint-btn, :root:root .mint-buttons > * [amplify-button], .mint-buttons > * .mint-select, .mint-buttons > * .mint-pill {
+  display: block;
+}
+@media (min-width: 480px) {
+  .mint-buttons > * {
+    width: auto;
+  }
+}
+.mint-buttons .mint-buttons .mint-pill {
+  width: 100%;
+}
+
+@media (min-width: 480px) {
+  .mint-grid.mint-3 .mint-buttons > *,
+  .mint-grid.mint-4 .mint-buttons > * {
+    width: 100%;
+    margin: 0.5rem 0;
+  }
+}
+
+:root {
+  --mint-card-p: calc(var(--mint-gap) * 8);
+  --mint-card-logo-s: 4rem;
+  --mint-card-r: var(--mint-br);
+  --mint-card-shadow-s: var(--mint-shadow-s);
+  --mint-card-shadow-c: var(--mint-shadow-c);
+  --mint-card-bg: var(--mint-c-bg-3);
+}
+
+.mint-theme-dark {
+  --mint-card-bg: var(--mint-c-bg-5);
+}
+
+.mint-card, :root:root [data-amplify-authenticator] [data-amplify-container] {
+  display: flex;
+  flex-direction: column;
+  position: relative;
+  height: 100%;
+  max-width: 100%;
+  margin: 0;
+  border-radius: var(--mint-card-r);
+  box-shadow: var(--mint-card-shadow-s) var(--mint-card-shadow-c);
+}
+@media (min-width: 768px) {
+  .mint-card, :root:root [data-amplify-authenticator] [data-amplify-container] {
+    flex-direction: row;
+  }
+  .mint-card.mint-reverse, :root:root [data-amplify-authenticator] .mint-reverse[data-amplify-container] {
+    flex-direction: row-reverse;
+  }
+}
+.mint-card:has(.mint-carousel), :root:root [data-amplify-authenticator] [data-amplify-container]:has(.mint-carousel) {
+  box-shadow: none;
+}
+.mint-card:has(.mint-carousel) .mint-content, :root:root [data-amplify-authenticator] [data-amplify-container]:has(.mint-carousel) .mint-content, :root:root .mint-card:has(.mint-carousel) [data-amplify-authenticator] [data-amplify-container] [data-amplify-router], :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card:has(.mint-carousel) [data-amplify-router], :root:root [data-amplify-authenticator] [data-amplify-container]:has(.mint-carousel) [data-amplify-router] {
+  box-shadow: var(--mint-card-shadow-s) var(--mint-card-shadow-c);
+}
+.mint-card.mint-center .mint-title, :root:root [data-amplify-authenticator] .mint-center[data-amplify-container] .mint-title {
+  justify-content: center;
+  text-align: center;
+}
+.mint-card.mint-center .mint-title > div, :root:root [data-amplify-authenticator] .mint-center[data-amplify-container] .mint-title > div {
+  width: auto;
+}
+.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] > * {
+  text-align: center;
+}
+.mint-card.mint-center .mint-buttons, :root:root [data-amplify-authenticator] .mint-center[data-amplify-container] .mint-buttons {
+  justify-content: center;
+}
+.mint-card.mint-center-title .mint-title, :root:root [data-amplify-authenticator] .mint-center-title[data-amplify-container] .mint-title {
+  justify-content: center;
+  text-align: center;
+}
+.mint-card.mint-center-title .mint-title > div, :root:root [data-amplify-authenticator] .mint-center-title[data-amplify-container] .mint-title > div {
+  width: auto;
+}
+.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] > * {
+  text-align: center;
+}
+.mint-card.mint-center-btns .mint-buttons, :root:root [data-amplify-authenticator] .mint-center-btns[data-amplify-container] .mint-buttons {
+  justify-content: center;
+}
+.mint-card.mint-stagger, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] {
+  position: relative;
+  width: 100%;
+}
+@media (min-width: 768px) {
+  .mint-card.mint-stagger, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] {
+    flex-direction: row;
+    border-radius: 0;
+    box-shadow: none;
+    overflow: visible;
+  }
+  .mint-card.mint-stagger > .mint-image, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] > .mint-image {
+    width: calc(50% + var(--mint-card-p));
+    height: fit-content;
+    margin-right: calc(var(--mint-card-p) * -2);
+    border-radius: var(--mint-card-r);
+  }
+  .mint-card.mint-stagger > .mint-image img, :root:root [data-amplify-authenticator] .mint-stagger[data-amplify-container] > .mint-image img {
+    height: 100%;
+    object-fit: cover;
+  }
+  .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] {
+    height: fit-content;
+    width: calc(50% + var(--mint-card-p));
+    margin-top: calc(2 * var(--mint-card-p));
+    border-radius: var(--mint-card-r);
+    box-shadow: var(--mint-card-shadow-s) var(--mint-card-shadow-c);
+  }
+}
+@media (min-width: 768px) {
+  .mint-card.mint-stagger.mint-reverse, :root:root [data-amplify-authenticator] .mint-stagger.mint-reverse[data-amplify-container] {
+    flex-direction: row-reverse;
+  }
+  .mint-card.mint-stagger.mint-reverse > .mint-image, :root:root [data-amplify-authenticator] .mint-stagger.mint-reverse[data-amplify-container] > .mint-image {
+    margin-right: 0;
+    margin-left: calc(var(--mint-card-p) * -2);
+  }
+}
+.mint-card > .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] > .mint-image {
+  overflow: hidden;
+}
+@media (min-width: 768px) {
+  .mint-card > .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] > .mint-image {
+    width: 50%;
+  }
+}
+.mint-card > .mint-image:only-child, :root:root [data-amplify-authenticator] [data-amplify-container] > .mint-image:only-child {
+  width: 100%;
+}
+@media (min-width: 768px) {
+  .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] {
+    width: 50%;
+  }
+}
+.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] {
+  display: flex;
+  flex-direction: column;
+  gap: calc(var(--mint-gap) * 2);
+  position: relative;
+  padding: var(--mint-card-p);
+  background: var(--mint-card-bg);
+  width: 100%;
+  overflow: hidden;
+}
+.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] > * {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.mint-card .mint-title, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  height: fit-content;
+  gap: var(--mint-card-p);
+  text-align: center;
+  width: 100%;
+}
+@media (min-width: 480px) {
+  .mint-card .mint-title, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title {
+    flex-direction: row;
+    text-align: left;
+  }
+}
+.mint-card .mint-title:only-child, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title:only-child {
+  height: 100%;
+}
+.mint-card .mint-title > .mint-image, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > .mint-image {
+  width: 100%;
+  height: 100%;
+  max-width: var(--mint-card-logo-s);
+  max-height: var(--mint-card-logo-s);
+}
+.mint-card .mint-title > .mint-image.mint-large, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > .mint-image.mint-large {
+  max-width: calc(2 * var(--mint-card-logo-s));
+  max-height: calc(2 * var(--mint-card-logo-s));
+}
+.mint-card .mint-title > .mint-image img, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > .mint-image img {
+  display: block;
+  width: 100%;
+  height: 100%;
+  object-fit: contain;
+}
+.mint-card .mint-title i, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title i {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-width: var(--mint-card-logo-s);
+  max-width: var(--mint-card-logo-s);
+  margin: 0;
+  font-size: calc(var(--mint-card-logo-s) - 1rem);
+}
+.mint-card .mint-title > div, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > div {
+  width: 100%;
+}
+.mint-card .mint-title > div > *, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-title > div > * {
+  margin: 0;
+}
+.mint-card .mint-date, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-date {
+  text-align: center;
+}
+@media (min-width: 480px) {
+  .mint-card .mint-date, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-date {
+    text-align: left;
+  }
+}
+.mint-card-grid {
+  position: relative;
+  background: var(--mint-card-bg);
+}
+.mint-card-grid:has(.mint-image) .mint-content, :root:root .mint-card-grid:has(.mint-image) [data-amplify-authenticator] [data-amplify-container] [data-amplify-router], :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card-grid:has(.mint-image) [data-amplify-router] {
+  margin-top: 25%;
+  padding-top: 25%;
+  background: none;
+  border: none;
+}
+.mint-card-grid:has(.mint-image) .mint-content::before, :root:root .mint-card-grid:has(.mint-image) [data-amplify-authenticator] [data-amplify-container] [data-amplify-router]::before, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card-grid:has(.mint-image) [data-amplify-router]::before {
+  opacity: 0;
+}
+.mint-card-grid:has(.mint-image) .mint-content::after, :root:root .mint-card-grid:has(.mint-image) [data-amplify-authenticator] [data-amplify-container] [data-amplify-router]::after, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card-grid:has(.mint-image) [data-amplify-router]::after {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  opacity: 0.75;
+  mask-image: none;
+  background: linear-gradient(0deg, black, rgba(0, 0, 0, 0.7) 66%, var(--mint-shadow-0));
+  transition: opacity ms(300) ease-in-out;
+  z-index: -1;
+}
+.mint-card-grid:hover .mint-content::after, :root:root .mint-card-grid:hover [data-amplify-authenticator] [data-amplify-container] [data-amplify-router]::after, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card-grid:hover [data-amplify-router]::after {
+  opacity: 1;
+}
+
+.mint-card-grid .mint-image {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+.mint-card-grid .mint-image img {
+  height: 100%;
+  object-fit: contain;
+  object-position: top;
+}
+.mint-card-grid .mint-content, :root:root .mint-card-grid [data-amplify-authenticator] [data-amplify-container] [data-amplify-router], :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card-grid [data-amplify-router] {
+  justify-content: flex-end;
+  background: var(--mint-shadow-0);
+}
+.mint-card-grid .mint-content .mint-buttons, :root:root .mint-card-grid [data-amplify-authenticator] [data-amplify-container] [data-amplify-router] .mint-buttons, :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card-grid [data-amplify-router] .mint-buttons {
+  margin-top: 0 !important;
+}
+.mint-card-actions .mint-content, :root:root .mint-card-actions [data-amplify-authenticator] [data-amplify-container] [data-amplify-router], :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card-actions [data-amplify-router] {
+  flex-direction: row;
+  justify-content: space-between;
+}
+
+.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],
+.mint-grid.mint-4 .mint-card,
+:root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container],
+:root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] {
+  flex-direction: column !important;
+}
+.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-4 .mint-card > .mint-image,
+:root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > .mint-image,
+:root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image {
+  overflow: hidden;
+}
+@media (min-width: 768px) {
+  .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-4 .mint-card > .mint-image,
+  :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > .mint-image,
+  :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image {
+    width: 100%;
+  }
+}
+@media (min-width: 768px) {
+  .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-4 .mint-card > .mint-image + .mint-content,
+  :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > .mint-image + .mint-content,
+  :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image + .mint-content,
+  :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] .mint-card > .mint-image + [data-amplify-router],
+  :root:root [data-amplify-authenticator] [data-amplify-container] .mint-grid.mint-4 .mint-card > .mint-image + [data-amplify-router],
+  :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] > .mint-image + [data-amplify-router],
+  :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] > .mint-image + [data-amplify-router] {
+    width: 100%;
+  }
+}
+.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],
+.mint-grid.mint-4 .mint-card .mint-content,
+:root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] .mint-content,
+:root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] .mint-content,
+:root:root [data-amplify-authenticator] [data-amplify-container] .mint-grid.mint-4 .mint-card [data-amplify-router],
+:root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] [data-amplify-router],
+:root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] [data-amplify-router] {
+  flex-grow: 1;
+}
+@media (min-width: 480px) {
+  .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,
+  .mint-grid.mint-4 .mint-card .mint-title,
+  :root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] .mint-title,
+  :root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] .mint-title {
+    flex-direction: column;
+  }
+}
+.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,
+.mint-grid.mint-4 .mint-card .mint-buttons,
+:root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] .mint-buttons,
+:root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] .mint-buttons {
+  margin-top: auto;
+}
+.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],
+.mint-grid.mint-4 .mint-card .mint-buttons .mint-btn,
+:root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] .mint-buttons .mint-btn,
+:root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] .mint-buttons .mint-btn,
+:root:root .mint-grid.mint-4 .mint-card .mint-buttons [amplify-button],
+:root:root .mint-grid.mint-4 [data-amplify-authenticator] [data-amplify-container] .mint-buttons [amplify-button],
+:root:root [data-amplify-authenticator] .mint-grid.mint-4 [data-amplify-container] .mint-buttons [amplify-button] {
+  width: 100%;
+}
+
+:root:root {
+  --amplify-colors-background-error: var(--mint-c-glow-0);
+  --amplify-colors-border-primary: var(--mint-c-brand-5);
+  --amplify-colors-border-focus: var(--mint-c-brand-4);
+  --amplify-colors-font-hover: var(--mint-c-brand-3);
+  --amplify-colors-font-interactive: var(--mint-c-brand-5);
+  --amplify-colors-font-primary: var(--mint-c-fg);
+  --amplify-colors-font-secondary: var(--mint-c-brand-6);
+  --amplify-colors-font-error: var(--mint-c-danger-5);
+  --amplify-colors-font-warning: var(--mint-c-warning-5);
+  --amplify-colors-font-success: var(--mint-c-success-5);
+  --amplify-colors-font-info: var(--mint-c-info-5);
+  --amplify-components-fieldcontrol-color: var(--amplify-colors-font-primary);
+  --amplify-border-widths-small: var(--mint-bw);
+}
+:root:root [amplify-button] {
+  margin: auto;
+}
+:root:root .amplify-icon {
+  display: block;
+}
+
+/*# sourceMappingURL=amplify.css.map */

package/dist/amplify.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../src/components/ui/button.scss","../src/util/selector.scss","../src/util/break.scss","../src/components/widget/card.scss","../src/modules/amplify.scss"],"names":[],"mappings":"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","file":"amplify.css"}