From d9c67bef606e98f21e79db25cf0ee06a3410458f Mon Sep 17 00:00:00 2001
From: Braks <78412429+bcakmakoglu@users.noreply.github.com>
Date: Thu, 17 Mar 2022 17:22:01 +0100
Subject: [PATCH] update(background): use bgColor on extra rect

---
 src/additional-components/Background/Background.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/additional-components/Background/Background.vue b/src/additional-components/Background/Background.vue
index bc31c208..ac873a75 100644
--- a/src/additional-components/Background/Background.vue
+++ b/src/additional-components/Background/Background.vue
@@ -58,11 +58,9 @@ export default {
     :style="{
       height: `${props.height > 100 ? 100 : props.height}%`,
       width: `${props.width > 100 ? 100 : props.width}%`,
-      backgroundColor: props.bgColor ?? '#fff',
     }"
   >
     <pattern
-      v-if="props.variant !== BackgroundVariant.None"
       :id="patternId"
       :x="background.xOffset"
       :y="background.yOffset"
@@ -76,6 +74,9 @@ export default {
       <template v-else-if="props.variant === BackgroundVariant.Dots">
         <circle :cx="background.size" :cy="background.size" :r="background.size" :fill="patternColor" />
       </template>
+      <svg height="100" width="100">
+        <rect width="100%" height="100%" :fill="props.bgColor" />
+      </svg>
     </pattern>
     <rect :x="props.x" :y="props.y" width="100%" height="100%" :fill="`url(#${patternId})`" />
     <slot></slot>