@maalbuquerque/tailsass 1.0.0

package/src/_display.scss

@@ -0,0 +1,384 @@
+@use 'modifiers' as *;
+
+$displays: (
+  inline: (
+    display: inline
+  ),
+  block: (
+    display: block
+  ),
+  inline-block: (
+    display: inline-block
+  ),
+  flow-root: (
+    display: flow-root
+  ),
+  flex: (
+    display: flex
+  ),
+  inline-flex: (
+    display: inline-flex
+  ),
+  grid: (
+    display: grid
+  ),
+  inline-grid: (
+    display: inline-grid
+  ),
+  contents: (
+    display: contents
+  ),
+  table: (
+    display: table
+  ),
+  inline-table: (
+    display: inline-table
+  ),
+  table-caption: (
+    display: table-caption
+  ),
+  table-cell: (
+    display: table-cell
+  ),
+  table-column: (
+    display: table-column
+  ),
+  table-column-group: (
+    display: table-column-group
+  ),
+  table-footer-group: (
+    display: table-footer-group
+  ),
+  table-header-group: (
+    display: table-header-group
+  ),
+  table-row-group: table-row-group,
+  table-row: (
+    display: table-row
+  ),
+  list-item: (
+    display: list-item
+  ),
+  hidden: (
+    display: none
+  ),
+  flex-none: (
+    flex: none
+  ),
+  flex-row: (
+    flex-direction: row
+  ),
+  flex-col: (
+    flex-direction: column
+  ),
+  flex-row-reverse: (
+    flex-direction: row-reverse
+  ),
+  flex-col-reverse: (
+    flex-direction: column-reverse
+  ),
+  flex-wrap: (
+    flex-wrap: wrap
+  ),
+  flex-nowrap: (
+    flex-wrap: nowrap
+  ),
+  flex-wrap-reverse: (
+    flex-wrap: wrap-reverse
+  ),
+  flex-auto: (
+    flex: auto
+  ),
+  flex-initial: (
+    flex: 0 auto
+  ),
+  grow-0: (
+    flex-grow: 0
+  ),
+  grow: (
+    flex-grow: 1
+  ),
+  shrink-0: (
+    flex-shrink: 0
+  ),
+  shrink: (
+    flex-shrink: 1
+  ),
+  float-left: (
+    float: left
+  ),
+  float-right: (
+    float: right
+  ),
+  float-none: (
+    float: none
+  ),
+  float-start: (
+    float: inline-start
+  ),
+  float-end: (
+    float: inline-end
+  ),
+  clear-left: (
+    clear: left
+  ),
+  clear-right: (
+    clear: right
+  ),
+  clear-both: (
+    clear: both
+  ),
+  clear-none: (
+    clear: none
+  ),
+  clear-start: (
+    clear: inline-start
+  ),
+  clear-end: (
+    clear: inline-end
+  ),
+  visible: (
+    visibility: visible
+  ),
+  invisible: (
+    visibility: hidden
+  ),
+  collapse: (
+    visibility: collapse
+  ),
+  justify-start: (
+    justify-content: flex-start
+  ),
+  justify-end: (
+    justify-content: flex-end
+  ),
+  justify-center: (
+    justify-content: center
+  ),
+  justify-between: (
+    justify-content: space-between
+  ),
+  justify-around: (
+    justify-content: space-around
+  ),
+  justify-evenly: (
+    justify-content: space-evenly
+  ),
+  justify-stretch: (
+    justify-content: stretch
+  ),
+  justify-items-start: (
+    justify-items: start
+  ),
+  justify-items-end: (
+    justify-items: end
+  ),
+  justify-items-center: (
+    justify-items: center
+  ),
+  justify-items-stretch: (
+    justify-items: stretch
+  ),
+  justify-self-start: (
+    justify-self: start
+  ),
+  justify-self-end: (
+    justify-self: end
+  ),
+  justify-self-center: (
+    justify-self: center
+  ),
+  justify-self-auto: (
+    justify-self: auto
+  ),
+  justify-self-stretch: (
+    justify-self: stretch
+  ),
+  content-normal: (
+    align-content: normal
+  ),
+  content-start: (
+    align-content: flex-start
+  ),
+  content-end: (
+    align-content: flex-end
+  ),
+  content-center: (
+    align-content: center
+  ),
+  content-between: (
+    align-content: space-between
+  ),
+  content-around: (
+    align-content: space-around
+  ),
+  content-evenly: (
+    align-content: space-evenly
+  ),
+  content-stretch: (
+    align-content: stretch
+  ),
+  items-start: (
+    align-items: flex-start
+  ),
+  items-end: (
+    align-items: flex-end
+  ),
+  items-center: (
+    align-items: center
+  ),
+  items-stretch: (
+    align-items: stretch
+  ),
+  items-baseline: (
+    align-items: baseline
+  ),
+  self-start: (
+    align-self: start
+  ),
+  self-end: (
+    align-self: end
+  ),
+  self-center: (
+    align-self: center
+  ),
+  self-auto: (
+    align-self: auto
+  ),
+  self-stretch: (
+    align-self: stretch
+  ),
+  self-baseline: (
+    align-self: baseline
+  ),
+  place-content-start: (
+    place-content: start
+  ),
+  place-content-end: (
+    place-content: end
+  ),
+  place-content-center: (
+    place-content: center
+  ),
+  place-content-between: (
+    place-content: space-between
+  ),
+  place-content-around: (
+    place-content: space-around
+  ),
+  place-content-evenly: (
+    place-content: space-evenly
+  ),
+  place-content-stretch: (
+    place-content: stretch
+  ),
+  place-items-start: (
+    place-items: start
+  ),
+  place-items-end: (
+    place-items: end
+  ),
+  place-items-center: (
+    place-items: center
+  ),
+  place-items-stretch: (
+    place-items: stretch
+  ),
+  place-items-baseline: (
+    place-items: baseline
+  ),
+  place-self-start: (
+    place-self: start
+  ),
+  place-self-end: (
+    place-self: end
+  ),
+  place-self-center: (
+    place-self: center
+  ),
+  place-self-auto: (
+    place-self: auto
+  ),
+  place-self-stretch: (
+    place-self: stretch
+  ),
+  sr-only: (
+    position: absolute,
+    width: 1px,
+    height: 1px,
+    padding: 0,
+    margin: -1px,
+    overflow: hidden,
+    clip: rect(0, 0, 0, 0),
+    white-space: nowrap,
+    border: 0
+  ),
+);
+
+@mixin apply-displays($prefix: '.') {
+  @each $display, $value in $displays {
+    #{$prefix}#{$display} {
+      @each $key, $value in $value {
+        #{$key}: $value;
+      }
+    }
+  }
+  @for $i from 1 through 12 {
+    #{$prefix}columns-#{$i} {
+      columns: $i;
+    }
+    #{$prefix}grid-cols-#{$i} {
+      grid-template-columns: repeat($i, minmax(0, 1fr));
+    }
+    #{$prefix}grid-rows-#{$i} {
+      grid-template-rows: repeat($i, minmax(0, 1fr));
+    }
+    #{$prefix}col-span-#{$i} {
+      grid-column: span $i / span $i;
+    }
+    #{$prefix}col-start-#{$i} {
+      grid-column-start: $i;
+    }
+    #{$prefix}col-end-#{$i} {
+      grid-column-end: $i;
+    }
+    #{$prefix}row-span-#{$i} {
+      grid-row: span $i / span $i;
+    }
+    #{$prefix}row-start-#{$i} {
+      grid-row-start: $i;
+    }
+    #{$prefix}row-end-#{$i} {
+      grid-row-end: $i;
+    }
+    #{$prefix}flex-#{$i} {
+      flex: $i;
+    }
+    #{$prefix}order-#{$i} {
+      order: $i;
+    }
+    #{$prefix}z-#{$i * 10} {
+      z-index: $i * 10;
+    }
+  }
+  #{$prefix}col-span-full {
+    grid-column: 1 / -1;
+  }
+  #{$prefix}row-span-full {
+    grid-row: 1 / -1;
+  }
+  #{$prefix}col-auto {
+    grid-column: auto;
+  }
+  #{$prefix}row-auto {
+    grid-row: auto;
+  }
+}
+
+@include apply-displays('.');
+
+@each $breakpoint, $value in $breakpoints {
+  @media (min-width: $value) {
+    @include apply-displays(bp-prefix($breakpoint));
+  }
+}

