stillwind 0.0.0 → 0.1.0-rc.0

package/css/builtin-utilities/tw-flex-grid.css

@@ -0,0 +1,749 @@
+/* Built-in flex and grid utilities. */
+
+/* MARK: `order` */
+
+@stillwind-arbitrary-property order;
+
+@stillwind-utility order-first {
+  order: -9999;
+}
+
+@stillwind-utility order-last {
+  order: 9999;
+}
+
+@stillwind-utility order-* {
+  order: --value(--order-*, integer, [integer]);
+}
+
+@stillwind-utility order-* {
+  order: --value([integer]);
+}
+
+@stillwind-utility -order-* {
+  order: calc(--value(--order-*, integer) * -1);
+}
+
+/* MARK: `grid-column` */
+
+@stillwind-arbitrary-property grid-column;
+
+@stillwind-utility col-auto {
+  grid-column: auto;
+}
+
+@stillwind-utility col-* {
+  grid-column: --value(--grid-column-*, integer [1, ∞], [grid-line]);
+}
+
+@stillwind-utility -col-* {
+  grid-column: calc(--value(--grid-column-*, integer [1, ∞]) * -1);
+}
+
+@stillwind-utility col-span-full {
+  grid-column: 1 / -1;
+}
+
+@stillwind-utility col-span-* {
+  grid-column: span --value([integer]) / span --value([integer]);
+}
+
+@stillwind-utility col-span-* {
+  grid-column: span --value(integer [1, ∞]) / span --value(integer [1, ∞]);
+}
+
+@stillwind-arbitrary-property grid-column-start;
+
+@stillwind-utility col-start-auto {
+  grid-column-start: auto;
+}
+
+@stillwind-utility col-start-* {
+  grid-column-start: --value(--grid-column-start-*, integer [1, ∞], [integer]);
+}
+
+@stillwind-utility col-start-* {
+  grid-column-start: --value([grid-line]);
+}
+
+@stillwind-utility -col-start-* {
+  grid-column-start: calc(--value(--grid-column-start-*, integer [1, ∞]) * -1);
+}
+
+@stillwind-arbitrary-property grid-column-end;
+
+@stillwind-utility col-end-auto {
+  grid-column-end: auto;
+}
+
+@stillwind-utility col-end-* {
+  grid-column-end: --value(--grid-column-end-*, integer [1, ∞], [integer]);
+}
+
+@stillwind-utility col-end-* {
+  grid-column-end: --value([grid-line]);
+}
+
+@stillwind-utility -col-end-* {
+  grid-column-end: calc(--value(--grid-column-end-*, integer [1, ∞]) * -1);
+}
+
+/* MARK: `grid-row` */
+
+@stillwind-arbitrary-property grid-row;
+
+@stillwind-utility row-auto {
+  grid-row: auto;
+}
+
+@stillwind-utility row-* {
+  grid-row: --value(--grid-row-*, integer [1, ∞], [grid-line]);
+}
+
+@stillwind-utility -row-* {
+  grid-row: calc(--value(--grid-row-*, integer [1, ∞]) * -1);
+}
+
+@stillwind-utility row-span-full {
+  grid-row: 1 / -1;
+}
+
+@stillwind-utility row-span-* {
+  grid-row: span --value(integer [1, ∞]) / span --value(integer [1, ∞]);
+}
+
+@stillwind-utility row-span-* {
+  grid-row: span --value([integer]) / span --value([integer]);
+}
+
+@stillwind-arbitrary-property grid-row-start;
+
+@stillwind-utility row-start-auto {
+  grid-row-start: auto;
+}
+
+@stillwind-utility row-start-* {
+  grid-row-start: --value(--grid-row-start-*, integer [1, ∞], [integer]);
+}
+
+@stillwind-utility row-start-* {
+  grid-row-start: --value([grid-line]);
+}
+
+@stillwind-utility -row-start-* {
+  grid-row-start: calc(--value(--grid-row-start-*, integer [1, ∞]) * -1);
+}
+
+@stillwind-arbitrary-property grid-row-end;
+
+@stillwind-utility row-end-auto {
+  grid-row-end: auto;
+}
+
+@stillwind-utility row-end-* {
+  grid-row-end: --value(--grid-row-end-*, integer [1, ∞], [integer]);
+}
+
+@stillwind-utility row-end-* {
+  grid-row-end: --value([grid-line]);
+}
+
+@stillwind-utility -row-end-* {
+  grid-row-end: calc(--value(--grid-row-end-*, integer [1, ∞]) * -1);
+}
+
+/* MARK: `flex` */
+
+@stillwind-arbitrary-property flex;
+
+@stillwind-utility flex-1 {
+  flex: 1 1 0%;
+}
+
+@stillwind-utility flex-auto {
+  flex: auto;
+}
+
+@stillwind-utility flex-initial {
+  flex: 0 auto;
+}
+
+@stillwind-utility flex-none {
+  flex: none;
+}
+
+@stillwind-utility flex-* {
+  flex: --value(--fraction());
+}
+
+@stillwind-utility flex-* {
+  flex: --value(integer, [flex]);
+}
+
+@stillwind-arbitrary-property flex-shrink;
+
+@stillwind-utility shrink {
+  flex-shrink: 1;
+}
+
+@stillwind-utility shrink-0 {
+  flex-shrink: 0;
+}
+
+@stillwind-utility shrink-* {
+  flex-shrink: --value(number, [number]);
+}
+
+@stillwind-utility flex-shrink {
+  flex-shrink: 1;
+}
+
+@stillwind-utility flex-shrink-* {
+  flex-shrink: --value(number, [number]);
+}
+
+@stillwind-arbitrary-property flex-grow;
+
+@stillwind-utility grow {
+  flex-grow: 1;
+}
+
+@stillwind-utility grow-0 {
+  flex-grow: 0;
+}
+
+@stillwind-utility grow-* {
+  flex-grow: --value(number, [number]);
+}
+
+@stillwind-utility flex-grow {
+  flex-grow: 1;
+}
+
+@stillwind-utility flex-grow-* {
+  flex-grow: --value(number, [number]);
+}
+
+@stillwind-arbitrary-property flex-basis;
+
+@stillwind-utility basis-auto {
+  flex-basis: auto;
+}
+
+@stillwind-utility basis-full {
+  flex-basis: 100%;
+}
+
+@stillwind-utility basis-* {
+  flex-basis: --value(
+    --spacing-*,
+    --spacing(),
+    --container-*,
+    --fraction(),
+    auto,
+    --stillwind-builtin-width(),
+    [length-percentage]
+  );
+}
+
+@stillwind-utility basis-* {
+  flex-basis: --value(--spacing-*, --spacing(), [length-percentage]);
+}
+
+/* MARK: `grid-auto-columns`, `grid-auto-flow`, and `grid-auto-rows` */
+
+@stillwind-arbitrary-property grid-auto-columns;
+
+@stillwind-utility auto-cols-auto {
+  grid-auto-columns: auto;
+}
+
+@stillwind-utility auto-cols-fr {
+  grid-auto-columns: minmax(0, 1fr);
+}
+
+@stillwind-utility auto-cols-max {
+  grid-auto-columns: max-content;
+}
+
+@stillwind-utility auto-cols-min {
+  grid-auto-columns: min-content;
+}
+
+@stillwind-utility auto-cols-* {
+  grid-auto-columns: --value(--grid-auto-columns-*, --spacing(), [grid-track-size]);
+}
+
+@stillwind-arbitrary-property grid-auto-flow;
+
+@stillwind-utility grid-flow-col {
+  grid-auto-flow: column;
+}
+
+@stillwind-utility grid-flow-col-dense {
+  grid-auto-flow: column dense;
+}
+
+@stillwind-utility grid-flow-dense {
+  grid-auto-flow: dense;
+}
+
+@stillwind-utility grid-flow-row {
+  grid-auto-flow: row;
+}
+
+@stillwind-utility grid-flow-row-dense {
+  grid-auto-flow: row dense;
+}
+
+@stillwind-arbitrary-property grid-auto-rows;
+
+@stillwind-utility auto-rows-auto {
+  grid-auto-rows: auto;
+}
+
+@stillwind-utility auto-rows-fr {
+  grid-auto-rows: minmax(0, 1fr);
+}
+
+@stillwind-utility auto-rows-max {
+  grid-auto-rows: max-content;
+}
+
+@stillwind-utility auto-rows-min {
+  grid-auto-rows: min-content;
+}
+
+@stillwind-utility auto-rows-* {
+  grid-auto-rows: --value(--grid-auto-rows-*, --spacing(), [grid-track-size]);
+}
+
+/* MARK: `grid-template-columns` and `grid-template-rows` */
+
+@stillwind-arbitrary-property grid-template-columns;
+
+@stillwind-utility grid-cols-none {
+  grid-template-columns: none;
+}
+
+@stillwind-utility grid-cols-subgrid {
+  grid-template-columns: subgrid;
+}
+
+@stillwind-utility grid-cols-* {
+  grid-template-columns: --value(--grid-template-columns-*);
+}
+
+@stillwind-utility grid-cols-* {
+  grid-template-columns: repeat(--value(integer [1, ∞]), minmax(0, 1fr));
+}
+
+@stillwind-utility grid-cols-* {
+  grid-template-columns: --value([grid-track-list]);
+}
+
+@stillwind-arbitrary-property grid-template-rows;
+
+@stillwind-utility grid-rows-none {
+  grid-template-rows: none;
+}
+
+@stillwind-utility grid-rows-subgrid {
+  grid-template-rows: subgrid;
+}
+
+@stillwind-utility grid-rows-* {
+  grid-template-rows: --value(--grid-template-rows-*);
+}
+
+@stillwind-utility grid-rows-* {
+  grid-template-rows: --value([grid-track-list]);
+}
+
+@stillwind-utility grid-rows-* {
+  grid-template-rows: repeat(--value(integer [1, ∞]), minmax(0, 1fr));
+}
+
+/* MARK: `flex-direction` and `flex-wrap` */
+
+@stillwind-arbitrary-property flex-direction;
+
+@stillwind-utility flex-col {
+  flex-direction: column;
+}
+
+@stillwind-utility flex-col-reverse {
+  flex-direction: column-reverse;
+}
+
+@stillwind-utility flex-row {
+  flex-direction: row;
+}
+
+@stillwind-utility flex-row-reverse {
+  flex-direction: row-reverse;
+}
+
+@stillwind-arbitrary-property flex-wrap;
+
+@stillwind-utility flex-nowrap {
+  flex-wrap: nowrap;
+}
+
+@stillwind-utility flex-wrap {
+  flex-wrap: wrap;
+}
+
+@stillwind-utility flex-wrap-reverse {
+  flex-wrap: wrap-reverse;
+}
+
+/* MARK: `place-content` and `place-items` */
+
+@stillwind-arbitrary-property place-content;
+
+@stillwind-utility place-content-around {
+  place-content: space-around;
+}
+
+@stillwind-utility place-content-baseline {
+  place-content: baseline;
+}
+
+@stillwind-utility place-content-between {
+  place-content: space-between;
+}
+
+@stillwind-utility place-content-center {
+  place-content: center;
+}
+
+@stillwind-utility place-content-center-safe {
+  place-content: safe center;
+}
+
+@stillwind-utility place-content-end {
+  place-content: end;
+}
+
+@stillwind-utility place-content-end-safe {
+  place-content: safe end;
+}
+
+@stillwind-utility place-content-evenly {
+  place-content: space-evenly;
+}
+
+@stillwind-utility place-content-start {
+  place-content: start;
+}
+
+@stillwind-utility place-content-stretch {
+  place-content: stretch;
+}
+
+@stillwind-arbitrary-property place-items;
+
+@stillwind-utility place-items-baseline {
+  place-items: baseline;
+}
+
+@stillwind-utility place-items-center {
+  place-items: center;
+}
+
+@stillwind-utility place-items-center-safe {
+  place-items: safe center;
+}
+
+@stillwind-utility place-items-end {
+  place-items: end;
+}
+
+@stillwind-utility place-items-end-safe {
+  place-items: safe end;
+}
+
+@stillwind-utility place-items-start {
+  place-items: start;
+}
+
+@stillwind-utility place-items-stretch {
+  place-items: stretch;
+}
+
+/* MARK: `align-content` and `align-items` */
+
+@stillwind-arbitrary-property align-content;
+
+@stillwind-utility content-around {
+  align-content: space-around;
+}
+
+@stillwind-utility content-baseline {
+  align-content: baseline;
+}
+
+@stillwind-utility content-between {
+  align-content: space-between;
+}
+
+@stillwind-utility content-center {
+  align-content: center;
+}
+
+@stillwind-utility content-center-safe {
+  align-content: safe center;
+}
+
+@stillwind-utility content-end {
+  align-content: flex-end;
+}
+
+@stillwind-utility content-end-safe {
+  align-content: safe flex-end;
+}
+
+@stillwind-utility content-evenly {
+  align-content: space-evenly;
+}
+
+@stillwind-utility content-normal {
+  align-content: normal;
+}
+
+@stillwind-utility content-start {
+  align-content: flex-start;
+}
+
+@stillwind-utility content-stretch {
+  align-content: stretch;
+}
+
+@stillwind-arbitrary-property align-items;
+
+@stillwind-utility items-baseline {
+  align-items: baseline;
+}
+
+@stillwind-utility items-baseline-last {
+  align-items: last baseline;
+}
+
+@stillwind-utility items-center {
+  align-items: center;
+}
+
+@stillwind-utility items-center-safe {
+  align-items: safe center;
+}
+
+@stillwind-utility items-end {
+  align-items: flex-end;
+}
+
+@stillwind-utility items-end-safe {
+  align-items: safe flex-end;
+}
+
+@stillwind-utility items-start {
+  align-items: flex-start;
+}
+
+@stillwind-utility items-stretch {
+  align-items: stretch;
+}
+
+/* MARK: `justify-content` and `justify-items` */
+
+@stillwind-arbitrary-property justify-content;
+
+@stillwind-utility justify-around {
+  justify-content: space-around;
+}
+
+@stillwind-utility justify-between {
+  justify-content: space-between;
+}
+
+@stillwind-utility justify-center {
+  justify-content: center;
+}
+
+@stillwind-utility justify-center-safe {
+  justify-content: safe center;
+}
+
+@stillwind-utility justify-end {
+  justify-content: flex-end;
+}
+
+@stillwind-utility justify-end-safe {
+  justify-content: safe flex-end;
+}
+
+@stillwind-utility justify-evenly {
+  justify-content: space-evenly;
+}
+
+@stillwind-utility justify-normal {
+  justify-content: normal;
+}
+
+@stillwind-utility justify-start {
+  justify-content: flex-start;
+}
+
+@stillwind-utility justify-stretch {
+  justify-content: stretch;
+}
+
+@stillwind-arbitrary-property justify-items;
+
+@stillwind-utility justify-items-center {
+  justify-items: center;
+}
+
+@stillwind-utility justify-items-center-safe {
+  justify-items: safe center;
+}
+
+@stillwind-utility justify-items-end {
+  justify-items: end;
+}
+
+@stillwind-utility justify-items-end-safe {
+  justify-items: safe end;
+}
+
+@stillwind-utility justify-items-normal {
+  justify-items: normal;
+}
+
+@stillwind-utility justify-items-start {
+  justify-items: start;
+}
+
+@stillwind-utility justify-items-stretch {
+  justify-items: stretch;
+}
+
+/* MARK: `gap` */
+
+@stillwind-arbitrary-property gap;
+
+@stillwind-utility gap-* {
+  gap: --value(--spacing-*, --spacing(), [length-percentage]);
+}
+
+@stillwind-arbitrary-property column-gap;
+
+@stillwind-utility gap-x-* {
+  column-gap: --value(--spacing-*, --spacing(), [length-percentage]);
+}
+
+@stillwind-arbitrary-property row-gap;
+
+@stillwind-utility gap-y-* {
+  row-gap: --value(--spacing-*, --spacing(), [length-percentage]);
+}
+
+/* MARK: `place-self`, `align-self`, and `justify-self` */
+
+@stillwind-arbitrary-property place-self;
+
+@stillwind-utility place-self-auto {
+  place-self: auto;
+}
+
+@stillwind-utility place-self-center {
+  place-self: center;
+}
+
+@stillwind-utility place-self-center-safe {
+  place-self: safe center;
+}
+
+@stillwind-utility place-self-end {
+  place-self: end;
+}
+
+@stillwind-utility place-self-end-safe {
+  place-self: safe end;
+}
+
+@stillwind-utility place-self-start {
+  place-self: start;
+}
+
+@stillwind-utility place-self-stretch {
+  place-self: stretch;
+}
+
+@stillwind-arbitrary-property align-self;
+
+@stillwind-utility self-auto {
+  align-self: auto;
+}
+
+@stillwind-utility self-baseline {
+  align-self: baseline;
+}
+
+@stillwind-utility self-baseline-last {
+  align-self: last baseline;
+}
+
+@stillwind-utility self-center {
+  align-self: center;
+}
+
+@stillwind-utility self-center-safe {
+  align-self: safe center;
+}
+
+@stillwind-utility self-end {
+  align-self: flex-end;
+}
+
+@stillwind-utility self-end-safe {
+  align-self: safe flex-end;
+}
+
+@stillwind-utility self-start {
+  align-self: flex-start;
+}
+
+@stillwind-utility self-stretch {
+  align-self: stretch;
+}
+
+@stillwind-arbitrary-property justify-self;
+
+@stillwind-utility justify-self-auto {
+  justify-self: auto;
+}
+
+@stillwind-utility justify-self-center {
+  justify-self: center;
+}
+
+@stillwind-utility justify-self-center-safe {
+  justify-self: safe center;
+}
+
+@stillwind-utility justify-self-end {
+  justify-self: flex-end;
+}
+
+@stillwind-utility justify-self-end-safe {
+  justify-self: safe flex-end;
+}
+
+@stillwind-utility justify-self-start {
+  justify-self: flex-start;
+}
+
+@stillwind-utility justify-self-stretch {
+  justify-self: stretch;
+}