From 2a9a7f8b542e2c825c2fbec8d32427c296d9fd36 Mon Sep 17 00:00:00 2001
From: aidewoode <aidewoode@gmail.com>
Date: Tue, 23 Aug 2022 08:52:25 +0000
Subject: [PATCH] Change the style of badge

---
 app/assets/stylesheets/components/_badge.scss | 1 +
 app/assets/stylesheets/settings/_theme.scss   | 8 ++++----
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/app/assets/stylesheets/components/_badge.scss b/app/assets/stylesheets/components/_badge.scss
index f01dea43..9761762a 100644
--- a/app/assets/stylesheets/components/_badge.scss
+++ b/app/assets/stylesheets/components/_badge.scss
@@ -7,4 +7,5 @@
   color: var(--badge-color);
   font-size: font-size("small");
   padding: 2px 13px;
+  font-weight: 500;
 }
diff --git a/app/assets/stylesheets/settings/_theme.scss b/app/assets/stylesheets/settings/_theme.scss
index 671d837d..fe253c12 100644
--- a/app/assets/stylesheets/settings/_theme.scss
+++ b/app/assets/stylesheets/settings/_theme.scss
@@ -109,8 +109,8 @@
   --player-progress-color: #{$purple};
 
   /* Badge */
-  --badge-bg-color: #{$purple};
-  --badge-color: #{$white};
+  --badge-bg-color: #{color.change($purple-light, $alpha: 0.2)};
+  --badge-color: #{$purple};
 
   /* Card */
   --card-border-color: #{$grey-lighter};
@@ -224,8 +224,8 @@
   --player-progress-color: #{$purple};
 
   /* Badge */
-  --badge-bg-color: #{$purple};
-  --badge-color: #{$white};
+  --badge-bg-color: #{color.change($purple, $alpha: 0.2)};
+  --badge-color: #{$purple-light};
 
   /* Card */
   --card-border-color: #{$black-lighter};