🎨
This commit is contained in:
parent
ea13efe495
commit
b715ea4621
7 changed files with 24 additions and 5 deletions
|
@ -932,6 +932,7 @@ export default Vue.extend({
|
||||||
|
|
||||||
&.wallpaper {
|
&.wallpaper {
|
||||||
background: var(--wallpaperOverlay);
|
background: var(--wallpaperOverlay);
|
||||||
|
backdrop-filter: blur(4px);
|
||||||
}
|
}
|
||||||
|
|
||||||
> main {
|
> main {
|
||||||
|
|
|
@ -109,8 +109,10 @@ export default Vue.extend({
|
||||||
|
|
||||||
> header {
|
> header {
|
||||||
position: relative;
|
position: relative;
|
||||||
box-shadow: 0 1px 0 0 var(--divider);
|
box-shadow: 0 1px 0 0 var(--panelHeaderDivider);
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
|
background: var(--panelHeaderBg);
|
||||||
|
color: var(--panelHeaderFg);
|
||||||
|
|
||||||
> .title {
|
> .title {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
|
|
@ -279,6 +279,8 @@ hr {
|
||||||
position: relative;
|
position: relative;
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
border-radius: var(--radius);
|
border-radius: var(--radius);
|
||||||
|
box-shadow: 0 0 0 1px var(--panelBorder);
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
._widget ._list_ ._panel {
|
._widget ._list_ ._panel {
|
||||||
|
@ -324,8 +326,10 @@ hr {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 22px 32px;
|
padding: 22px 32px;
|
||||||
font-size: 1.1em;
|
font-size: 1.1em;
|
||||||
border-bottom: solid 1px var(--divider);
|
border-bottom: solid 1px var(--panelHeaderDivider);
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
background: var(--panelHeaderBg);
|
||||||
|
color: var(--panelHeaderFg);
|
||||||
|
|
||||||
@media (max-width: 500px) {
|
@media (max-width: 500px) {
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
|
@ -381,7 +385,7 @@ hr {
|
||||||
}
|
}
|
||||||
|
|
||||||
._fullinfo {
|
._fullinfo {
|
||||||
padding: 32px;
|
padding: 64px 32px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
||||||
> img {
|
> img {
|
||||||
|
|
|
@ -16,8 +16,13 @@
|
||||||
fg: '#c7d1d8',
|
fg: '#c7d1d8',
|
||||||
fgHighlighted: ':lighten<3<@fg',
|
fgHighlighted: ':lighten<3<@fg',
|
||||||
html: '@bg',
|
html: '@bg',
|
||||||
|
divider: 'rgba(255, 255, 255, 0.1)',
|
||||||
indicator: '@accent',
|
indicator: '@accent',
|
||||||
panel: '#000',
|
panel: '#000',
|
||||||
|
panelHeaderBg: ':lighten<3<@panel',
|
||||||
|
panelHeaderFg: '@fg',
|
||||||
|
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
|
||||||
|
panelBorder: 'rgba(0, 0, 0, 0)',
|
||||||
shadow: 'rgba(0, 0, 0, 0.1)',
|
shadow: 'rgba(0, 0, 0, 0.1)',
|
||||||
header: 'rgba(20, 20, 20, 0.75)',
|
header: 'rgba(20, 20, 20, 0.75)',
|
||||||
navBg: '@panel',
|
navBg: '@panel',
|
||||||
|
@ -31,7 +36,6 @@
|
||||||
mentionMe: '@mention',
|
mentionMe: '@mention',
|
||||||
renote: '#229e82',
|
renote: '#229e82',
|
||||||
modalBg: 'rgba(0, 0, 0, 0.5)',
|
modalBg: 'rgba(0, 0, 0, 0.5)',
|
||||||
divider: 'rgba(255, 255, 255, 0.1)',
|
|
||||||
scrollbarHandle: 'rgba(255, 255, 255, 0.2)',
|
scrollbarHandle: 'rgba(255, 255, 255, 0.2)',
|
||||||
scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)',
|
scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)',
|
||||||
dateLabelFg: '@fg',
|
dateLabelFg: '@fg',
|
||||||
|
|
|
@ -16,8 +16,13 @@
|
||||||
fg: '#5c6a73',
|
fg: '#5c6a73',
|
||||||
fgHighlighted: ':darken<3<@fg',
|
fgHighlighted: ':darken<3<@fg',
|
||||||
html: '@bg',
|
html: '@bg',
|
||||||
|
divider: 'rgba(0, 0, 0, 0.1)',
|
||||||
indicator: '@accent',
|
indicator: '@accent',
|
||||||
panel: '#fff',
|
panel: '#fff',
|
||||||
|
panelHeaderBg: ':lighten<3<@panel',
|
||||||
|
panelHeaderFg: '@fg',
|
||||||
|
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
|
||||||
|
panelBorder: 'rgba(0, 0, 0, 0)',
|
||||||
shadow: 'rgba(0, 0, 0, 0.1)',
|
shadow: 'rgba(0, 0, 0, 0.1)',
|
||||||
header: 'rgba(255, 255, 255, 0.75)',
|
header: 'rgba(255, 255, 255, 0.75)',
|
||||||
navBg: '@panel',
|
navBg: '@panel',
|
||||||
|
@ -31,7 +36,6 @@
|
||||||
mentionMe: '@mention',
|
mentionMe: '@mention',
|
||||||
renote: '#229e82',
|
renote: '#229e82',
|
||||||
modalBg: 'rgba(0, 0, 0, 0.3)',
|
modalBg: 'rgba(0, 0, 0, 0.3)',
|
||||||
divider: 'rgba(0, 0, 0, 0.1)',
|
|
||||||
scrollbarHandle: 'rgba(0, 0, 0, 0.2)',
|
scrollbarHandle: 'rgba(0, 0, 0, 0.2)',
|
||||||
scrollbarHandleHover: 'rgba(0, 0, 0, 0.4)',
|
scrollbarHandleHover: 'rgba(0, 0, 0, 0.4)',
|
||||||
dateLabelFg: '@fg',
|
dateLabelFg: '@fg',
|
||||||
|
|
|
@ -9,6 +9,9 @@
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
divider: '#2d2d2d',
|
divider: '#2d2d2d',
|
||||||
|
panelHeaderBg: '@panel',
|
||||||
|
panelHeaderDivider: '@divider',
|
||||||
|
panelBorder: '@divider',
|
||||||
messageBg: '#1d1d1d',
|
messageBg: '#1d1d1d',
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,6 +8,7 @@
|
||||||
base: 'light',
|
base: 'light',
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
|
panelHeaderDivider: '@divider',
|
||||||
messageBg: '#dedede',
|
messageBg: '#dedede',
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue