@universal-material/web 3.6.19 → 3.6.21

package/scss/_reboot.scss

@@ -1,498 +0,0 @@
-@use "variables";
-
-@use "functions";
-@use "mixins";
-
-@mixin reboot() {
-  // stylelint-disable declaration-no-important, selector-no-qualifying-type, property-no-vendor-prefix
-
-
-  // Reboot
-  //
-  // Normalization of HTML elements, manually forked from Normalize.css to remove
-  // styles targeting irrelevant browsers while applying new styles.
-  //
-  // Normalize is licensed MIT. https://github.com/necolas/normalize.css
-
-
-  // Document
-  //
-  // Change from `box-sizing: content-box` so that `width` is not affected by `padding` or `border`.
-
-  *,
-  *::before,
-  *::after {
-    box-sizing: border-box;
-  }
-
-
-  // Root
-  //
-  // Ability to the value of the root font sizes, affecting the value of `rem`.
-  // null by default, thus nothing is generated.
-
-  :root {
-    @if variables.$enable-smooth-scroll {
-      @media (prefers-reduced-motion: no-preference) {
-        scroll-behavior: smooth;
-      }
-    }
-  }
-
-
-  // Body
-  //
-  // 1. Remove the margin in all browsers.
-  // 2. As a best practice, apply a default `background-color`.
-  // 3. Prevent adjustments of font size after orientation changes in iOS.
-  // 4. Change the default tap highlight to be completely transparent in iOS.
-
-  // scss-docs-start reboot-body-rules
-  body {
-    --u-current-bg-color: var(--u-color-body);
-    background-color: var(--u-current-bg-color);
-    margin: 0; // 1
-    @include mixins.typo-prop(body-l, font-size);
-    @include mixins.typo-prop(body-l, font-weight);
-    line-height: 1.5;
-    text-align: start;
-    -webkit-text-size-adjust: 100%; // 3
-    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); // 4
-  }
-  // scss-docs-end reboot-body-rules
-
-
-  // Content grouping
-  //
-  // 1. Reset Firefox's gray color
-
-  hr {
-    margin: 1rem 0;
-    color: inherit;
-    border: 0;
-    border-top: 1px solid;
-    opacity: 0.25;
-  }
-
-
-  // Typography
-  //
-  // 1. Remove top margins from headings
-  //    By default, `<h1>`-`<h6>` all receive top and bottom margins. We nuke the top
-  //    margin for easier control within type scales as it avoids margin collapsing.
-
-  h6, h5, h4, h3, h2, h1 {
-    margin-top: 0;
-    margin-bottom: 0.5rem;
-    font-weight: 500;
-    line-height: 1.2;
-  }
-
-  h1 {
-    font-size: calc(1.375rem + 1.5vw);
-  }
-  @media (min-width: 1200px) {
-    h1 {
-      font-size: 2.5rem;
-    }
-  }
-
-  h2 {
-    font-size: calc(1.325rem + 0.9vw);
-  }
-  @media (min-width: 1200px) {
-    h2 {
-      font-size: 2rem;
-    }
-  }
-
-  h3 {
-    font-size: calc(1.3rem + 0.6vw);
-  }
-  @media (min-width: 1200px) {
-    h3 {
-      font-size: 1.75rem;
-    }
-  }
-
-  h4 {
-    font-size: calc(1.275rem + 0.3vw);
-  }
-  @media (min-width: 1200px) {
-    h4 {
-      font-size: 1.5rem;
-    }
-  }
-
-  h5 {
-    font-size: 1.25rem;
-  }
-
-  h6 {
-    font-size: 1rem;
-  }
-
-  p {
-    margin-top: 0;
-    margin-bottom: 1rem;
-  }
-
-  abbr[title] {
-    -webkit-text-decoration: underline dotted;
-    text-decoration: underline dotted;
-    cursor: help;
-    -webkit-text-decoration-skip-ink: none;
-    text-decoration-skip-ink: none;
-  }
-
-  address {
-    margin-bottom: 1rem;
-    font-style: normal;
-    line-height: inherit;
-  }
-
-  ol,
-  ul {
-    padding-left: 2rem;
-  }
-
-  ol,
-  ul,
-  dl {
-    margin-top: 0;
-    margin-bottom: 1rem;
-  }
-
-  ol ol,
-  ul ul,
-  ol ul,
-  ul ol {
-    margin-bottom: 0;
-  }
-
-  dt {
-    font-weight: 700;
-  }
-
-  dd {
-    margin-bottom: 0.5rem;
-    margin-left: 0;
-  }
-
-  blockquote {
-    margin: 0 0 1rem;
-  }
-
-  b,
-  strong {
-    font-weight: bolder;
-  }
-
-  small {
-    font-size: 0.875em;
-  }
-
-
-  // Mark
-
-  mark {
-    padding: 0.1875em;
-    color: var(--u-color-on-warning);
-    background-color: var(--u-color-warning);
-  }
-
-
-  sub,
-  sup {
-    position: relative;
-    font-size: 0.75em;
-    line-height: 0;
-    vertical-align: baseline;
-  }
-
-  sub {
-    bottom: -0.25em;
-  }
-
-  sup {
-    top: -0.5em;
-  }
-
-  a {
-    color: #{functions.get-color-transparency-mix(var(--u-link-color, --u-color-primary), var(--u-text-opacity))};
-    text-decoration: none;
-
-    @media (hover: hover) {
-      &:hover {
-        text-decoration: underline;
-      }
-    }
-  }
-
-  a:not([href]):not([class]), a:not([href]):not([class]):hover {
-    color: inherit;
-    text-decoration: none;
-  }
-
-  pre,
-  code,
-  kbd,
-  samp {
-    font-family: var(--u-font-monospace);
-    font-size: 1em;
-  }
-
-  pre {
-    display: block;
-    margin-top: 0;
-    margin-bottom: 1rem;
-    overflow: auto;
-    font-size: 0.875em;
-  }
-  pre code {
-    font-size: inherit;
-    color: inherit;
-    word-break: normal;
-  }
-
-  code {
-    font-size: 0.875em;
-    word-wrap: break-word;
-  }
-  a > code {
-    color: inherit;
-  }
-
-  kbd {
-    padding: 0.1875rem 0.375rem;
-    font-size: 0.875em;
-    color: var(--u-color-on-light);
-    background-color: var(--u-color-light);
-    font-weight: var(--u-font-weight-regular);
-    border-radius: 0.25rem;
-  }
-  kbd kbd {
-    padding: 0;
-    font-size: 1em;
-  }
-
-  figure {
-    margin: 0 0 1rem;
-  }
-
-  img,
-  svg {
-    vertical-align: middle;
-  }
-
-  table {
-    caption-side: bottom;
-    border-collapse: collapse;
-  }
-
-  caption {
-    padding-top: 0.5rem;
-    padding-bottom: 0.5rem;
-    color: #{functions.get-color-transparency-mix(currentColor, var(--u-low-emphasis-opacity))};
-    text-align: left;
-  }
-
-  th {
-    text-align: inherit;
-    text-align: -webkit-match-parent;
-  }
-
-  thead,
-  tbody,
-  tfoot,
-  tr,
-  td,
-  th {
-    border-color: inherit;
-    border-style: solid;
-    border-width: 0;
-  }
-
-  label {
-    display: inline-block;
-  }
-
-  button {
-    border-radius: 0;
-  }
-
-  button:focus:not(:focus-visible) {
-    outline: 0;
-  }
-
-  input,
-  button,
-  select,
-  optgroup,
-  textarea {
-    margin: 0;
-    font-family: inherit;
-    font-size: inherit;
-    line-height: inherit;
-  }
-
-  button,
-  select {
-    text-transform: none;
-  }
-
-  [role=button] {
-    cursor: pointer;
-  }
-
-  select {
-    word-wrap: normal;
-  }
-  select:disabled {
-    opacity: 1;
-  }
-
-  [list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator {
-    display: none !important;
-  }
-
-  button,
-  [type=button],
-  [type=reset],
-  [type=submit] {
-    -webkit-appearance: button;
-  }
-  button:not(:disabled),
-  [type=button]:not(:disabled),
-  [type=reset]:not(:disabled),
-  [type=submit]:not(:disabled) {
-    cursor: pointer;
-  }
-
-  ::-moz-focus-inner {
-    padding: 0;
-    border-style: none;
-  }
-
-  textarea {
-    resize: vertical;
-  }
-
-  fieldset {
-    min-width: 0;
-    padding: 0;
-    margin: 0;
-    border: 0;
-  }
-
-  legend {
-    float: left;
-    width: 100%;
-    padding: 0;
-    margin-bottom: 0.5rem;
-    font-size: calc(1.275rem + 0.3vw);
-    line-height: inherit;
-  }
-
-  // Fix height of inputs with a type of datetime-local, date, month, week, or time
-  // See https://github.com/twbs/bootstrap/issues/18842
-
-  ::-webkit-datetime-edit-fields-wrapper,
-  ::-webkit-datetime-edit-text,
-  ::-webkit-datetime-edit-minute,
-  ::-webkit-datetime-edit-hour-field,
-  ::-webkit-datetime-edit-day-field,
-  ::-webkit-datetime-edit-month-field,
-  ::-webkit-datetime-edit-year-field {
-    padding: 0;
-  }
-
-  ::-webkit-inner-spin-button {
-    height: auto;
-  }
-
-  // 1. This overrides the extra rounded corners on search inputs in iOS so that our
-  //    `.form-control` class can properly style them. Note that this cannot simply
-  //    be added to `.form-control` as it's not specific enough. For details, see
-  //    https://github.com/twbs/bootstrap/issues/11586.
-  // 2. Correct the outline style in Safari.
-
-  [type="search"] {
-    -webkit-appearance: textfield; // 1
-    outline-offset: -2px; // 2
-  }
-
-  // 1. A few input types should stay LTR
-  // See https://rtlstyling.com/posts/rtl-styling#form-inputs
-  // 2. RTL only output
-  // See https://rtlcss.com/learn/usage-guide/control-directives/#raw
-
-  /* rtl:raw:
-  [type="tel"],
-  [type="url"],
-  [type="email"],
-  [type="number"] {
-    direction: ltr;
-  }
-  */
-
-  // Remove the inner padding in Chrome and Safari on macOS.
-
-  ::-webkit-search-decoration {
-    -webkit-appearance: none;
-  }
-
-  // Remove padding around color pickers in webkit browsers
-
-  ::-webkit-color-swatch-wrapper {
-    padding: 0;
-  }
-
-
-  // 1. Inherit font family and line height for file input buttons
-  // 2. Correct the inability to style clickable types in iOS and Safari.
-
-  ::file-selector-button {
-    font: inherit; // 1
-    -webkit-appearance: button; // 2
-  }
-
-  // Correct element displays
-
-  output {
-    display: inline-block;
-  }
-
-  // Remove border from iframe
-
-  iframe {
-    border: 0;
-  }
-
-  // Summary
-  //
-  // 1. Add the correct display in all browsers
-
-  summary {
-    display: list-item; // 1
-    cursor: pointer;
-  }
-
-
-  // Progress
-  //
-  // Add the correct vertical alignment in Chrome, Firefox, and Opera.
-
-  progress {
-    vertical-align: baseline;
-  }
-
-
-  // Hidden attribute
-  //
-  // Always hide an element with the `hidden` HTML attribute.
-
-  [hidden] {
-    display: none !important;
-  }
-}

