usbharu
/
misskey
mirror of https://github.com/misskey-dev/misskey.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor(frontend): refactor divider of panel style

This commit is contained in:
syuilo 2025-04-05 19:45:11 +09:00
parent db48b320f5
commit f71843a7d3
16 changed files with 12 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/frontend-shared/themes/_dark.json5
View File

@ -26,7 +26,6 @@
panelHighlight: ':lighten<3<@panel', panelHighlight: ':lighten<3<@panel',
panelHeaderBg: ':lighten<3<@panel', panelHeaderBg: ':lighten<3<@panel',
panelHeaderFg: '@fg', panelHeaderFg: '@fg',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
panelBorder: '" solid 1px var(--MI_THEME-divider)', panelBorder: '" solid 1px var(--MI_THEME-divider)',
windowHeader: ':alpha<0.85<@panel', windowHeader: ':alpha<0.85<@panel',
popup: ':lighten<3<@panel', popup: ':lighten<3<@panel',

1
packages/frontend-shared/themes/_light.json5
View File

@ -26,7 +26,6 @@
panelHighlight: ':darken<3<@panel', panelHighlight: ':darken<3<@panel',
panelHeaderBg: ':lighten<3<@panel', panelHeaderBg: ':lighten<3<@panel',
panelHeaderFg: '@fg', panelHeaderFg: '@fg',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
panelBorder: '" solid 1px var(--MI_THEME-divider)', panelBorder: '" solid 1px var(--MI_THEME-divider)',
windowHeader: ':alpha<0.85<@panel', windowHeader: ':alpha<0.85<@panel',
popup: ':lighten<3<@panel', popup: ':lighten<3<@panel',

1
packages/frontend-shared/themes/d-astro.json5
View File

@ -46,7 +46,6 @@
fgOnWhite: '@accent', fgOnWhite: '@accent',
panelHighlight: ':lighten<3<@panel', panelHighlight: ':lighten<3<@panel',
scrollbarHandle: 'rgba(255, 255, 255, 0.2)', scrollbarHandle: 'rgba(255, 255, 255, 0.2)',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)', scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)',
}, },
} }

1
packages/frontend-shared/themes/d-botanical.json5
View File

@ -14,7 +14,6 @@
fgOnWhite: '@accent', fgOnWhite: '@accent',
divider: 'rgba(255, 255, 255, 0.14)', divider: 'rgba(255, 255, 255, 0.14)',
panel: 'rgb(47, 47, 44)', panel: 'rgb(47, 47, 44)',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
header: ':alpha<0.7<@panel', header: ':alpha<0.7<@panel',
navBg: '#363636', navBg: '#363636',
renote: '@accent', renote: '@accent',

1
packages/frontend-shared/themes/d-dark.json5
View File

@ -14,7 +14,6 @@
fgOnWhite: '@accent', fgOnWhite: '@accent',
divider: 'rgba(255, 255, 255, 0.14)', divider: 'rgba(255, 255, 255, 0.14)',
panel: '#2d2d2d', panel: '#2d2d2d',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
header: ':alpha<0.7<@panel', header: ':alpha<0.7<@panel',
navBg: '#363636', navBg: '#363636',
renote: '@accent', renote: '@accent',

1
packages/frontend-shared/themes/d-future.json5
View File

@ -15,7 +15,6 @@
fgOnWhite: '@accent', fgOnWhite: '@accent',
divider: 'rgba(255, 255, 255, 0.1)', divider: 'rgba(255, 255, 255, 0.1)',
panel: '#18181c', panel: '#18181c',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
renote: '@accent', renote: '@accent',
mention: '#f2c97d', mention: '#f2c97d',
mentionMe: '@accent', mentionMe: '@accent',

1
packages/frontend-shared/themes/d-green-lime.json5
View File

@ -15,7 +15,6 @@
fgOnWhite: '@accent', fgOnWhite: '@accent',
divider: '#e7fffb24', divider: '#e7fffb24',
panel: '#192320', panel: '#192320',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
popup: '#293330', popup: '#293330',
renote: '@accent', renote: '@accent',
mentionMe: '#ffaa00', mentionMe: '#ffaa00',

1
packages/frontend-shared/themes/d-green-orange.json5
View File

@ -15,7 +15,6 @@
fgOnWhite: '@accent', fgOnWhite: '@accent',
divider: '#e7fffb24', divider: '#e7fffb24',
panel: '#192320', panel: '#192320',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
popup: '#293330', popup: '#293330',
renote: '@accent', renote: '@accent',
mentionMe: '#b4e900', mentionMe: '#b4e900',

