Improve use of CSS vars in Toasts

diff --git a/scss/_toasts.scss b/scss/_toasts.scss
index 68f110b66eb220d842d2b1581cfa5a10d1a032ca..4663e885cebdf7801b12997331edcc3ed66a0db1 100644 (file)
--- a/scss/_toasts.scss
+++ b/scss/_toasts.scss
@@ -2,6 +2,7 @@
   // scss-docs-start toast-css-vars
   --#{$prefix}toast-padding-x: #{$toast-padding-x};
   --#{$prefix}toast-padding-y: #{$toast-padding-y};
+  --#{$prefix}toast-spacing: #{$toast-spacing};
   --#{$prefix}toast-max-width: #{$toast-max-width};
   @include rfs($toast-font-size, --#{$prefix}toast-font-size);
   --#{$prefix}toast-color: #{$toast-color}; // stylelint-disable-line custom-property-empty-line-before
@@ -17,7 +18,7 @@
 
   width: var(--#{$prefix}toast-max-width);
   max-width: 100%;
-  @include font-size($toast-font-size);
+  @include font-size(var(--#{$prefix}toast-font-size));
   color: var(--#{$prefix}toast-color);
   pointer-events: auto;
   background-color: var(--#{$prefix}toast-bg);
@@ -43,7 +44,7 @@
   pointer-events: none;
 
   > :not(:last-child) {
-    margin-bottom: $toast-spacing;
+    margin-bottom: var(--#{$prefix}toast-spacing);
   }
 }