@byline/ui 1.7.0 → 1.7.2

package/dist/styles/reset.css

@@ -1,209 +1,215 @@
+@layer base;
+
 @layer byline-base {
-  *, :before, :after {
-    box-sizing: border-box;
-    border: 0 solid #e5e7eb;
-  }
+  @scope (.byline-ui) {
+    *, :before, :after {
+      box-sizing: border-box;
+      border: 0 solid #e5e7eb;
+    }
 
-  :before, :after {
-    --tw-content: "";
-  }
+    :before, :after {
+      --tw-content: "";
+    }
 
-  html, :host {
-    scroll-behavior: smooth;
-    -webkit-text-size-adjust: 100%;
-    -moz-tab-size: 4;
-    -o-tab-size: 4;
-    tab-size: 4;
-    font-feature-settings: normal;
-    font-variation-settings: normal;
-    -webkit-tap-highlight-color: transparent;
-    font-family: Inter, ui-sans-serif, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
-    line-height: 1.5;
-  }
+    :scope, :host {
+      scroll-behavior: smooth;
+      -webkit-text-size-adjust: 100%;
+      -moz-tab-size: 4;
+      -o-tab-size: 4;
+      tab-size: 4;
+      font-feature-settings: normal;
+      font-variation-settings: normal;
+      -webkit-tap-highlight-color: transparent;
+      font-family: Inter, ui-sans-serif, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
+      line-height: 1.5;
+    }
 
-  body {
-    line-height: inherit;
-    margin: 0;
-  }
+    body {
+      line-height: inherit;
+      margin: 0;
+    }
 
-  hr {
-    height: 0;
-    color: inherit;
-    border-top-width: 1px;
-  }
+    hr {
+      height: 0;
+      color: inherit;
+      border-top-width: 1px;
+    }
 
-  abbr:where([title]) {
-    text-decoration: underline dotted;
-  }
+    abbr:where([title]) {
+      text-decoration: underline dotted;
+    }
 
-  h1, h2, h3, h4, h5, h6 {
-    font-size: inherit;
-    font-weight: inherit;
-  }
+    h1, h2, h3, h4, h5, h6 {
+      font-size: inherit;
+      font-weight: inherit;
+    }
 
-  a {
-    color: inherit;
-    text-decoration: inherit;
-  }
+    a {
+      color: inherit;
+      text-decoration: inherit;
+    }
 
-  b, strong {
-    font-weight: bolder;
-  }
+    b, strong {
+      font-weight: bolder;
+    }
 
-  code, kbd, samp, pre {
-    font-feature-settings: normal;
-    font-variation-settings: normal;
-    font-family: Source Code Pro, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
-    font-size: 1em;
-  }
+    code, kbd, samp, pre {
+      font-feature-settings: normal;
+      font-variation-settings: normal;
+      font-family: Source Code Pro, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
+      font-size: 1em;
+    }
 
-  small {
-    font-size: 80%;
-  }
+    small {
+      font-size: 80%;
+    }
 
-  sub, sup {
-    vertical-align: baseline;
-    font-size: 75%;
-    line-height: 0;
-    position: relative;
-  }
+    sub, sup {
+      vertical-align: baseline;
+      font-size: 75%;
+      line-height: 0;
+      position: relative;
+    }
 
-  sub {
-    bottom: -.25em;
-  }
+    sub {
+      bottom: -.25em;
+    }
 
-  sup {
-    top: -.5em;
-  }
+    sup {
+      top: -.5em;
+    }
 
-  table {
-    text-indent: 0;
-    border-color: inherit;
-    border-collapse: collapse;
-  }
+    table {
+      text-indent: 0;
+      border-color: inherit;
+      border-collapse: collapse;
+    }
 
-  button, input, optgroup, select, textarea {
-    font-feature-settings: inherit;
-    font-variation-settings: inherit;
-    font-family: inherit;
-    font-size: 100%;
-    font-weight: inherit;
-    line-height: inherit;
-    letter-spacing: inherit;
-    color: inherit;
-    margin: 0;
-    padding: 0;
-  }
+    button, input, optgroup, select, textarea {
+      font-feature-settings: inherit;
+      font-variation-settings: inherit;
+      font-family: inherit;
+      font-size: 100%;
+      font-weight: inherit;
+      line-height: inherit;
+      letter-spacing: inherit;
+      color: inherit;
+      margin: 0;
+      padding: 0;
+    }
 
-  button, select {
-    text-transform: none;
-  }
+    button, select {
+      text-transform: none;
+    }
 
-  button, input:where([type="button"]), input:where([type="reset"]), input:where([type="submit"]) {
-    -webkit-appearance: button;
-    background-color: #0000;
-    background-image: none;
-  }
+    button, input:where([type="button"]), input:where([type="reset"]), input:where([type="submit"]) {
+      -webkit-appearance: button;
+      background-color: #0000;
+      background-image: none;
+    }
 
-  :-moz-focusring {
-    outline: auto;
-  }
+    :-moz-focusring {
+      outline: auto;
+    }
 
-  :-moz-ui-invalid {
-    box-shadow: none;
-  }
+    :-moz-ui-invalid {
+      box-shadow: none;
+    }
 
-  progress {
-    vertical-align: baseline;
-  }
+    progress {
+      vertical-align: baseline;
+    }
 
-  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
-    height: auto;
-  }
+    ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
+      height: auto;
+    }
 
