@graupl/graupl 1.0.0-beta.0 → 1.0.0-beta.1

package/src/scss/base/link/_variables.scss

@@ -11,163 +11,163 @@
 
 // Link properties.
 $link-text-decoration: var(
-  --#{root-defaults.$prefix}-link-text-decoration,
+  --#{root-defaults.$prefix}link-text-decoration,
   #{defaults.$link-text-decoration}
 );
 $link-visited-text-decoration: var(
-  --#{root-defaults.$prefix}-link-visited-text-decoration,
+  --#{root-defaults.$prefix}link-visited-text-decoration,
   #{defaults.$link-visited-text-decoration}
 );
 $link-focus-text-decoration: var(
-  --#{root-defaults.$prefix}-link-focus-text-decoration,
+  --#{root-defaults.$prefix}link-focus-text-decoration,
   #{defaults.$link-focus-text-decoration}
 );
 $link-hover-text-decoration: var(
-  --#{root-defaults.$prefix}-link-hover-text-decoration,
+  --#{root-defaults.$prefix}link-hover-text-decoration,
   #{defaults.$link-hover-text-decoration}
 );
 $link-active-text-decoration: var(
-  --#{root-defaults.$prefix}-link-active-text-decoration,
+  --#{root-defaults.$prefix}link-active-text-decoration,
   #{defaults.$link-active-text-decoration}
 );
 $link-disabled-text-decoration: var(
-  --#{root-defaults.$prefix}-link-disabled-text-decoration,
+  --#{root-defaults.$prefix}link-disabled-text-decoration,
   #{defaults.$link-disabled-text-decoration}
 );
 $link-text-decoration-thickness: var(
-  --#{root-defaults.$prefix}-link-text-decoration-thickness,
+  --#{root-defaults.$prefix}link-text-decoration-thickness,
   #{root-variables.$border-width}
 );
 $link-visited-text-decoration-thickness: var(
-  --#{root-defaults.$prefix}-link-visited-text-decoration-thickness,
+  --#{root-defaults.$prefix}link-visited-text-decoration-thickness,
   #{root-variables.$border-width}
 );
 $link-focus-text-decoration-thickness: var(
-  --#{root-defaults.$prefix}-link-focus-text-decoration-thickness,
+  --#{root-defaults.$prefix}link-focus-text-decoration-thickness,
   #{root-variables.$border-width}
 );
 $link-hover-text-decoration-thickness: var(
-  --#{root-defaults.$prefix}-link-hover-text-decoration-thickness,
+  --#{root-defaults.$prefix}link-hover-text-decoration-thickness,
   #{root-variables.$border-width}
 );
 $link-active-text-decoration-thickness: var(
-  --#{root-defaults.$prefix}-link-active-text-decoration-thickness,
+  --#{root-defaults.$prefix}link-active-text-decoration-thickness,
   #{root-variables.$border-width}
 );
 $link-disabled-text-decoration-thickness: var(
-  --#{root-defaults.$prefix}-link-disabled-text-decoration-thickness,
+  --#{root-defaults.$prefix}link-disabled-text-decoration-thickness,
   #{root-variables.$border-width}
 );
 $link-text-decoration-style: var(
-  --#{root-defaults.$prefix}-link-text-decoration-style,
+  --#{root-defaults.$prefix}link-text-decoration-style,
   #{defaults.$link-text-decoration-style}
 );
 $link-visited-text-decoration-style: var(
-  --#{root-defaults.$prefix}-link-visited-text-decoration-style,
+  --#{root-defaults.$prefix}link-visited-text-decoration-style,
   #{defaults.$link-visited-text-decoration-style}
 );
 $link-focus-text-decoration-style: var(
-  --#{root-defaults.$prefix}-link-focus-text-decoration-style,
+  --#{root-defaults.$prefix}link-focus-text-decoration-style,
   #{defaults.$link-focus-text-decoration-style}
 );
 $link-hover-text-decoration-style: var(
-  --#{root-defaults.$prefix}-link-hover-text-decoration-style,
+  --#{root-defaults.$prefix}link-hover-text-decoration-style,
   #{defaults.$link-hover-text-decoration-style}
 );
 $link-active-text-decoration-style: var(
-  --#{root-defaults.$prefix}-link-active-text-decoration-style,
+  --#{root-defaults.$prefix}link-active-text-decoration-style,
   #{defaults.$link-active-text-decoration-style}
 );
 $link-disabled-text-decoration-style: var(
-  --#{root-defaults.$prefix}-link-disabled-text-decoration-style,
+  --#{root-defaults.$prefix}link-disabled-text-decoration-style,
   #{defaults.$link-disabled-text-decoration-style}
 );
 $link-color: var(
-  --#{root-defaults.$prefix}-link-color,
+  --#{root-defaults.$prefix}link-color,
   #{theme.get(primary, 700)}
 );
 $link-visited-color: var(
-  --#{root-defaults.$prefix}-link-visited-color,
+  --#{root-defaults.$prefix}link-visited-color,
   #{theme.get(primary, 700)}
 );
 $link-focus-color: var(
-  --#{root-defaults.$prefix}-link-focus-color,
+  --#{root-defaults.$prefix}link-focus-color,
   #{theme.get(primary, 700)}
 );
 $link-hover-color: var(
-  --#{root-defaults.$prefix}-link-hover-color,
+  --#{root-defaults.$prefix}link-hover-color,
   #{theme.get(tertiary, 700)}
 );
 $link-active-color: var(
-  --#{root-defaults.$prefix}-link-active-color,
+  --#{root-defaults.$prefix}link-active-color,
   #{theme.get(tertiary, 700)}
 );
 $link-disabled-color: var(
-  --#{root-defaults.$prefix}-link-disabled-color,
+  --#{root-defaults.$prefix}link-disabled-color,
   #{theme.get(primary, 200)}
 );
 $link-text-decoration-color: var(
-  --#{root-defaults.$prefix}-link-text-decoration-color,
+  --#{root-defaults.$prefix}link-text-decoration-color,
   #{$link-color}
 );
 $link-visited-text-decoration-color: var(
-  --#{root-defaults.$prefix}-link-visited-text-decoration-color,
+  --#{root-defaults.$prefix}link-visited-text-decoration-color,
   #{$link-visited-color}
 );
 $link-focus-text-decoration-color: var(
-  --#{root-defaults.$prefix}-link-focus-text-decoration-color,
+  --#{root-defaults.$prefix}link-focus-text-decoration-color,
   #{$link-focus-color}
 );
 $link-hover-text-decoration-color: var(
-  --#{root-defaults.$prefix}-link-hover-text-decoration-color,
+  --#{root-defaults.$prefix}link-hover-text-decoration-color,
   #{$link-hover-color}
 );
 $link-active-text-decoration-color: var(
-  --#{root-defaults.$prefix}-link-active-text-decoration-color,
+  --#{root-defaults.$prefix}link-active-text-decoration-color,
   #{$link-active-color}
 );
 $link-disabled-text-decoration-color: var(
-  --#{root-defaults.$prefix}-link-disabled-text-decoration-color,
+  --#{root-defaults.$prefix}link-disabled-text-decoration-color,
   #{$link-disabled-color}
 );
 $link-background: var(
-  --#{root-defaults.$prefix}-link-background,
+  --#{root-defaults.$prefix}link-background,
   #{defaults.$link-background}
 );
 $link-visited-background: var(
-  --#{root-defaults.$prefix}-link-visited-background,
+  --#{root-defaults.$prefix}link-visited-background,
   #{defaults.$link-visited-background}
 );
 $link-focus-background: var(
-  --#{root-defaults.$prefix}-link-focus-background,
+  --#{root-defaults.$prefix}link-focus-background,
   #{defaults.$link-focus-background}
 );
 $link-hover-background: var(
-  --#{root-defaults.$prefix}-link-hover-background,
+  --#{root-defaults.$prefix}link-hover-background,
   #{defaults.$link-hover-background}
 );
 $link-active-background: var(
-  --#{root-defaults.$prefix}-link-active-background,
+  --#{root-defaults.$prefix}link-active-background,
   #{defaults.$link-active-background}
 );
 $link-disabled-background: var(
-  --#{root-defaults.$prefix}-link-disabled-background,
+  --#{root-defaults.$prefix}link-disabled-background,
   #{defaults.$link-disabled-background}
 );
 $link-padding-x: var(
-  --#{root-defaults.$prefix}-link-padding-x,
+  --#{root-defaults.$prefix}link-padding-x,
   #{map.get(root-variables.$spacers, 0)}
 );
 $link-padding-y: var(
-  --#{root-defaults.$prefix}-link-padding-y,
+  --#{root-defaults.$prefix}link-padding-y,
   #{map.get(root-variables.$spacers, 0)}
 );
 $link-padding: var(
-  --#{root-defaults.$prefix}-link-padding,
+  --#{root-defaults.$prefix}link-padding,
   #{$link-padding-y} #{$link-padding-x}
 );
 $link-transition: var(
-  --#{root-defaults.$prefix}-link-transition,
+  --#{root-defaults.$prefix}link-transition,
   background #{map.get(root-variables.$transition-durations, fast)}
     #{root-variables.$transition-timing-function},
   color #{map.get(root-variables.$transition-durations, fast)}
@@ -176,87 +176,87 @@ $link-transition: var(
     #{root-variables.$transition-timing-function}
 );
 $link-transition-reduced-motion: var(
-  --#{root-defaults.$prefix}-link-transition-reduced-motion,
+  --#{root-defaults.$prefix}link-transition-reduced-motion,
   background #{map.get(root-variables.$transition-durations, none)}
     #{root-variables.$transition-timing-function},
   color #{map.get(root-variables.$transition-durations, none)}
     #{root-variables.$transition-timing-function}
 );
 $link-transform: var(
-  --#{root-defaults.$prefix}-link-transform,
+  --#{root-defaults.$prefix}link-transform,
   #{defaults.$link-transform}
 );
 $link-visited-transform: var(
-  --#{root-defaults.$prefix}-link-visited-transform,
+  --#{root-defaults.$prefix}link-visited-transform,
   #{defaults.$link-visited-transform}
 );
 $link-focus-transform: var(
-  --#{root-defaults.$prefix}-link-focus-transform,
+  --#{root-defaults.$prefix}link-focus-transform,
   #{defaults.$link-focus-transform}
 );
 $link-hover-transform: var(
-  --#{root-defaults.$prefix}-link-hover-transform,
+  --#{root-defaults.$prefix}link-hover-transform,
   #{defaults.$link-hover-transform}
 );
 $link-active-transform: var(
-  --#{root-defaults.$prefix}-link-active-transform,
+  --#{root-defaults.$prefix}link-active-transform,
   #{defaults.$link-active-transform}
 );
 $link-disabled-transform: var(
-  --#{root-defaults.$prefix}-link-disabled-transform,
+  --#{root-defaults.$prefix}link-disabled-transform,
   #{defaults.$link-disabled-transform}
 );
 $link-border-width: var(
-  --#{root-defaults.$prefix}-link-border-width,
+  --#{root-defaults.$prefix}link-border-width,
   #{defaults.$link-border-width}
 );
 $link-border-style: var(
-  --#{root-defaults.$prefix}-link-border-style,
+  --#{root-defaults.$prefix}link-border-style,
   #{root-variables.$border-style}
 );
 $link-border: var(
-  --#{root-defaults.$prefix}-link-border,
+  --#{root-defaults.$prefix}link-border,
   #{$link-border-width} #{$link-border-style}
 );
 $link-border-radius: var(
-  --#{root-defaults.$prefix}-link-border-radius,
+  --#{root-defaults.$prefix}link-border-radius,
   #{root-variables.$border-radius}
 );
 $link-border-color: var(
-  --#{root-defaults.$prefix}-link-border-color,
+  --#{root-defaults.$prefix}link-border-color,
   #{defaults.$link-border-color}
 );
 $link-visited-border-color: var(
-  --#{root-defaults.$prefix}-link-visited-border-color,
+  --#{root-defaults.$prefix}link-visited-border-color,
   #{defaults.$link-visited-border-color}
 );
 $link-focus-border-color: var(
-  --#{root-defaults.$prefix}-link-focus-border-color,
+  --#{root-defaults.$prefix}link-focus-border-color,
   #{defaults.$link-focus-border-color}
 );
 $link-hover-border-color: var(
-  --#{root-defaults.$prefix}-link-hover-border-color,
+  --#{root-defaults.$prefix}link-hover-border-color,
   #{defaults.$link-hover-border-color}
 );
 $link-active-border-color: var(
-  --#{root-defaults.$prefix}-link-active-border-color,
+  --#{root-defaults.$prefix}link-active-border-color,
   #{defaults.$link-active-border-color}
 );
 $link-disabled-border-color: var(
-  --#{root-defaults.$prefix}-link-disabled-border-color,
+  --#{root-defaults.$prefix}link-disabled-border-color,
   #{defaults.$link-disabled-border-color}
 );
 $link-min-width: var(
-  --#{root-defaults.$prefix}-link-min-width,
+  --#{root-defaults.$prefix}link-min-width,
   defaults.$link-min-width
 );
 $link-min-height: var(
-  --#{root-defaults.$prefix}-link-min-height,
+  --#{root-defaults.$prefix}link-min-height,
   defaults.$link-min-height
 );
 
 // Stretched link properties.
 $stretched-link-z-index: var(
-  --#{root-defaults.$prefix}-stretched-link-z-index,
+  --#{root-defaults.$prefix}stretched-link-z-index,
   #{defaults.$stretched-link-z-index}
 );

package/src/scss/base/table/_index.scss

@@ -55,7 +55,7 @@
       &#{defaults.$table-theme-prefix-selector}#{$variant},
       #{defaults.$table-theme-prefix-selector}#{$variant} {
         @each $prop, $key in defaults.$table-theme-map {
-          --#{root-defaults.$prefix}-table-#{$prop}: #{theme.get(
+          --#{root-defaults.$prefix}table-#{$prop}: #{theme.get(
               $variant,
               $key
             )};
