@orangesk/cms-templates 1.0.0-beta.0 → 1.0.0-beta.10

package/build/shame.css

@@ -0,0 +1,128 @@
+@layer utilities {
+  .border-radius--none {
+    border-radius: 0;
+  }
+}
+@layer components {
+  .product-image {
+    position: relative;
+  }
+  .product-image__dots {
+    position: absolute;
+    top: 50%;
+    transform: translateY(-50%);
+    right: 2.5rem;
+    display: flex;
+    flex-direction: column;
+    gap: 0.625rem;
+  }
+  @media screen and (max-width: 1239.98px) {
+    .product-image__dots {
+      right: 1.25rem;
+    }
+  }
+  .product-image__dot {
+    width: 1.5rem;
+    height: 1.5rem;
+    border-radius: 50%;
+    border: 1px solid var(--color-border-subtle);
+  }
+  .product-image__dot--nickel {
+    background-color: #727272;
+  }
+  .product-image__dot--black {
+    background-color: #000000;
+  }
+  .product-image__dot--cerulean-blue {
+    background-color: #3a5fb9;
+  }
+  .product-image__dot--permanent-geranium-lake {
+    background-color: #ec3526;
+  }
+}
+.tiles .tile__body {
+  flex-direction: row;
+}
+@media screen and (min-width: 768px) {
+  .tiles .tile__body {
+    flex-direction: column;
+  }
+}
+@media screen and (max-width: 767.98px) {
+  .tiles__icon {
+    margin-right: 0.3125rem;
+  }
+}
+
+@layer components {
+  .plus-pill {
+    position: absolute;
+    right: -2rem;
+    z-index: 1;
+    top: 33%;
+    border-width: 1px !important;
+  }
+  @media screen and (max-width: 991.98px) {
+    .plus-pill {
+      right: -2.625rem;
+    }
+  }
+  @media screen and (max-width: 767.98px) {
+    .plus-pill {
+      right: -2.125rem;
+    }
+  }
+}
+@layer base {
+  h1[id],
+  h2[id],
+  h3[id],
+  h4[id],
+  h5[id],
+  h6[id] {
+    scroll-margin-top: 6.25rem;
+  }
+  @media screen and (max-width: 991.98px) {
+    h1[id],
+    h2[id],
+    h3[id],
+    h4[id],
+    h5[id],
+    h6[id] {
+      scroll-margin-top: 5rem;
+    }
+  }
+}
+@layer utilities {
+  .is-sticky {
+    position: sticky;
+    top: 6.25rem;
+  }
+  @media screen and (max-width: 991.98px) {
+    .is-sticky {
+      top: 5rem;
+    }
+  }
+}
+@layer base {
+  html {
+    scroll-behavior: smooth;
+  }
+  body {
+    overflow-x: clip;
+    font-size: 1.125rem;
+  }
+}
+@layer components {
+  .carousel__slide .card {
+    flex: 1;
+  }
+  li svg {
+    flex-shrink: 0;
+  }
+}
+@layer utilities {
+  .shrink-0 {
+    flex-shrink: 0;
+  }
+}