Remove transition function, fixes

scss/config/_typography.scss

@@ -5,6 +5,7 @@
 $typography: () !default;
 $typography: map.merge(
   (
+    'border-radius': map.get($display, 'border-radius-sm'),
     'font-family-base': #{Seravek, 'Gill Sans Nova', Ubuntu, Calibri, 'DejaVu Sans', source-sans-pro, sans-serif},
     'font-family-cursive': #{ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace},
     'font-family-heading': #{Avenir, 'Avenir Next LT Pro', Montserrat, Corbel, 'URW Gothic', source-sans-pro, sans-serif},
@@ -15,7 +16,6 @@ $typography: map.merge(
     'font-size-sm': 0.875rem,
     'font-weight-base': null,
     'font-weight-heading': 700,
-    'inline-border-radius': map.get($display, 'border-radius-sm'),
     'inline-padding': 0.1em 0.3em,
     'letter-spacing-heading': null,
     'line-height-base': 1.8,

scss/element/_default.scss

@@ -32,9 +32,9 @@
   a {
     color: color('link');
     text-decoration: underline;
-    transition-duration: transition('duration');
+    transition-duration: config('duration', $transition);
     transition-property: color;
-    transition-timing-function: transition('timing-function');
+    transition-timing-function: config('timing-function', $transition);
 
     &:hover {
       color: color('link-hover');

scss/element/_root.scss

@@ -7,9 +7,11 @@
   @include generate-color-variables;
 
   :root {
-    @media (prefers-reduced-motion: no-preference) {
-      --#{$internal-prefix}duration: #{config('duration', $transition, false)};
-      --#{$internal-prefix}timing-function: #{config('timing-function', $transition, false)};
+    @if setting('css-custom-properties') {
+      @media (prefers-reduced-motion: no-preference) {
+        --#{$internal-prefix}duration: #{config('duration', $transition, false)};
+        --#{$internal-prefix}timing-function: #{config('timing-function', $transition, false)};
+      }
     }
 
     @if map.get($generators, 'content', 'typography') {

scss/element/_typography.scss

@@ -15,7 +15,7 @@
     line-height: config('line-height-base', $typography);
   }
 
-  @if setting(hyphens) {
+  @if setting('hyphens') {
     p,
     li,
     h1,
@@ -130,7 +130,7 @@
 
   mark {
     background-color: color('mark-background');
-    border-radius: config('inline-border-radius', $typography);
+    border-radius: config('border-radius', $typography);
     color: color('mark-foreground');
     padding: config('inline-padding', $typography);
   }
@@ -139,7 +139,7 @@
   kbd,
   samp {
     background-color: color('code-background');
-    border-radius: config('inline-border-radius', $typography);
+    border-radius: config('border-radius', $typography);
     color: color('code-foreground');
     padding: config('inline-padding', $typography);
   }

scss/form/_button.scss

@@ -29,9 +29,9 @@
     text-align: start;
     text-decoration: none;
     text-transform: config('text-transform', $btn);
-    transition-duration: transition(duration);
+    transition-duration: config('duration', $transition);
     transition-property: background-color, border-color, box-shadow, color;
-    transition-timing-function: transition(timing-function);
+    transition-timing-function: config('timing-function', $transition);
   }
 
   #{$selector}:focus {

scss/form/_check.scss

@@ -59,9 +59,9 @@
       inline-size: 1em;
       line-height: 1;
       margin-block: config('margin-block', $form-check);
-      transition-duration: transition('duration');
+      transition-duration: config('duration', $transition);
       transition-property: border, box-shadow;
-      transition-timing-function: transition('timing-function');
+      transition-timing-function: config('timing-function', $transition);
 
       &[type='radio'] {
         border-radius: 50%;

scss/form/_control.scss

@@ -25,9 +25,9 @@
     inline-size: 100%;
     line-height: config('line-height', $form-control);
     padding: config('padding', $form-control);
-    transition-duration: transition('duration');
+    transition-duration: config('duration', $transition);
     transition-property: border, box-shadow;
-    transition-timing-function: transition('timing-function');
+    transition-timing-function: config('timing-function', $transition);
 
     &::placeholder {
       color: color('placeholder', 'form');

scss/form/_label.scss

@@ -10,6 +10,6 @@
     font-style: map.get($form-label, 'font-style');
     font-weight: map.get($form-label, 'font-weight');
     line-height: map.get($typography, 'line-height-md');
-    text-align: map.get($form-label, 'text-align');;
+    text-align: map.get($form-label, 'text-align');
   }
 }

scss/form/_switch.scss

@@ -67,9 +67,9 @@
       inline-size: 2em;
       line-height: 1;
       margin-block: config('margin-block', $form-switch);
-      transition-duration: transition('duration');
+      transition-duration: config('duration', $transition);
       transition-property: background-position, border, box-shadow;
-      transition-timing-function: transition('timing-function');
+      transition-timing-function: config('timing-function', $transition);
 
       &:focus-visible {
         @include focus-ring(

scss/function/_index.scss

@@ -5,4 +5,3 @@
 @forward 'utilities';
 @forward 'setting';
 @forward 'spacer';
-@forward 'transition';

scss/mixin/_layout.scss

@@ -13,9 +13,7 @@
   $gap: m,
   $max-inline-size: config('container-inline-size', $layout)
 ) {
-  @if meta.type-of($gap) == string and string.index($gap, ':') {
-    $gap: spacer($gap);
-  } @else if map.has-key($spacers, $gap) {
+  @if map.has-key($spacers, $gap) {
     $gap: map.get($spacers, $gap);
   }
 
@@ -37,9 +35,7 @@
   $align: none,
   $important: false
 ) {
-  @if meta.type-of($gap) == string and string.index($gap, ':') {
-    $gap: spacer($gap);
-  } @else if map.has-key($spacers, $gap) {
+  @if map.has-key($spacers, $gap) {
     $gap: map.get($spacers, $gap);
   }
 

scss/mixin/_transition.scss

@@ -1,5 +1,6 @@
 @use 'sass:string';
 @use '../function' as *;
+@use '../config' as *;
 
 /// Generates transition related declarations.
 /// @param {string} $duration - The duration of the transition.
@@ -8,19 +9,11 @@
 /// @return {string} - The generated transition declarations.
 /// @throws {error} - If the duration or timing-function is invalid.
 @mixin transition(
-  $duration: duration,
+  $duration: config('duration', $transition),
   $property: all,
-  $timing-function: timing-function,
+  $timing-function: config('timing-function', $transition),
 ) {
-  @if $duration == duration {
-    transition-duration: transition($duration);
-  } @else {
-    transition-duration: $duration;
-  }
+  transition-duration: $duration;
   transition-property: string.unquote($property);
-  @if $timing-function == timing-function {
-    transition-timing-function: transition($timing-function);
-  } @else {
-    transition-timing-function: $timing-function;
-  }
+  transition-timing-function: $timing-function;
 }