@@ -110,12 +110,12 @@
     }
 
     #{defaults.$table-highlight-selector} {
-      --#{root-defaults.$prefix}-table-cell-background: #{$table-highlight-background};
-      --#{root-defaults.$prefix}-table-cell-color: #{$table-highlight-color};
-      --#{root-defaults.$prefix}-table-header-background: #{$table-highlight-background};
-      --#{root-defaults.$prefix}-table-header-color: #{$table-highlight-color};
-      --#{root-defaults.$prefix}-table-striped-background: #{$table-highlight-background};
-      --#{root-defaults.$prefix}-table-striped-color: #{$table-highlight-color};
+      --#{root-defaults.$prefix}table-cell-background: #{$table-highlight-background};
+      --#{root-defaults.$prefix}table-cell-color: #{$table-highlight-color};
+      --#{root-defaults.$prefix}table-header-background: #{$table-highlight-background};
+      --#{root-defaults.$prefix}table-header-color: #{$table-highlight-color};
+      --#{root-defaults.$prefix}table-striped-background: #{$table-highlight-background};
+      --#{root-defaults.$prefix}table-striped-color: #{$table-highlight-color};
     }
   }
 }

package/src/scss/base/table/_variables.scss

@@ -13,123 +13,123 @@
 
 // Table caption properties.
 $table-caption-side: var(
-  --#{root-defaults.$prefix}-table-caption-side,
+  --#{root-defaults.$prefix}table-caption-side,
   #{defaults.$table-caption-side}
 );
 $table-caption-padding-x: var(
-  --#{root-defaults.$prefix}-table-caption-padding-x,
+  --#{root-defaults.$prefix}table-caption-padding-x,
   #{map.get(root-variables.$spacers, 3)}
 );
 $table-caption-padding-y: var(
-  --#{root-defaults.$prefix}-table-caption-padding-y,
+  --#{root-defaults.$prefix}table-caption-padding-y,
   #{map.get(root-variables.$spacers, 3)}
 );
 $table-caption-padding: $table-caption-padding-y $table-caption-padding-x;
 
 // Table header properties.
 $table-header-font-weight: var(
-  --#{root-defaults.$prefix}-table-header-font-weight,
+  --#{root-defaults.$prefix}table-header-font-weight,
   #{typography.$font-weight-bold}
 );
 $table-header-padding-x: var(
-  --#{root-defaults.$prefix}-table-header-padding-x,
+  --#{root-defaults.$prefix}table-header-padding-x,
   #{map.get(root-variables.$spacers, 3)}
 );
 $table-header-padding-y: var(
-  --#{root-defaults.$prefix}-table-header-padding-y,
+  --#{root-defaults.$prefix}table-header-padding-y,
   #{map.get(root-variables.$spacers, 3)}
 );
 $table-header-padding: $table-header-padding-y $table-header-padding-x;
 $table-header-background: var(
-  --#{root-defaults.$prefix}-table-header-background,
+  --#{root-defaults.$prefix}table-header-background,
   #{color.$root-background}
 );
 $table-header-color: var(
-  --#{root-defaults.$prefix}-table-header-color,
+  --#{root-defaults.$prefix}table-header-color,
   #{color.$root-color}
 );
 
 // Table cell properties.
 $table-cell-padding-x: var(
-  --#{root-defaults.$prefix}-table-cell-padding-x,
+  --#{root-defaults.$prefix}table-cell-padding-x,
   #{map.get(root-variables.$spacers, 3)}
 );
 $table-cell-padding-y: var(
-  --#{root-defaults.$prefix}-table-cell-padding-y,
+  --#{root-defaults.$prefix}table-cell-padding-y,
   #{map.get(root-variables.$spacers, 3)}
 );
 $table-cell-padding: $table-cell-padding-y $table-cell-padding-x;
 $table-cell-background: var(
-  --#{root-defaults.$prefix}-table-cell-background,
+  --#{root-defaults.$prefix}table-cell-background,
   #{color.$root-background}
 );
 $table-cell-color: var(
-  --#{root-defaults.$prefix}-table-cell-color,
+  --#{root-defaults.$prefix}table-cell-color,
   #{color.$root-color}
 );
 
 // Table border properties.
 $table-border-width: var(
-  --#{root-defaults.$prefix}-table-border-width,
+  --#{root-defaults.$prefix}table-border-width,
   #{root-variables.$border-width}
 );
 $table-border-style: var(
-  --#{root-defaults.$prefix}-table-border-style,
+  --#{root-defaults.$prefix}table-border-style,
   #{root-variables.$border-style}
 );
 $table-border: var(
-  --#{root-defaults.$prefix}-table-border,
+  --#{root-defaults.$prefix}table-border,
   #{$table-border-width} #{$table-border-style}
 );
 $table-border-color: var(
-  --#{root-defaults.$prefix}-table-border-color,
+  --#{root-defaults.$prefix}table-border-color,
   #{theme.get(primary, 900)}
 );
 
 // Table cell border properties.
 $table-cell-border-width: var(
-  --#{root-defaults.$prefix}-table-cell-border-width,
+  --#{root-defaults.$prefix}table-cell-border-width,
   #{$table-border-width}
 );
 $table-cell-border-style: var(
-  --#{root-defaults.$prefix}-table-cell-border-style,
+  --#{root-defaults.$prefix}table-cell-border-style,
   #{$table-border-style}
 );
 $table-cell-border: var(
-  --#{root-defaults.$prefix}-table-cell-border,
+  --#{root-defaults.$prefix}table-cell-border,
   #{$table-cell-border-width} #{$table-cell-border-style}
 );
 $table-cell-border-color: var(
-  --#{root-defaults.$prefix}-table-cell-border-color,
+  --#{root-defaults.$prefix}table-cell-border-color,
   #{$table-border-color}
 );
 
 // Table striped properties.
 $table-striped-background: var(
-  --#{root-defaults.$prefix}-table-striped-background,
+  --#{root-defaults.$prefix}table-striped-background,
   #{theme.get(secondary, 200)}
 );
 $table-striped-color: var(
-  --#{root-defaults.$prefix}-table-striped-color,
+  --#{root-defaults.$prefix}table-striped-color,
   #{theme.get(secondary, 900)}
 );
 
 // Table hover properties.
 $table-hover-background: var(
-  --#{root-defaults.$prefix}-table-hover-background,
+  --#{root-defaults.$prefix}table-hover-background,
   #{theme.get(secondary, 300)}
 );
 $table-hover-color: var(
-  --#{root-defaults.$prefix}-table-hover-color,
+  --#{root-defaults.$prefix}table-hover-color,
   #{theme.get(secondary, 900)}
 );
 
 // Table highlight properties.
 $table-highlight-background: var(
-  --#{root-defaults.$prefix}-table-highlight-background,
+  --#{root-defaults.$prefix}table-highlight-background,
   #{theme.get(secondary, 500)}
 );
 $table-highlight-color: var(
-  --#{root-defaults.$prefix}-table-highlight-color,
+  --#{root-defaults.$prefix}table-highlight-color,
   #{theme.get(secondary, 100)}
 );