1
packages/frontend-shared/themes/d-u0.json5
View File

@ -59,7 +59,6 @@
scrollbarHandle: 'rgba(255, 255, 255, 0.2)', scrollbarHandle: 'rgba(255, 255, 255, 0.2)',
inputBorderHover: 'rgba(255, 255, 255, 0.2)', inputBorderHover: 'rgba(255, 255, 255, 0.2)',
fgTransparentWeak: ':alpha<0.75<@fg', fgTransparentWeak: ':alpha<0.75<@fg',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)', scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)',
deckBg: '#142022', deckBg: '#142022',
}, },

1
packages/frontend-shared/themes/l-botanical.json5
View File

@ -15,7 +15,6 @@
divider: '#cfcfcf', divider: '#cfcfcf',
panel: '#ebe7e5', panel: '#ebe7e5',
panelHeaderBg: '@panel', panelHeaderBg: '@panel',
panelHeaderDivider: '@divider',
header: ':alpha<0.7<@panel', header: ':alpha<0.7<@panel',
navBg: '#ebe7e5', navBg: '#ebe7e5',
renote: '#229e92', renote: '#229e92',

1
packages/frontend-shared/themes/l-light.json5
View File

@ -15,7 +15,6 @@
header: ':alpha<0.7<@panel', header: ':alpha<0.7<@panel',
navBg: '#fff', navBg: '#fff',
panel: '#fff', panel: '#fff',
panelHeaderDivider: '@divider',
mentionMe: 'rgb(0, 179, 70)', mentionMe: 'rgb(0, 179, 70)',
}, },
} }

1
packages/frontend-shared/themes/l-rainy.json5
View File

@ -13,7 +13,6 @@
fgOnWhite: '@accent', fgOnWhite: '@accent',
panel: '#fff', panel: '#fff',
divider: 'rgb(230 233 234)', divider: 'rgb(230 233 234)',
panelHeaderDivider: '@divider',
renote: '@accent', renote: '@accent',
link: '@accent', link: '@accent',
mention: '@accent', mention: '@accent',

1
packages/frontend-shared/themes/l-u0.json5
View File

@ -61,7 +61,6 @@
scrollbarHandle: '#74747433', scrollbarHandle: '#74747433',
inputBorderHover: 'rgba(255, 255, 255, 0.2)', inputBorderHover: 'rgba(255, 255, 255, 0.2)',
fgTransparentWeak: ':alpha<0.75<@fg', fgTransparentWeak: ':alpha<0.75<@fg',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)', scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)',
}, },
} }

1
packages/frontend-shared/themes/l-vivid.json5
View File

@ -49,7 +49,6 @@
panelHighlight: ':darken<3<@panel', panelHighlight: ':darken<3<@panel',
scrollbarHandle: 'rgba(0, 0, 0, 0.2)', scrollbarHandle: 'rgba(0, 0, 0, 0.2)',
fgTransparentWeak: ':alpha<0.75<@fg', fgTransparentWeak: ':alpha<0.75<@fg',
panelHeaderDivider: '@divider',
scrollbarHandleHover: 'rgba(0, 0, 0, 0.4)', scrollbarHandleHover: 'rgba(0, 0, 0, 0.4)',
}, },
} }

7
packages/frontend/src/components/MkContainer.vue
View File

@ -181,11 +181,16 @@ onUnmounted(() => {
left: 0; left: 0;
color: var(--MI_THEME-panelHeaderFg); color: var(--MI_THEME-panelHeaderFg);
background: var(--MI_THEME-panelHeaderBg); background: var(--MI_THEME-panelHeaderBg);
border-bottom: solid 0.5px var(--MI_THEME-panelHeaderDivider);
z-index: 2; z-index: 2;
line-height: 1.4em; 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 { .title {
margin: 0; margin: 0;
padding: 12px 16px; padding: 12px 16px;

7
packages/frontend/src/ui/deck/column.vue
View File

@ -413,11 +413,16 @@ function onDrop(ev) {
font-size: 0.9em; font-size: 0.9em;
color: var(--MI_THEME-panelHeaderFg); color: var(--MI_THEME-panelHeaderFg);
background: var(--MI_THEME-panelHeaderBg); background: var(--MI_THEME-panelHeaderBg);
box-shadow: 0 0.5px 0 0 var(--MI_THEME-panelHeaderDivider);
cursor: pointer; cursor: pointer;
user-select: none; 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 { .color {
position: absolute; position: absolute;
top: 12px; top: 12px;