diff --git a/packages/frontend/src/components/MkContainer.vue b/packages/frontend/src/components/MkContainer.vue index 1b62a697e28e3324927262a9ed0b1d6ba17b18fa..a6372b7b6fef64d179d22703cede02596a50d1e9 100644 --- a/packages/frontend/src/components/MkContainer.vue +++ b/packages/frontend/src/components/MkContainer.vue @@ -185,6 +185,7 @@ export default defineComponent({ left: 0; color: var(--panelHeaderFg); background: var(--panelHeaderBg); + border-bottom: solid 0.5px var(--panelHeaderDivider); z-index: 2; line-height: 1.4em; } diff --git a/packages/frontend/src/themes/_dark.json5 b/packages/frontend/src/themes/_dark.json5 index aea8148209b9a6018f4139106946ea50649352c0..a23d25e866b2bf1e7eaad63e596a82f5d658cfc4 100644 --- a/packages/frontend/src/themes/_dark.json5 +++ b/packages/frontend/src/themes/_dark.json5 @@ -27,6 +27,7 @@ panelHighlight: ':lighten<3<@panel', panelHeaderBg: ':lighten<3<@panel', panelHeaderFg: '@fg', + panelHeaderDivider: 'rgba(0, 0, 0, 0)', panelBorder: '" solid 1px var(--divider)', acrylicPanel: ':alpha<0.5<@panel', windowHeader: ':alpha<0.85<@panel', diff --git a/packages/frontend/src/themes/_light.json5 b/packages/frontend/src/themes/_light.json5 index a8b5489671c4181d4e8eb3591d3ed073b98d7cdd..713756221aaa1f6afeb95878d52a5027e91b0e40 100644 --- a/packages/frontend/src/themes/_light.json5 +++ b/packages/frontend/src/themes/_light.json5 @@ -27,6 +27,7 @@ panelHighlight: ':darken<3<@panel', panelHeaderBg: ':lighten<3<@panel', panelHeaderFg: '@fg', + panelHeaderDivider: 'rgba(0, 0, 0, 0)', panelBorder: '" solid 1px var(--divider)', acrylicPanel: ':alpha<0.5<@panel', windowHeader: ':alpha<0.85<@panel', diff --git a/packages/frontend/src/themes/d-astro.json5 b/packages/frontend/src/themes/d-astro.json5 index 86a8403bb43d3cea325a5da8192a37e9ba857bc3..c6a927ec3ae7e49d4286774f050be97a09285242 100644 --- a/packages/frontend/src/themes/d-astro.json5 +++ b/packages/frontend/src/themes/d-astro.json5 @@ -57,6 +57,7 @@ listItemHoverBg: 'rgba(255, 255, 255, 0.03)', scrollbarHandle: 'rgba(255, 255, 255, 0.2)', wallpaperOverlay: 'rgba(0, 0, 0, 0.5)', + panelHeaderDivider: 'rgba(0, 0, 0, 0)', scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)', X2: ':darken<2<@panel', X3: 'rgba(255, 255, 255, 0.05)', diff --git a/packages/frontend/src/themes/d-botanical.json5 b/packages/frontend/src/themes/d-botanical.json5 index b98908984b43f4b33e2afac49c2751c2f9e1285d..c03b95e2d75854f8afd08d9ec805f72c255137d5 100644 --- a/packages/frontend/src/themes/d-botanical.json5 +++ b/packages/frontend/src/themes/d-botanical.json5 @@ -13,6 +13,8 @@ fgHighlighted: '#fff', divider: 'rgba(255, 255, 255, 0.14)', panel: 'rgb(47, 47, 44)', + panelHeaderBg: '@panel', + panelHeaderDivider: '@divider', header: ':alpha<0.7<@panel', navBg: '#363636', renote: '@accent', diff --git a/packages/frontend/src/themes/d-dark.json5 b/packages/frontend/src/themes/d-dark.json5 index 354b999d2975776a2437c0a2ab6b9f0f878cee08..d24ce4df6952aa8d7c6fd377297d3baff13896f7 100644 --- a/packages/frontend/src/themes/d-dark.json5 +++ b/packages/frontend/src/themes/d-dark.json5 @@ -13,6 +13,8 @@ fgHighlighted: '#fff', divider: 'rgba(255, 255, 255, 0.14)', panel: '#2d2d2d', + panelHeaderBg: '@panel', + panelHeaderDivider: '@divider', header: ':alpha<0.7<@panel', navBg: '#363636', renote: '@accent', diff --git a/packages/frontend/src/themes/d-future.json5 b/packages/frontend/src/themes/d-future.json5 index ac1d3166bcef7c8871f2729e85821120f7855a71..b6fa1ab0c18d43129f1a806d965e8629f2b18ead 100644 --- a/packages/frontend/src/themes/d-future.json5 +++ b/packages/frontend/src/themes/d-future.json5 @@ -14,6 +14,8 @@ fgOnAccent: '#000', divider: 'rgba(255, 255, 255, 0.1)', panel: '#18181c', + panelHeaderBg: '@panel', + panelHeaderDivider: '@divider', renote: '@accent', mention: '#f2c97d', mentionMe: '@accent', diff --git a/packages/frontend/src/themes/d-green-lime.json5 b/packages/frontend/src/themes/d-green-lime.json5 index 17629190d08b7428fd970c9abc9a11ee0b9fdffe..a6983b9ac21a6db7dad2925bb82352a0fca0bf7d 100644 --- a/packages/frontend/src/themes/d-green-lime.json5 +++ b/packages/frontend/src/themes/d-green-lime.json5 @@ -14,6 +14,8 @@ fgOnAccent: '#192320', divider: '#e7fffb24', panel: '#192320', + panelHeaderBg: '@panel', + panelHeaderDivider: '@divider', popup: '#293330', renote: '@accent', mentionMe: '#ffaa00', diff --git a/packages/frontend/src/themes/d-green-orange.json5 b/packages/frontend/src/themes/d-green-orange.json5 index bddcc242e7d93d13ca7a7546bf676be018f96cb4..62adc39e29cb9708d6959944352c7562951ca887 100644 --- a/packages/frontend/src/themes/d-green-orange.json5 +++ b/packages/frontend/src/themes/d-green-orange.json5 @@ -14,6 +14,8 @@ fgOnAccent: '#192320', divider: '#e7fffb24', panel: '#192320', + panelHeaderBg: '@panel', + panelHeaderDivider: '@divider', popup: '#293330', renote: '@accent', mentionMe: '#b4e900', diff --git a/packages/frontend/src/themes/d-u0.json5 b/packages/frontend/src/themes/d-u0.json5 index fb9b36663d7ba37631616b57805491a35a6d6f1f..b270f809ac1718851f99ab0718448eb15ca13c12 100644 --- a/packages/frontend/src/themes/d-u0.json5 +++ b/packages/frontend/src/themes/d-u0.json5 @@ -81,6 +81,7 @@ inputBorderHover: 'rgba(255, 255, 255, 0.2)', wallpaperOverlay: 'rgba(0, 0, 0, 0.5)', fgTransparentWeak: ':alpha<0.75<@fg', + panelHeaderDivider: 'rgba(0, 0, 0, 0)', scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)', deckDivider: '#142022', }, diff --git a/packages/frontend/src/themes/l-botanical.json5 b/packages/frontend/src/themes/l-botanical.json5 index 70089a55d23e2eee56cf8b494e9653ff46df6ba5..2ea9a7d6c9776a464f3d07d804bcc76d3c179ca0 100644 --- a/packages/frontend/src/themes/l-botanical.json5 +++ b/packages/frontend/src/themes/l-botanical.json5 @@ -13,6 +13,8 @@ fgHighlighted: '#6bc9a0', divider: '#cfcfcf', panel: '@X14', + panelHeaderBg: '@panel', + panelHeaderDivider: '@divider', header: ':alpha<0.7<@panel', navBg: '@X14', renote: '#229e92', diff --git a/packages/frontend/src/themes/l-light.json5 b/packages/frontend/src/themes/l-light.json5 index cd9f0c477da19f8faa0588fb0e0e15bb5bd772b5..248355c9459d32588dad2cba8e829ec503bd78be 100644 --- a/packages/frontend/src/themes/l-light.json5 +++ b/packages/frontend/src/themes/l-light.json5 @@ -14,6 +14,7 @@ header: ':alpha<0.7<@panel', navBg: '#fff', panel: '#fff', + panelHeaderDivider: '@divider', mentionMe: 'rgb(0, 179, 70)', }, } diff --git a/packages/frontend/src/themes/l-rainy.json5 b/packages/frontend/src/themes/l-rainy.json5 index 8bc63ee43d68390a2d8c2ba6d93119730968cb1a..283dd74c6cfe6ef3938e68acbace9c194b7227bd 100644 --- a/packages/frontend/src/themes/l-rainy.json5 +++ b/packages/frontend/src/themes/l-rainy.json5 @@ -12,6 +12,7 @@ fg: '#636b71', panel: '#fff', divider: 'rgb(230 233 234)', + panelHeaderDivider: '@divider', renote: '@accent', link: '@accent', mention: '@accent', diff --git a/packages/frontend/src/themes/l-u0.json5 b/packages/frontend/src/themes/l-u0.json5 index 2cb79791b827f564f7ea3b73600d336f2c631a05..03b114ba39bc1f2e077bc3cbfc850d281614a96e 100644 --- a/packages/frontend/src/themes/l-u0.json5 +++ b/packages/frontend/src/themes/l-u0.json5 @@ -81,6 +81,7 @@ inputBorderHover: 'rgba(255, 255, 255, 0.2)', wallpaperOverlay: 'rgba(0, 0, 0, 0.5)', fgTransparentWeak: ':alpha<0.75<@fg', + panelHeaderDivider: 'rgba(0, 0, 0, 0)', scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)', }, } diff --git a/packages/frontend/src/themes/l-vivid.json5 b/packages/frontend/src/themes/l-vivid.json5 index 0ff087f471aa4f6e44e94c52e9b69d064e09afbb..b3c08f38ae14d09640e31c667ac44c4b40fa8801 100644 --- a/packages/frontend/src/themes/l-vivid.json5 +++ b/packages/frontend/src/themes/l-vivid.json5 @@ -60,6 +60,7 @@ scrollbarHandle: 'rgba(0, 0, 0, 0.2)', wallpaperOverlay: 'rgba(255, 255, 255, 0.5)', fgTransparentWeak: ':alpha<0.75<@fg', + panelHeaderDivider: '@divider', scrollbarHandleHover: 'rgba(0, 0, 0, 0.4)', X2: ':darken<2<@panel', X3: 'rgba(0, 0, 0, 0.05)', diff --git a/packages/frontend/src/ui/deck/column.vue b/packages/frontend/src/ui/deck/column.vue index 7f6004ba62449537255bcdf3f69d0a4eed6ae761..e895847bd96f60e6093676fbdc3b0fcdf888c3e0 100644 --- a/packages/frontend/src/ui/deck/column.vue +++ b/packages/frontend/src/ui/deck/column.vue @@ -316,8 +316,12 @@ function onDrop(ev) { font-size: 0.9em; color: var(--panelHeaderFg); background: var(--panelHeaderBg); + box-shadow: 0 1px 0 0 var(--panelHeaderDivider); cursor: pointer; - user-select: none; + + &, * { + user-select: none; + } } .title {