From 574fc5e53550e44d1a2886011c19ad35c274a567 Mon Sep 17 00:00:00 2001
From: upsiflu <upsiflu@gmail.com>
Date: Sun, 2 Feb 2025 19:16:50 +0100
Subject: [PATCH] feat(ui-docs): refine theme to better complement funkwhale
 component designs

---
 front/ui-docs/.vitepress/theme/Theme.vue | 29 ++++++++++++++++++++++--
 1 file changed, 27 insertions(+), 2 deletions(-)

diff --git a/front/ui-docs/.vitepress/theme/Theme.vue b/front/ui-docs/.vitepress/theme/Theme.vue
index fa076239f..0f199ff7e 100644
--- a/front/ui-docs/.vitepress/theme/Theme.vue
+++ b/front/ui-docs/.vitepress/theme/Theme.vue
@@ -55,8 +55,33 @@ const { Theme } = DefaultTheme
   }
 }
 
-.preview,
-.vp-doc .preview {
+:has(.vp-doc) .container .items {
+  background: light-dark(var(--fw-beige-100), var(--fw-gray-960));
+}
+
+.vp-doc .custom-block{
+  margin-left: -2px;
+
+  /* background-color: transparent; */
+  border-width: 0;
+  border-radius: 0;
+  border-left-width: 4px;
+
+  --vp-custom-block-details-border: currentcolor;
+  &:has(summary:hover){color: var(--fw-blue-400)}
+  --vp-custom-block-details-bg: color-mix(in oklab, var(--vp-custom-block-details-border) 0%, transparent);
+  --vp-custom-block-warning-border: var(--fw-pastel-yellow-4);
+  --vp-custom-block-warning-bg: color-mix(in oklab, var(--vp-custom-block-warning-border) 10%, transparent);
+  --vp-custom-block-info-border: var(--fw-pastel-blue-4);
+  --vp-custom-block-info-bg: color-mix(in oklab, var(--vp-custom-block-info-border) 10%, transparent);
+}
+
+.funkwhale h3 {
+  /* override vitepress */
+  margin:0;
+}
+
+.vp-doc .preview:not(.funkwhale .preview) {
   padding: 16px 0;
   flex-grow: 1;
   border-radius: 8px;