@appartmint/mint 2.7.8 → 2.7.10

package/dist/css/mint.css

@@ -631,61 +631,13 @@ body.mint-fixed #mint-header {
   align-items: flex-end;
   justify-content: center;
   flex-direction: row;
-  min-height: calc(100vh - var(--mint-header-height) + 10rem);
   gap: 2rem;
   position: relative;
-}
-.mint-section-full {
-  top: -4px;
-}
-@media (min-width: 480px) {
-  .mint-section-full {
-    top: calc(-4px + -12 * (100vw - 480px) / 288);
-  }
-}
-@media (min-width: 768px) {
-  .mint-section-full {
-    top: -16px;
-  }
-}
-.mint-section-full {
-  left: -4px;
-}
-@media (min-width: 480px) {
-  .mint-section-full {
-    left: calc(-4px + -12 * (100vw - 480px) / 288);
-  }
-}
-@media (min-width: 768px) {
-  .mint-section-full {
-    left: -16px;
-  }
-}
-.mint-section-full {
-  width: calc(100% + 8px);
-}
-@media (min-width: 480px) {
-  .mint-section-full {
-    width: calc(100% + 8px + 24 * (100vw - 480px) / 288);
-  }
-}
-@media (min-width: 768px) {
-  .mint-section-full {
-    width: calc(100% + 32px);
-  }
-}
-.mint-section-full {
-  padding: 4px;
-}
-@media (min-width: 480px) {
-  .mint-section-full {
-    padding: calc(4px + 12 * (100vw - 480px) / 288);
-  }
-}
-@media (min-width: 768px) {
-  .mint-section-full {
-    padding: 16px;
-  }
+  top: clamp(-0.25rem, -1vw, -2rem);
+  left: clamp(-0.25rem, -1vw, -2rem);
+  width: clamp(100% + 0.5rem, 100% + 2vw, 100% + 4rem);
+  min-height: calc(100vh - var(--mint-header-height) + 10rem);
+  padding: clamp(0.25rem, 1vw, 2rem);
 }
 .mint-section-full iframe, .mint-section-full video, .mint-section-full .mint-image, .mint-section-full .mint-embed {
   position: absolute;
@@ -711,43 +663,9 @@ body.mint-fixed #mint-header {
 }
 
 .mint-landing {
-  top: -4px;
-}
-@media (min-width: 480px) {
-  .mint-landing {
-    top: calc(-4px + -12 * (100vw - 480px) / 288);
-  }
-}
-@media (min-width: 768px) {
-  .mint-landing {
-    top: -16px;
-  }
-}
-.mint-landing {
-  left: -4px;
-}
-@media (min-width: 480px) {
-  .mint-landing {
-    left: calc(-4px + -12 * (100vw - 480px) / 288);
-  }
-}
-@media (min-width: 768px) {
-  .mint-landing {
-    left: -16px;
-  }
-}
-.mint-landing {
-  width: calc(100% + 8px);
-}
-@media (min-width: 480px) {
-  .mint-landing {
-    width: calc(100% + 8px + 24 * (100vw - 480px) / 288);
-  }
-}
-@media (min-width: 768px) {
-  .mint-landing {
-    width: calc(100% + 32px);
-  }
+  top: clamp(-0.25rem, -1vw, -2rem);
+  left: clamp(-0.25rem, -1vw, -2rem);
+  width: clamp(100% + 0.5rem, 100% + 2vw, 100% + 4rem);
 }
 .mint-landing .mint-border, .mint-landing .mint-frame {
   border: none;
@@ -760,19 +678,7 @@ body.mint-fixed #mint-header {
   width: 100%;
   margin: 0;
   min-height: calc(100vh - var(--mint-header-height));
-}
-.mint-landing .mint-section-full {
-  padding: 16px;
-}
-@media (min-width: 480px) {
-  .mint-landing .mint-section-full {
-    padding: calc(16px + 48 * (100vw - 480px) / 288);
-  }
-}
-@media (min-width: 768px) {
-  .mint-landing .mint-section-full {
-    padding: 64px;
-  }
+  padding: clamp(0.25rem, 1vw, 2rem);
 }
 .mint-landing .mint-section-full iframe, .mint-landing .mint-section-full video {
   position: absolute;
@@ -1542,20 +1448,7 @@ app-root {
   justify-content: center;
   flex-grow: 1;
   width: 100%;
-  padding: 0.25rem;
-}
-:root main > router-outlet + * {
-  padding: 4px;
-}
-@media (min-width: 480px) {
-  :root main > router-outlet + * {
-    padding: calc(4px + 12 * (100vw - 480px) / 288);
-  }
-}
-@media (min-width: 768px) {
-  :root main > router-outlet + * {
-    padding: 16px;
-  }
+  padding: clamp(0.25rem, 1vw, 2rem);
 }
 :root main > router-outlet + * + :not(mint-partial-footer) {
   height: 0;
@@ -1777,22 +1670,11 @@ main {
   width: 100%;
   min-height: calc(100vh - var(--mint-header-height));
   min-height: calc(100dvh - var(--mint-header-height));
+  padding-left: clamp(0.25rem, 1vw, 2rem);
+  padding-right: clamp(0.25rem, 1vw, 2rem);
   overflow: hidden;
   z-index: 999;
 }
-main {
-  padding: 4px;
-}
-@media (min-width: 480px) {
-  main {
-    padding: calc(4px + 12 * (100vw - 480px) / 288);
-  }
-}
-@media (min-width: 768px) {
-  main {
-    padding: 16px;
-  }
-}
 
 nav a {
   display: block;
@@ -3790,12 +3672,12 @@ a.mint-active .fa-vimeo {
   --amplify-colors-font-hover: var(--mint-brand-3);
   --amplify-colors-font-interactive: var(--mint-brand-5);
   --amplify-colors-font-primary: var(--mint-fore);
-  --amplify-components-fieldcontrol-color: var(--amplify-colors-font-primary);
   --amplify-colors-font-secondary: var(--mint-brand-6);
   --amplify-colors-font-error: var(--mint-danger-5);
   --amplify-colors-font-warning: var(--mint-warning);
   --amplify-colors-font-success: var(--mint-success);
   --amplify-colors-font-info: var(--mint-info);
+  --amplify-components-fieldcontrol-color: var(--amplify-colors-font-primary);
   --amplify-border-widths-small: 0.125rem;
 }
 :root:root [amplify-button] {