From f71843a7d3cafaef6c61a722c30d6b36d982d6a7 Mon Sep 17 00:00:00 2001
From: syuilo <4439005+syuilo@users.noreply.github.com>
Date: Sat, 5 Apr 2025 19:45:11 +0900
Subject: refactor(frontend): refactor divider of panel style

---
 packages/frontend/src/components/MkContainer.vue | 7 ++++++-
 packages/frontend/src/ui/deck/column.vue         | 7 ++++++-
 2 files changed, 12 insertions(+), 2 deletions(-)

(limited to 'packages/frontend/src')

diff --git a/packages/frontend/src/components/MkContainer.vue b/packages/frontend/src/components/MkContainer.vue
index 29165d7b71..1993991106 100644
--- a/packages/frontend/src/components/MkContainer.vue
+++ b/packages/frontend/src/components/MkContainer.vue
@@ -181,11 +181,16 @@ onUnmounted(() => {
 	left: 0;
 	color: var(--MI_THEME-panelHeaderFg);
 	background: var(--MI_THEME-panelHeaderBg);
-	border-bottom: solid 0.5px var(--MI_THEME-panelHeaderDivider);
 	z-index: 2;
 	line-height: 1.4em;
 }
 
+@container style(--MI_THEME-panelHeaderBg: var(--MI_THEME-panel)) {
+	.header {
+		box-shadow: 0 0.5px 0 0 light-dark(#0002, #fff2);
+	}
+}
+
 .title {
 	margin: 0;
 	padding: 12px 16px;
diff --git a/packages/frontend/src/ui/deck/column.vue b/packages/frontend/src/ui/deck/column.vue
index 3d359b05c2..6c9d001db6 100644
--- a/packages/frontend/src/ui/deck/column.vue
+++ b/packages/frontend/src/ui/deck/column.vue
@@ -413,11 +413,16 @@ function onDrop(ev) {
 	font-size: 0.9em;
 	color: var(--MI_THEME-panelHeaderFg);
 	background: var(--MI_THEME-panelHeaderBg);
-	box-shadow: 0 0.5px 0 0 var(--MI_THEME-panelHeaderDivider);
 	cursor: pointer;
 	user-select: none;
 }
 
+@container style(--MI_THEME-panelHeaderBg: var(--MI_THEME-panel)) {
+	.header {
+		box-shadow: 0 0.5px 0 0 light-dark(#0002, #fff2);
+	}
+}
+
 .color {
 	position: absolute;
 	top: 12px;
-- 
cgit v1.2.3-freya