diff --git a/packages/frontend-shared/themes/_dark.json5 b/packages/frontend-shared/themes/_dark.json5 index cefc5edb72..022e567113 100644 --- a/packages/frontend-shared/themes/_dark.json5 +++ b/packages/frontend-shared/themes/_dark.json5 @@ -26,7 +26,6 @@ panelHighlight: ':lighten<3<@panel', panelHeaderBg: ':lighten<3<@panel', panelHeaderFg: '@fg', - panelHeaderDivider: 'rgba(0, 0, 0, 0)', panelBorder: '" solid 1px var(--MI_THEME-divider)', windowHeader: ':alpha<0.85<@panel', popup: ':lighten<3<@panel', diff --git a/packages/frontend-shared/themes/_light.json5 b/packages/frontend-shared/themes/_light.json5 index 25e6e5ab7f..9738ee5d5f 100644 --- a/packages/frontend-shared/themes/_light.json5 +++ b/packages/frontend-shared/themes/_light.json5 @@ -26,7 +26,6 @@ panelHighlight: ':darken<3<@panel', panelHeaderBg: ':lighten<3<@panel', panelHeaderFg: '@fg', - panelHeaderDivider: 'rgba(0, 0, 0, 0)', panelBorder: '" solid 1px var(--MI_THEME-divider)', windowHeader: ':alpha<0.85<@panel', popup: ':lighten<3<@panel', diff --git a/packages/frontend-shared/themes/d-astro.json5 b/packages/frontend-shared/themes/d-astro.json5 index 5e721534d3..6d34665528 100644 --- a/packages/frontend-shared/themes/d-astro.json5 +++ b/packages/frontend-shared/themes/d-astro.json5 @@ -46,7 +46,6 @@ fgOnWhite: '@accent', panelHighlight: ':lighten<3<@panel', scrollbarHandle: 'rgba(255, 255, 255, 0.2)', - panelHeaderDivider: 'rgba(0, 0, 0, 0)', scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)', }, } diff --git a/packages/frontend-shared/themes/d-botanical.json5 b/packages/frontend-shared/themes/d-botanical.json5 index 507880aab1..5a57a14f13 100644 --- a/packages/frontend-shared/themes/d-botanical.json5 +++ b/packages/frontend-shared/themes/d-botanical.json5 @@ -14,7 +14,6 @@ fgOnWhite: '@accent', divider: 'rgba(255, 255, 255, 0.14)', panel: 'rgb(47, 47, 44)', - panelHeaderDivider: 'rgba(0, 0, 0, 0)', header: ':alpha<0.7<@panel', navBg: '#363636', renote: '@accent', diff --git a/packages/frontend-shared/themes/d-dark.json5 b/packages/frontend-shared/themes/d-dark.json5 index ae4f7d53f5..67d49aa861 100644 --- a/packages/frontend-shared/themes/d-dark.json5 +++ b/packages/frontend-shared/themes/d-dark.json5 @@ -14,7 +14,6 @@ fgOnWhite: '@accent', divider: 'rgba(255, 255, 255, 0.14)', panel: '#2d2d2d', - panelHeaderDivider: 'rgba(0, 0, 0, 0)', header: ':alpha<0.7<@panel', navBg: '#363636', renote: '@accent', diff --git a/packages/frontend-shared/themes/d-future.json5 b/packages/frontend-shared/themes/d-future.json5 index f2c1f3eb86..6a66f2eca9 100644 --- a/packages/frontend-shared/themes/d-future.json5 +++ b/packages/frontend-shared/themes/d-future.json5 @@ -15,7 +15,6 @@ fgOnWhite: '@accent', divider: 'rgba(255, 255, 255, 0.1)', panel: '#18181c', - panelHeaderDivider: 'rgba(0, 0, 0, 0)', renote: '@accent', mention: '#f2c97d', mentionMe: '@accent', diff --git a/packages/frontend-shared/themes/d-green-lime.json5 b/packages/frontend-shared/themes/d-green-lime.json5 index ca4e688fdb..fcd6651197 100644 --- a/packages/frontend-shared/themes/d-green-lime.json5 +++ b/packages/frontend-shared/themes/d-green-lime.json5 @@ -15,7 +15,6 @@ fgOnWhite: '@accent', divider: '#e7fffb24', panel: '#192320', - panelHeaderDivider: 'rgba(0, 0, 0, 0)', popup: '#293330', renote: '@accent', mentionMe: '#ffaa00', diff --git a/packages/frontend-shared/themes/d-green-orange.json5 b/packages/frontend-shared/themes/d-green-orange.json5 index c2539816e2..aef3897329 100644 --- a/packages/frontend-shared/themes/d-green-orange.json5 +++ b/packages/frontend-shared/themes/d-green-orange.json5 @@ -15,7 +15,6 @@ fgOnWhite: '@accent', divider: '#e7fffb24', panel: '#192320', - panelHeaderDivider: 'rgba(0, 0, 0, 0)', popup: '#293330', renote: '@accent', mentionMe: '#b4e900', diff --git a/packages/frontend-shared/themes/d-u0.json5 b/packages/frontend-shared/themes/d-u0.json5 index ddce06649c..b0c27edc35 100644 --- a/packages/frontend-shared/themes/d-u0.json5 +++ b/packages/frontend-shared/themes/d-u0.json5 @@ -59,7 +59,6 @@ scrollbarHandle: 'rgba(255, 255, 255, 0.2)', inputBorderHover: 'rgba(255, 255, 255, 0.2)', fgTransparentWeak: ':alpha<0.75<@fg', - panelHeaderDivider: 'rgba(0, 0, 0, 0)', scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)', deckBg: '#142022', }, diff --git a/packages/frontend-shared/themes/l-botanical.json5 b/packages/frontend-shared/themes/l-botanical.json5 index 4ad539e8a0..2fbae4fbae 100644 --- a/packages/frontend-shared/themes/l-botanical.json5 +++ b/packages/frontend-shared/themes/l-botanical.json5 @@ -15,7 +15,6 @@ divider: '#cfcfcf', panel: '#ebe7e5', panelHeaderBg: '@panel', - panelHeaderDivider: '@divider', header: ':alpha<0.7<@panel', navBg: '#ebe7e5', renote: '#229e92', diff --git a/packages/frontend-shared/themes/l-light.json5 b/packages/frontend-shared/themes/l-light.json5 index 63c2e6d278..55f2d2f004 100644 --- a/packages/frontend-shared/themes/l-light.json5 +++ b/packages/frontend-shared/themes/l-light.json5 @@ -15,7 +15,6 @@ header: ':alpha<0.7<@panel', navBg: '#fff', panel: '#fff', - panelHeaderDivider: '@divider', mentionMe: 'rgb(0, 179, 70)', }, } diff --git a/packages/frontend-shared/themes/l-rainy.json5 b/packages/frontend-shared/themes/l-rainy.json5 index e7d1d5af00..d7c31bda8d 100644 --- a/packages/frontend-shared/themes/l-rainy.json5 +++ b/packages/frontend-shared/themes/l-rainy.json5 @@ -13,7 +13,6 @@ fgOnWhite: '@accent', panel: '#fff', divider: 'rgb(230 233 234)', - panelHeaderDivider: '@divider', renote: '@accent', link: '@accent', mention: '@accent', diff --git a/packages/frontend-shared/themes/l-u0.json5 b/packages/frontend-shared/themes/l-u0.json5 index d8e403c961..5ce736be37 100644 --- a/packages/frontend-shared/themes/l-u0.json5 +++ b/packages/frontend-shared/themes/l-u0.json5 @@ -61,7 +61,6 @@ scrollbarHandle: '#74747433', inputBorderHover: 'rgba(255, 255, 255, 0.2)', fgTransparentWeak: ':alpha<0.75<@fg', - panelHeaderDivider: 'rgba(0, 0, 0, 0)', scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)', }, } diff --git a/packages/frontend-shared/themes/l-vivid.json5 b/packages/frontend-shared/themes/l-vivid.json5 index d69f024a6b..2a95b37b57 100644 --- a/packages/frontend-shared/themes/l-vivid.json5 +++ b/packages/frontend-shared/themes/l-vivid.json5 @@ -49,7 +49,6 @@ panelHighlight: ':darken<3<@panel', scrollbarHandle: 'rgba(0, 0, 0, 0.2)', fgTransparentWeak: ':alpha<0.75<@fg', - panelHeaderDivider: '@divider', scrollbarHandleHover: 'rgba(0, 0, 0, 0.4)', }, } 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;