From 24030327915704b868b88f693455dc2716599511 Mon Sep 17 00:00:00 2001
From: MrPowerGamerBR <git@mrpowergamerbr.com>
Date: Wed, 13 Nov 2024 22:25:37 -0300
Subject: [PATCH] Improve profile design and background previews to preview
 with the user's current background and profile design

---
 .../website/views/dashboard/user/DailyShopView.kt   | 13 +++----------
 .../main/sass-dashboard/components/_daily-shop.scss |  9 +++++++++
 2 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/loritta-bot-discord/src/main/kotlin/net/perfectdreams/loritta/morenitta/website/views/dashboard/user/DailyShopView.kt b/loritta-bot-discord/src/main/kotlin/net/perfectdreams/loritta/morenitta/website/views/dashboard/user/DailyShopView.kt
index ecedefdf72..a6f79482d4 100644
--- a/loritta-bot-discord/src/main/kotlin/net/perfectdreams/loritta/morenitta/website/views/dashboard/user/DailyShopView.kt
+++ b/loritta-bot-discord/src/main/kotlin/net/perfectdreams/loritta/morenitta/website/views/dashboard/user/DailyShopView.kt
@@ -173,7 +173,7 @@ class DailyShopView(
 
                                                             img(
                                                                 classes = "canvas-preview",
-                                                                src = "/api/v1/users/@me/profile?type=${activeProfileDesignId}"
+                                                                src = "/api/v1/users/@me/profile?type=${activeProfileDesignId}&background=${shopItem.internalName}"
                                                             ) {
                                                                 style = "width: 400px; aspect-ratio: 4/3;"
                                                             }
@@ -280,14 +280,7 @@ class DailyShopView(
                                                     div(classes = "canvas-preview-wrapper-wrapper") {
                                                         div(classes = "canvas-preview-wrapper") {
                                                             img(
-                                                                classes = "canvas-preview-only-bg",
-                                                                src = "/api/v1/users/@me/profile?type=${shopItem.internalName}&background=${activeBackgroundId}"
-                                                            ) {
-                                                                style = "width: 400px; aspect-ratio: 4/3;"
-                                                            }
-
-                                                            img(
-                                                                classes = "canvas-preview",
+                                                                classes = "canvas-preview-profile-design",
                                                                 src = "/api/v1/users/@me/profile?type=${shopItem.internalName}&background=${activeBackgroundId}"
                                                             ) {
                                                                 style = "width: 400px; aspect-ratio: 4/3;"
@@ -371,7 +364,7 @@ class DailyShopView(
                                                 }
 
                                                 is ProfileDesignItemWrapper -> {
-                                                    "/api/v1/users/@me/profile?type=${shopItem.internalName}"
+                                                    "/api/v1/users/@me/profile?type=${shopItem.internalName}&background=${activeBackgroundId}"
                                                 }
                                             }
 
diff --git a/loritta-bot-discord/src/main/sass-dashboard/components/_daily-shop.scss b/loritta-bot-discord/src/main/sass-dashboard/components/_daily-shop.scss
index fd066ca1e4..64b05e28b4 100644
--- a/loritta-bot-discord/src/main/sass-dashboard/components/_daily-shop.scss
+++ b/loritta-bot-discord/src/main/sass-dashboard/components/_daily-shop.scss
@@ -177,6 +177,15 @@
   max-width: 100%;
 }
 
+.canvas-preview-profile-design {
+  transition-duration: 0.3s;
+  height: auto;
+  transform: rotateY(-10deg);
+  margin-bottom: 50px;
+  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.9);
+  max-width: 100%;
+}
+
 .canvas-preview:hover {
   opacity: 0;
   transition-duration: 0.3s;