package/src/scss/component/accordion/_index.scss

@@ -55,7 +55,7 @@
 
   @include layer(state) {
     #{defaults.$accordion-item-toggle-selector} {
-      --#{root-defaults.$prefix}-focus-outline-offset: calc(
+      --#{root-defaults.$prefix}focus-outline-offset: calc(
         -1 * (#{$accordion-item-border-width} + #{focus.$focus-width})
       );
     }
@@ -77,31 +77,31 @@
 
     @each $selector in map.get(root-defaults.$state-selectors, visited) {
       &#{$selector} {
-        --#{root-defaults.$prefix}-accordion-item-toggle-transform: #{$accordion-item-toggle-visited-transform};
+        --#{root-defaults.$prefix}accordion-item-toggle-transform: #{$accordion-item-toggle-visited-transform};
       }
     }
 
     @each $selector in map.get(root-defaults.$state-selectors, focus) {
       &#{$selector} {
-        --#{root-defaults.$prefix}-accordion-item-toggle-transform: #{$accordion-item-toggle-focus-transform};
+        --#{root-defaults.$prefix}accordion-item-toggle-transform: #{$accordion-item-toggle-focus-transform};
       }
     }
 
     @each $selector in map.get(root-defaults.$state-selectors, hover) {
       &#{$selector} {
-        --#{root-defaults.$prefix}-accordion-item-toggle-transform: #{$accordion-item-toggle-hover-transform};
+        --#{root-defaults.$prefix}accordion-item-toggle-transform: #{$accordion-item-toggle-hover-transform};
       }
     }
 
     @each $selector in map.get(root-defaults.$state-selectors, active) {
       &#{$selector} {
-        --#{root-defaults.$prefix}-accordion-item-toggle-transform: #{$accordion-item-toggle-active-transform};
+        --#{root-defaults.$prefix}accordion-item-toggle-transform: #{$accordion-item-toggle-active-transform};
       }
     }
 
     @each $selector in map.get(root-defaults.$state-selectors, disabled) {
       &#{$selector} {
-        --#{root-defaults.$prefix}-accordion-item-toggle-transform: #{$accordion-item-toggle-disabled-transform};
+        --#{root-defaults.$prefix}accordion-item-toggle-transform: #{$accordion-item-toggle-disabled-transform};
       }
     }