@cck-ui/core 0.8.1 → 0.10.0

package/styles.layer.css

@@ -906,6 +906,44 @@ fieldset:disabled .c-active:active {
     display: inline-flex;
   }
 
+.m_b03efeae {
+  --container-size-xs: calc(33.75rem * var(--c-scale));
+  --container-size-sm: calc(45rem * var(--c-scale));
+  --container-size-md: calc(60rem * var(--c-scale));
+  --container-size-lg: calc(71.25rem * var(--c-scale));
+  --container-size-xl: calc(82.5rem * var(--c-scale));
+  --container-size: var(--container-size-md);
+}
+
+  .m_b03efeae:where([data-strategy='block']) {
+    max-width: var(--container-size);
+    padding-inline: var(--c-spacing-md);
+    margin-inline: auto;
+  }
+
+  .m_b03efeae:where([data-strategy='block']):where([data-fluid]) {
+      max-width: 100%;
+    }
+
+  .m_b03efeae:where([data-strategy='grid']) {
+    display: grid;
+    grid-template-columns: 1fr min(100%, var(--container-size)) 1fr;
+    margin-inline: auto;
+  }
+
+  .m_b03efeae:where([data-strategy='grid']) > * {
+      grid-column: 2;
+    }
+
+  .m_b03efeae:where([data-strategy='grid']) > [data-breakout] {
+      grid-column: 1 / -1;
+    }
+
+  .m_b03efeae:where([data-strategy='grid']) > [data-breakout] > [data-container] {
+        max-width: var(--container-size);
+        margin-inline: auto;
+      }
+
 .m_c031daba {
   container: c-grid / inline-size;
 }
@@ -1092,6 +1130,9 @@ fieldset:disabled .c-active:active {
   grid-template-columns: repeat(auto-fit, minmax(var(--sg-min-col-width), 1fr));
 }
 
+.m_9b526549 {
+}
+
 .m_f6a13507 {
   display: flex;
   flex-direction: column;