package/scss/_utilities.scss

@@ -1,4 +0,0 @@
-@use "utilities/divider";
-@use "utilities/scheme";
-@use "utilities/spacing";
-@use "utilities/text";

package/scss/_variables.scss

@@ -1,139 +0,0 @@
-@use "sass:string";
-@use "sass:map";
-
-$awesome-cubic-bezier: cubic-bezier(.19, 1, .22, 1) !default;
-
-$enable-smooth-scroll: true !default;
-$include-reboot: true !default;
-
-$layout-directions: (
-  "",
-  -block,
-  -inline
-);
-
-$spacing-sides: (
-  "": "",
-  t: -top,
-  b: -bottom,
-  s: -inline-start,
-  e: -inline-end,
-  x: -inline,
-  y: -block,
-);
-
-$breakpoints: (
-  xs: 0,
-  sm: 600px,
-  md: 840px,
-  lg: 1200px,
-  xl: 1600px
-) !default;
-
-$theme-colors: (
-  primary,
-  secondary,
-  tertiary
-);
-
-$color-roles: (
-  primary,
-  primary-container,
-  secondary,
-  secondary-container,
-  tertiary,
-  tertiary-container,
-  error,
-  error-container,
-  surface,
-  surface-variant,
-  surface-container,
-  surface-container-highest,
-  surface-container-high,
-  surface-container-low,
-  surface-container-lowest
-);
-
-$rgb-colors: (
-  primary: string.unquote("103, 80, 164"),
-  on-primary: string.unquote("255, 255, 255"),
-  primary-container: string.unquote("234, 221, 255"),
-  on-primary-container: string.unquote("33, 0, 93"),
-  secondary: string.unquote("98, 91, 113"),
-  secondary-container: string.unquote("232, 222, 248"),
-  on-secondary-container: string.unquote("29, 25, 43"),
-  on-secondary: string.unquote("255, 255, 255"),
-  tertiary: string.unquote("125, 82, 96"),
-  on-tertiary: string.unquote("255, 255, 255"),
-  tertiary-container: string.unquote("255, 216, 228"),
-  on-tertiary-container: string.unquote("49, 17, 29"),
-  error: string.unquote("179, 38, 30"),
-  on-error: string.unquote("255, 255, 255"),
-  error-container: string.unquote("249, 222, 220"),
-  on-error-container: string.unquote("65, 14, 11"),
-  surface: string.unquote("254, 247, 255"),
-  on-surface: string.unquote("29, 27, 32"),
-  surface-variant: string.unquote("231, 224, 236"),
-  on-surface-variant: string.unquote("73, 69, 79"),
-  surface-container-highest: string.unquote("230, 224, 233"),
-  surface-container-high: string.unquote("236, 230, 240"),
-  surface-container: string.unquote("243, 237, 247"),
-  surface-container-low: string.unquote("247, 242, 250"),
-  surface-container-lowest: string.unquote("255, 255, 255"),
-  inverse-surface: string.unquote("50, 47, 53"),
-  on-inverse-surface: string.unquote("245, 239, 247"),
-  outline: string.unquote("121, 116, 126"),
-  outline-variant: string.unquote("202, 196, 208"),
-  scrim: string.unquote("0, 0, 0"),
-  shadow: string.unquote("0, 0, 0")
-);
-
-$colors: ();
-
-@each $name, $value in $rgb-colors {
-  $colors: map.set($colors, $name, string.unquote("rgb(#{$value})"));
-}
-
-$fixed-colors: (
-  success,
-  info,
-  warning
-);
-
-$spacings: (
-  0: 0,
-  extra-small: 4px,
-  small: 8px,
-  medium: 16px,
-  large: 24px,
-  extra-large: 40px,
-) !default;
-
-$state-layer-opacity: (
-  hover: .08,
-  focus: .1,
-  press: .1,
-  drag: .16
-) !default;
-
-$font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
-$font-mono: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
-
-$font-weights: (
-  thin: 100,
-  light: 300,
-  regular: 400,
-  medium: 500,
-  bold: 700,
-  bolder: 900,
-) !default;
-
-$shape-corner: (
-  none: 0,
-  extra-small: 4px,
-  small: 8px,
-  medium: 12px,
-  large: 16px,
-  extra-large: 28px,
-  full: 9999px
-) !default;

