@gem-sdk/styles 1.0.0

package/README.md

@@ -0,0 +1 @@
+# CSS Utility

package/dist/base.css

@@ -0,0 +1,90 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+@layer base {
+  html {
+    -webkit-tap-highlight-color: transparent;
+  }
+  a {
+    @apply text-g-brand underline;
+  }
+}
+@layer components {
+  #__next {
+    height: 100%;
+  }
+
+  .wrapper {
+    width: 100%;
+    padding-left: var(--g-ct-p);
+    padding-right: var(--g-ct-p);
+    margin-left: auto;
+    margin-right: auto;
+    max-width: var(--g-ct-w, 1200px);
+  }
+
+  .gem-slider:not([data-keen-slider-disabled]) {
+    align-content: flex-start;
+    display: flex;
+    overflow: hidden;
+    position: relative;
+    -webkit-user-select: none;
+            user-select: none;
+    -webkit-touch-callout: none;
+    -khtml-user-select: none;
+    touch-action: pan-y;
+    -webkit-tap-highlight-color: transparent;
+    width: 100%;
+  }
+
+    .gem-slider:not([data-keen-slider-disabled]) .gem-slider-item {
+      position: relative;
+      overflow: hidden;
+      width: 100%;
+      min-height: 100%;
+    }
+
+    .gem-slider:not([data-keen-slider-disabled])[data-keen-slider-reverse] {
+      flex-direction: row-reverse;
+    }
+
+    .gem-slider:not([data-keen-slider-disabled])[data-keen-slider-v] {
+      flex-wrap: wrap;
+    }
+
+  [data-keen-slider-moves] * {
+    pointer-events: none;
+  }
+}
+@layer utilities {
+  .pb-safe {
+    padding-bottom: env(safe-area-inset-bottom);
+  }
+  .pt-safe {
+    padding-top: env(safe-area-inset-top);
+  }
+  .pl-safe {
+    padding-left: env(safe-area-inset-left);
+  }
+  .pr-safe {
+    padding-right: env(safe-area-inset-right);
+  }
+  .p-safe {
+    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom)
+      env(safe-area-inset-left);
+  }
+  .px-safe {
+    padding-left: env(safe-area-inset-left);
+    padding-right: env(safe-area-inset-right);
+  }
+  .py-safe {
+    padding-top: env(safe-area-inset-top);
+    padding-bottom: env(safe-area-inset-bottom);
+  }
+  .h-safe {
+    height: calc(100vh - (env(safe-area-inset-top) + env(safe-area-inset-bottom)));
+  }
+  .min-h-safe {
+    min-height: calc(100vh - (env(safe-area-inset-top) + env(safe-area-inset-bottom)));
+  }
+}

package/dist/base.min.css