-  [type="search"] {
-    -webkit-appearance: textfield;
-    outline-offset: -2px;
-  }
+    [type="search"] {
+      -webkit-appearance: textfield;
+      outline-offset: -2px;
+    }
 
-  ::-webkit-search-decoration {
-    -webkit-appearance: none;
-  }
+    ::-webkit-search-decoration {
+      -webkit-appearance: none;
+    }
 
-  ::-webkit-file-upload-button {
-    -webkit-appearance: button;
-    font: inherit;
-  }
+    ::-webkit-file-upload-button {
+      -webkit-appearance: button;
+      font: inherit;
+    }
 
-  summary {
-    display: list-item;
-  }
+    summary {
+      display: list-item;
+    }
 
-  blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre {
-    margin: 0;
-  }
+    blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre {
+      margin: 0;
+    }
 
-  fieldset {
-    margin: 0;
-    padding: 0;
-  }
+    fieldset {
+      margin: 0;
+      padding: 0;
+    }
 
-  legend {
-    padding: 0;
-  }
+    legend {
+      padding: 0;
+    }
 
-  ol, ul, menu {
-    margin: 0;
-    padding: 0;
-    list-style: none;
-  }
+    ol, ul, menu {
+      margin: 0;
+      padding: 0;
+      list-style: none;
+    }
 
-  dialog {
-    padding: 0;
-  }
+    dialog {
+      padding: 0;
+    }
 
-  textarea {
-    resize: vertical;
-  }
+    textarea {
+      resize: vertical;
+    }
 
-  input::-moz-placeholder, textarea::-moz-placeholder {
-    opacity: 1;
-    color: #9ca3af;
-  }
+    input::-moz-placeholder, textarea::-moz-placeholder {
+      opacity: 1;
+      color: #9ca3af;
+    }
 
-  input::placeholder, textarea::placeholder {
-    opacity: 1;
-    color: #9ca3af;
-  }
+    input::placeholder, textarea::placeholder {
+      opacity: 1;
+      color: #9ca3af;
+    }
 
-  button, [role="button"] {
-    cursor: pointer;
-  }
+    button, [role="button"] {
+      cursor: pointer;
+    }
 
-  :disabled {
-    cursor: default;
-  }
+    :disabled {
+      cursor: default;
+    }
 
-  img, svg, video, canvas, audio, iframe, embed, object {
-    vertical-align: middle;
-    display: block;
-  }
+    img, svg, video, canvas, audio, iframe, embed, object {
+      vertical-align: middle;
+      display: block;
+    }
 
-  img, video {
-    max-width: 100%;
-    height: auto;
-  }
+    img, video {
+      max-width: 100%;
+      height: auto;
+    }
 
-  [hidden]:where(:not([hidden="until-found"])) {
-    display: none;
-  }
+    [hidden]:where(:not([hidden="until-found"])) {
+      display: none;
+    }
 
-  @media (prefers-reduced-motion: reduce) {
-    *, :before, :after {
-      scroll-behavior: auto;
-      transition-duration: .01ms;
-      animation-duration: .01ms;
-      animation-iteration-count: 1;
+    @media (prefers-reduced-motion: reduce) {
+      *, :before, :after {
+        scroll-behavior: auto;
+        transition-duration: .01ms;
+        animation-duration: .01ms;
+        animation-iteration-count: 1;
+      }
     }
   }
 }
+
+@layer components, byline-components, byline-functional, utilities, byline-utilities, theme, byline-theme, byline-typography;