package/scss/colors/_text-bg.scss

@@ -1,38 +0,0 @@
-@use "sass:string";
-
-@use "../variables";
-@use "../mixins/text-bg";
-
-@each $color in variables.$color-roles {
-
-  @include text-bg.text-bg-variant-important($color);
-  @include text-bg.text-bg-variant-important(inverse-#{$color});
-
-  @include text-bg.bg-variant-important($color);
-  @include text-bg.bg-variant-important(inverse-#{$color});
-}
-
-@each $color in variables.$fixed-colors {
-  @include text-bg.text-bg-variant-important($color);
-  @include text-bg.text-bg-variant-important(#{$color}-container);
-
-  @include text-bg.bg-variant-important($color);
-  @include text-bg.bg-variant-important(#{$color}-container);
-}
-
-@each $color in variables.$theme-colors {
-  @include text-bg.text-bg-variant-important(#{$color}-fixed);
-  @include text-bg.text-bg-variant-important(#{$color}-fixed-dim, on-#{$color}-fixed);
-  @include text-bg.bg-variant-important(#{$color}-fixed);
-  @include text-bg.bg-variant-important(#{$color}-fixed-dim);
-}
-
-@include text-bg.text-bg-variant-important(body);
-@include text-bg.text-bg-variant-important(inverse-body);
-@include text-bg.text-bg-variant-important(light);
-@include text-bg.text-bg-variant-important(dark);
-
-@include text-bg.bg-variant-important(body);
-@include text-bg.bg-variant-important(inverse-body);
-@include text-bg.bg-variant-important(light);
-@include text-bg.bg-variant-important(dark);

package/scss/colors/_text.scss

@@ -1,52 +0,0 @@
-@use "sass:list";
-@use "sass:map";
-@use "sass:string";
-
-@use "../variables";
-@use "../mixins/text-bg";
-
-@mixin _text-variant-block($name, $color-name) {
-
-  @if string.index($name, "-container") == null and string.index($name, "-surface") == null {
-    @include _text-variant($name, $color-name);
-    @include _text-variant($name, $color-name, inverse-);
-  }
-
-  @include _text-variant($name, $color-name, on-);
-  @include _text-variant($name, $color-name, on-inverse-);
-}
-
-@mixin _text-variant($name, $color-name: null, $prefix: '') {
-
-  @if ($color-name == null) {
-    $color-name: $name;
-  }
-
-  .u-text-#{$prefix}#{$name} {
-    @include text-bg.current-color-vars-important(--u-color-#{$prefix}#{$color-name});
-  }
-}
-
-@each $color in variables.$color-roles {
-  @include _text-variant-block($color, $color);
-}
-
-@each $color in variables.$fixed-colors {
-  @include _text-variant($color);
-  @include _text-variant(on-#{$color});
-  @include _text-variant(#{$color}-container);
-  @include _text-variant(on-#{$color}-container);
-}
-
-@each $color in variables.$theme-colors {
-  @include _text-variant(#{$color}-fixed);
-  @include _text-variant(#{$color}-fixed-dim);
-  @include _text-variant(on-#{$color}-fixed);
-  @include _text-variant(on-#{$color}-fixed-variant);
-}
-
-@include _text-variant(on-body);
-@include _text-variant(on-inverse-body);
-@include _text-variant(on-light);
-@include _text-variant(on-dark);
-