package/src/_effects.scss

@@ -0,0 +1,15 @@
+@use 'modifiers' as *;
+
+@mixin apply-opacity($prefix: '.', $postfix: '') {
+  @for $i from 0 through 10 {
+    #{$prefix}opacity-#{$i * 10}#{$postfix} {
+      opacity: calc($i * 0.1);
+    }
+  }
+}
+
+@include apply-opacity('.');
+
+@each $state in $states {
+  @include apply-opacity('.#{$state}\\:', ':#{$state}');
+}

package/src/_lists.scss

@@ -0,0 +1,23 @@
+$list-styles: (
+  disc: (
+    list-style-type: disc
+  ),
+  decimal: (
+    list-style-type: decimal
+  ),
+  none: (
+    list-style-type: none
+  )
+);
+
+@mixin apply-list-styles($prefix: '.') {
+  @each $style, $value in $list-styles {
+    #{$prefix}list-#{$style} {
+      @each $key, $value in $value {
+        #{$key}: $value;
+      }
+    }
+  }
+};
+
+@include apply-list-styles('.');

package/src/_modifiers.scss

@@ -0,0 +1,31 @@
+@use 'sass:string';
+
+$breakpoints: (
+  xs: 480px,
+  sm: 640px,
+  md: 768px,
+  lg: 1024px,
+  xl: 1280px,
+  '2xl': 1536px,
+  '3xl': 1920px
+);
+
+$states: hover, focus, active;
+
+$color-schemes: light, dark;
+
+// CSS identifiers cannot start with a digit unless escaped (e.g. 2xl → \32 xl).
+@function escape-ident($name) {
+  $str: #{$name};
+  $first: string.slice($str, 1, 1);
+
+  @if string.index('0123456789', $first) != null {
+    @return '\\3' + $first + ' ' + string.slice($str, 2);
+  }
+
+  @return $str;
+}
+
+@function bp-prefix($breakpoint) {
+  @return '.#{escape-ident($breakpoint)}\\:';
+}