@@ -0,0 +1 @@
+@tailwind base;@tailwind components;@tailwind utilities;@layer base{html{-webkit-tap-highlight-color:transparent}a{@apply text-g-brand underline}}@layer components{#__next{height:100%}.wrapper{margin-left:auto;margin-right:auto;max-width:var(--g-ct-w,1200px);padding-left:var(--g-ct-p);padding-right:var(--g-ct-p);width:100%}.gem-slider:not([data-keen-slider-disabled]){-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;align-content:flex-start;display:flex;overflow:hidden;position:relative;touch-action:pan-y;-webkit-user-select:none;user-select:none;-khtml-user-select:none;width:100%}.gem-slider:not([data-keen-slider-disabled]) .gem-slider-item{min-height:100%;overflow:hidden;position:relative;width:100%}.gem-slider:not([data-keen-slider-disabled])[data-keen-slider-reverse]{flex-direction:row-reverse}.gem-slider:not([data-keen-slider-disabled])[data-keen-slider-v]{flex-wrap:wrap}[data-keen-slider-moves] *{pointer-events:none}}@layer utilities{.pb-safe{padding-bottom:env(safe-area-inset-bottom)}.pt-safe{padding-top:env(safe-area-inset-top)}.pl-safe{padding-left:env(safe-area-inset-left)}.pr-safe{padding-right:env(safe-area-inset-right)}.p-safe{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.px-safe{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.py-safe{padding-bottom:env(safe-area-inset-bottom);padding-top:env(safe-area-inset-top)}.h-safe{height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom))}.min-h-safe{min-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom))}}

package/dist/builder.css

@@ -0,0 +1,102 @@
+[data-slot='children'] {
+  display: none;
+}
+
+.builder [data-slot='children'] {
+    position: relative;
+    width: 100%;
+    display: block;
+    height: 50px;
+    background: #f2f3f4;
+  }
+
+.builder [data-slot='children']:hover {
+      background: #e5e6e8;
+    }
+
+.builder [data-slot='children']:after {
+      content: 'Drop element here';
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      -webkit-transform: translate(-50%, -50%);
+              transform: translate(-50%, -50%);
+      text-align: center;
+      color: #aaa;
+      font-size: 14px;
+      font-weight: bold;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      display: -webkit-box;
+      -webkit-line-clamp: 2;
+      line-clamp: 2;
+      -webkit-box-orient: vertical;
+    }
+
+.builder [data-slot='children'] .drag-placeholder {
+      height: 100%;
+    }
+
+.drag-placeholder {
+  display: none;
+  width: 100%;
+}
+
+#storefront {
+  position: relative;
+  z-index: 20;
+}
+
+#visual-content {
+  display: none;
+  position: absolute;
+  z-index: 50;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+}
+
+#visual-content .fake-placeholder {
+    position: absolute;
+    top: 0px;
+    left: 0px;
+    z-index: 10;
+    background: transparent;
+  }
+
+#visual-content .fake-placeholder.fake-placeholder-slot {
+      background: transparent;
+    }
+
+#visual-content .fake-placeholder.has-section {
+      background-color: transparent !important;
+      border: none !important;
+
+      background-image: url('//d1um8515vdn9kb.cloudfront.net/images/background-pattern.png'),
+        linear-gradient(0deg, #fdb913, #fdb913);
+    }
+
+#visual-content .fake-placeholder.visual-placeholder {
+      z-index: 20;
+      border: 1px dashed #3c67ff;
+      border-radius: 3px;
+      background-color: #d8e1ff;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: #3c67ff;
+      font-weight: 500;
+      font-size: 14px;
+      line-height: 150%;
+    }
+
+#visual-content .fake-placeholder.visual-placeholder.visual-placeholder-error {
+        background-image: url('//d1um8515vdn9kb.cloudfront.net/images/background-pattern.png'),
+          linear-gradient(0deg, #f44336, #f44336);
+      }
+
+#visual-content .fake-placeholder.visual-placeholder-between-sections {
+      background-color: #3c67ff;
+      border: none;
+    }

package/dist/builder.min.css

@@ -0,0 +1 @@
+[data-slot=children]{display:none}.builder [data-slot=children]{background:#f2f3f4;display:block;height:50px;position:relative;width:100%}.builder [data-slot=children]:hover{background:#e5e6e8}.builder [data-slot=children]:after{-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;color:#aaa;content:"Drop element here";display:-webkit-box;font-size:14px;font-weight:700;left:50%;overflow:hidden;position:absolute;text-align:center;text-overflow:ellipsis;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.builder [data-slot=children] .drag-placeholder{height:100%}.drag-placeholder{display:none;width:100%}#storefront{position:relative;z-index:20}#visual-content{display:none;height:100%;left:0;position:absolute;top:0;width:100%;z-index:50}#visual-content .fake-placeholder{background:transparent;left:0;position:absolute;top:0;z-index:10}#visual-content .fake-placeholder.fake-placeholder-slot{background:transparent}#visual-content .fake-placeholder.has-section{background-color:transparent!important;background-image:url(//d1um8515vdn9kb.cloudfront.net/images/background-pattern.png),linear-gradient(0deg,#fdb913,#fdb913);border:none!important}#visual-content .fake-placeholder.visual-placeholder{align-items:center;background-color:#d8e1ff;border:1px dashed #3c67ff;border-radius:3px;color:#3c67ff;display:flex;font-size:14px;font-weight:500;justify-content:center;line-height:150%;z-index:20}#visual-content .fake-placeholder.visual-placeholder.visual-placeholder-error{background-image:url(//d1um8515vdn9kb.cloudfront.net/images/background-pattern.png),linear-gradient(0deg,#f44336,#f44336)}#visual-content .fake-placeholder.visual-placeholder-between-sections{background-color:#3c67ff;border:none}