@codenhub/styles 0.6.0 → 0.8.0

package/dist/tw/utilities/layout.css

@@ -1,130 +0,0 @@
-@utility view {
-  @apply flex gap-(--layout-gap);
-
-  &.vertical {
-    @apply flex-col;
-  }
-
-  &.horizontal {
-    @apply flex-row flex-wrap items-center;
-  }
-
-  &.tight {
-    --layout-gap: 0.5rem;
-  }
-
-  &.loose {
-    --layout-gap: 1.5rem;
-  }
-}
-
-@utility stack {
-  @apply flex flex-col gap-(--layout-gap);
-
-  &.tight {
-    --layout-gap: 0.5rem;
-  }
-
-  &.loose {
-    --layout-gap: 1.5rem;
-  }
-}
-
-@utility cluster {
-  @apply flex flex-wrap items-center gap-(--layout-gap);
-
-  &.between {
-    @apply justify-between;
-  }
-
-  &.tight {
-    --layout-gap: 0.5rem;
-  }
-
-  &.loose {
-    --layout-gap: 1.5rem;
-  }
-}
-
-@utility auto-grid {
-  @apply grid gap-(--layout-gap);
-
-  grid-template-columns: repeat(auto-fit, minmax(min(var(--layout-grid-min), 100%), 1fr));
-
-  &.tight {
-    --layout-gap: 0.5rem;
-  }
-
-  &.loose {
-    --layout-gap: 1.5rem;
-  }
-}
-
-@utility section {
-  @apply px-(--layout-gutter) py-(--layout-section-block);
-}
-
-@utility section-content {
-  @apply mx-auto w-full max-w-(--container-max);
-
-  &.narrow {
-    max-width: var(--container-narrow);
-  }
-
-  &.wide {
-    max-width: var(--container-wide);
-  }
-}
-
-/* An indicator: intent only, and no presentation token at all. A rule is a
-   line, and neither a fill class nor an edge class has anything to say about
-   one -- a container's `.ghost.edgeless` must not make every `<hr>` inside it
-   invisible. The width is the aesthetic's line width, unscaled. */
-@utility divider {
-  --divider-color: var(--intent-color);
-  --divider-width: var(--ui-border-width, var(--border-width));
-
-  @apply m-0 w-full border-0 border-t;
-
-  border-color: var(--divider-color);
-  border-top-width: var(--divider-width);
-  border-top-style: var(--ui-rule-style, var(--ui-line-style, solid));
-
-  &.vertical {
-    @apply h-auto w-0 self-stretch border-s border-t-0;
-
-    border-inline-start-width: var(--divider-width);
-    border-inline-start-style: var(--ui-rule-style, var(--ui-line-style, solid));
-  }
-}
-
-@utility selection-contrast {
-  &::selection,
-  & *::selection {
-    background: var(--color-primary-contrast);
-    color: var(--color-primary);
-  }
-}
-
-/* `.visually-hidden`, the standard clip-based recipe. Tailwind's `sr-only` does
-   nothing on the vanilla entries (`.`, `/native`), which compile real CSS from
-   a scan of `src/` alone with no Tailwind utility layer to reach, so the
-   package publishes its own.
-
-   It is not named `.sr-only`: on a `/tw` entry the consumer's own Tailwind
-   build supplies that utility, and two same-named utilities in one cascade
-   collide silently -- the collision `registry.test.ts` polices (see
-   `data-table`'s `renamedFrom` in `registry.json`). `@source
-   inline("visually-hidden")` in `utilities/index.css` force-emits it on the
-   entries with no scannable markup of their own. */
-@utility visually-hidden {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  padding: 0;
-  margin: -1px;
-  overflow: hidden;
-  clip: rect(0, 0, 0, 0);
-  white-space: nowrap;
-  border-width: 0;
-}