package/src/_overflow.scss

@@ -0,0 +1,29 @@
+@use 'modifiers' as *;
+
+$overflows: (
+  overflow-auto: auto,
+  overflow-hidden: hidden,
+  overflow-visible: visible,
+  overflow-clip: clip,
+  overflow-scroll: scroll,
+  overflow-x-auto: auto-x,
+  overflow-y-auto: auto-y,
+  overflow-x-hidden: hidden-x,
+  overflow-y-hidden: hidden-y,
+  overflow-x-visible: visible-x,
+  overflow-y-visible: visible-y,
+  overflow-x-clip: clip-x,
+  overflow-y-clip: clip-y,
+  overflow-x-scroll: scroll-x,
+  overflow-y-scroll: scroll-y
+);
+
+@mixin apply-overflows($prefix: '.') {
+  @each $overflow, $value in $overflows {
+    #{$prefix}#{$overflow} {
+      overflow: $value;
+    }
+  }
+}
+
+@include apply-overflows('.');

package/src/_position.scss

@@ -0,0 +1,26 @@
+@use 'variables';
+@use 'modifiers' as *;
+
+$positions: (
+  static: static,
+  relative: relative,
+  absolute: absolute,
+  fixed: fixed,
+  sticky: sticky
+);
+
+@mixin apply-positions($prefix: '.') {
+  @each $position, $value in $positions {
+    #{$prefix}#{$position} {
+      position: $value;
+    }
+  }  
+}
+
+@include apply-positions('.');
+
+@each $breakpoint, $value in $breakpoints {
+  @media (min-width: $value) {
+    @include apply-positions(bp-prefix($breakpoint));
+  }
+}

package/src/_preflight.scss

@@ -0,0 +1,149 @@
+*,
+::after,
+::before,
+::backdrop,
+::file-selector-button {  
+  margin: 0;
+	padding: 0;
+	box-sizing: border-box;
+	border: 0 solid;
+}
+
+html {
+	font-family:
+		system-ui,
+		'Segoe UI',
+		Roboto,
+		Helvetica,
+		Arial,
+		sans-serif,
+		'Apple Color Emoji',
+		'Segoe UI Emoji';
+	line-height: 1.15;
+	-webkit-text-size-adjust: 100%;
+	tab-size: 4;
+}
+
+body {
+	margin: 0;
+}
+
+b,
+strong {
+	font-weight: bolder;
+}
+
+code,
+kbd,
+samp,
+pre {
+	font-family:
+		ui-monospace,
+		SFMono-Regular,
+		Consolas,
+		'Liberation Mono',
+		Menlo,
+		monospace;
+	font-size: 1em;
+}
+
+small {
+	font-size: 80%;
+}
+
+sub,
+sup {
+	font-size: 75%;
+	line-height: 0;
+	position: relative;
+	vertical-align: baseline;
+}
+
+sub {
+	bottom: -0.25em;
+}
+
+sup {
+	top: -0.5em;
+}
+
+table {
+	border-color: currentcolor;
+}
+
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit; /* 1 */
+	font-size: 100%; /* 1 */
+	line-height: 1.15; /* 1 */
+	margin: 0; /* 2 */
+}
+
+button,
+[type='button'],
+[type='reset'],
+[type='submit'] {
+	appearance: button;
+	-webkit-appearance: button;
+}
+
+legend {
+	padding: 0;
+}
+
+progress {
+	vertical-align: baseline;
+}
+
+
+::-webkit-inner-spin-button,
+::-webkit-outer-spin-button {
+	height: auto;
+}
+
+[type='search'] {
+	appearance: textfield;
+	-webkit-appearance: textfield;
+	outline-offset: -2px;
+}
+
+::-webkit-search-decoration {
+	-webkit-appearance: none;
+}
+
+::-webkit-file-upload-button {
+	-webkit-appearance: button;
+	font: inherit;
+}
+
+summary {
+	display: list-item;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {  font-size: inherit;  font-weight: inherit;}
+
+ol,
+ul,
+menu { 
+	list-style: none; 
+}
+
+[hidden]:where(:not([hidden="until-found"])) { 
+	display: none !important;
+}
+
+a {
+  all: unset; /* Resets all properties to their initial or inherited values */
+  display: revert; /* Ensures the display property reverts to its default for an anchor, which is inline */
+  text-decoration: initial; /* Reverts text-decoration to its default (underline) */
+  color: ihnerit; /* Reverts color to its default (usually blue) */
+  cursor: pointer; /* Ensures the cursor remains a pointer on hover */
+}