From 034751fc384404f6ee088954106da9808c1695f1 Mon Sep 17 00:00:00 2001
From: Quinton Jason <quinton.jason@gmail.com>
Date: Wed, 7 Aug 2024 15:44:31 -0500
Subject: [PATCH] fix(frame): add white background to bordered variant

---
 packages/sage-assets/lib/stylesheets/layout/_frame.scss | 8 ++------
 1 file changed, 2 insertions(+), 6 deletions(-)

diff --git a/packages/sage-assets/lib/stylesheets/layout/_frame.scss b/packages/sage-assets/lib/stylesheets/layout/_frame.scss
index a543613e65..5e615b7b82 100644
--- a/packages/sage-assets/lib/stylesheets/layout/_frame.scss
+++ b/packages/sage-assets/lib/stylesheets/layout/_frame.scss
@@ -145,7 +145,7 @@ $-sage-frame-wraps: (
 // 2. Variables for default settings
 //
 $-sage-frame-alignment: top-left;
-$-sage-frame-background: sage-color(white);
+$-sage-frame-background: transparent;
 $-sage-frame-border: none;
 $-sage-frame-border-radius: none;
 $-sage-frame-direction: vertical;
@@ -164,11 +164,6 @@ $-sage-frame-wrap: none;
 // Root element
 .sage-frame {
   display: flex;
-  background-color: $-sage-frame-background;
-
-  .sage-frame {
-    background-color: inherit; // ensures nested frames inherit the main parent frame background color
-  }
 
   // Add default settings
   &:not([class*="sage-frame--align-"]) {
@@ -221,6 +216,7 @@ $-sage-frame-wrap: none;
 
 @each $-key, $-val in $-sage-frame-borders {
   .sage-frame--border-#{$-key} {
+    background-color: sage-color(white);
     border: #{$-val};
   }
 }