From 64374df56014b3cc8233317bc97b436872e1cb0f Mon Sep 17 00:00:00 2001
From: Olga Bulat <obulat@gmail.com>
Date: Tue, 28 Mar 2023 12:05:33 +0300
Subject: [PATCH] Fix transparent buttons

---
 frontend/src/components/VButton.vue              | 4 ++--
 frontend/src/components/meta/VButton.stories.mdx | 4 +++-
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/VButton.vue b/frontend/src/components/VButton.vue
index 54f673747ab..e7593cc4c3b 100644
--- a/frontend/src/components/VButton.vue
+++ b/frontend/src/components/VButton.vue
@@ -358,10 +358,10 @@ a.button {
   @apply border border-dark-charcoal-20 bg-white text-dark-charcoal hover:border-dark-charcoal;
 }
 .transparent-gray {
-  @apply bg-white text-dark-charcoal hover:bg-dark-charcoal-10;
+  @apply bg-tx text-dark-charcoal hover:bg-dark-charcoal-10;
 }
 .transparent-dark {
-  @apply bg-white text-dark-charcoal hover:bg-dark-charcoal hover:text-white;
+  @apply bg-tx text-dark-charcoal hover:bg-dark-charcoal hover:text-white;
 }
 
 .primary {
diff --git a/frontend/src/components/meta/VButton.stories.mdx b/frontend/src/components/meta/VButton.stories.mdx
index 3b69327cc66..5ecfca8e3f4 100644
--- a/frontend/src/components/meta/VButton.stories.mdx
+++ b/frontend/src/components/meta/VButton.stories.mdx
@@ -31,7 +31,9 @@ export const buttonSizes = allButtonSizes.filter(
 
 export const Template = (args) => ({
   template: `
-    <div id="wrapper" class="w-40 h-16 flex items-center justify-center bg-white">
+    <div id="wrapper"
+        class="w-40 h-16 flex items-center justify-center"
+        :class="args?.variant.startsWith('transparent') ? 'bg-dark-charcoal-06': 'bg-white'">
     <VButton v-bind="args" @click="onClick" href="/">
       Code is Poetry
     </VButton>