mirror of
https://iceshrimp.dev/crimekillz/iceshrimp-161sh.git
synced 2024-11-21 19:53:50 +01:00
Replace or remove theme 'X' vars
This commit is contained in:
parent
b647ebf03f
commit
4a3f6afef6
@ -497,7 +497,7 @@ onBeforeUnmount(() => {
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: var(--X3);
|
||||
background: var(--interactiveElementHovered);
|
||||
}
|
||||
|
||||
&[data-selected="true"] {
|
||||
|
@ -150,11 +150,11 @@ function onMousedown(evt: MouseEvent): void {
|
||||
background: var(--accent);
|
||||
|
||||
&:not(:disabled):hover {
|
||||
background: var(--X8);
|
||||
background: var(--accentLightenLess);
|
||||
}
|
||||
|
||||
&:not(:disabled):active {
|
||||
background: var(--X8);
|
||||
background: var(--accentLightenLess);
|
||||
}
|
||||
}
|
||||
|
||||
@ -168,11 +168,11 @@ function onMousedown(evt: MouseEvent): void {
|
||||
);
|
||||
|
||||
&:not(:disabled):hover {
|
||||
background: linear-gradient(90deg, var(--X8), var(--X8));
|
||||
background: var(--accentLightenLess);
|
||||
}
|
||||
|
||||
&:not(:disabled):active {
|
||||
background: linear-gradient(90deg, var(--X8), var(--X8));
|
||||
background: var(--accentLightenLess);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -89,7 +89,7 @@ const bannerStyle = computed(() => {
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 64px;
|
||||
background: linear-gradient(0deg, var(--panel), var(--X15));
|
||||
background: linear-gradient(0deg, var(--panel), var(--panelFade));
|
||||
}
|
||||
|
||||
> .name {
|
||||
|
@ -259,7 +259,7 @@ export default defineComponent({
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 64px;
|
||||
background: linear-gradient(0deg, var(--panel), var(--X15));
|
||||
background: linear-gradient(0deg, var(--panel), var(--panelFade));
|
||||
|
||||
> span {
|
||||
display: inline-block;
|
||||
|
@ -142,7 +142,7 @@ const cancel = () => {
|
||||
font-size: 14px;
|
||||
|
||||
&:hover {
|
||||
background: var(--X7);
|
||||
background: var(--interactiveElementHovered);
|
||||
}
|
||||
|
||||
&.selected {
|
||||
|
@ -583,7 +583,7 @@ onUnmounted(() => {
|
||||
// @media (pointer: coarse) {
|
||||
// &:has(.button:focus-within) {
|
||||
// z-index: 2;
|
||||
// --X13: transparent;
|
||||
// --dividerHovered: transparent;
|
||||
// &::after {
|
||||
// opacity: 1;
|
||||
// backdrop-filter: var(--modalBgFilter);
|
||||
|
@ -724,7 +724,7 @@ function noteClick(e) {
|
||||
}
|
||||
// &::after {
|
||||
// content: "";
|
||||
// border-top: 1px solid var(--X13);
|
||||
// border-top: 1px solid var(--dividerHovered);
|
||||
// position: absolute;
|
||||
// bottom: 0;
|
||||
// margin-left: calc(var(--avatarSize) + 12px);
|
||||
|
@ -1187,7 +1187,7 @@ onMounted(() => {
|
||||
margin: 0.3rem;
|
||||
padding: 4px 0 4px 4px;
|
||||
border-radius: 999px;
|
||||
background: var(--X3);
|
||||
background: var(--interactiveElementHovered);
|
||||
|
||||
> button {
|
||||
padding: 4px 8px;
|
||||
@ -1260,7 +1260,7 @@ onMounted(() => {
|
||||
border-radius: 6px;
|
||||
|
||||
&:hover {
|
||||
background: var(--X5);
|
||||
background: var(--postFormButtonHoverBg);
|
||||
}
|
||||
|
||||
&.active {
|
||||
|
@ -184,7 +184,7 @@ onMounted(() => {
|
||||
font-size: 14px;
|
||||
|
||||
&:hover {
|
||||
background: var(--X7);
|
||||
background: var(--interactiveElementHovered);
|
||||
}
|
||||
|
||||
&.selected {
|
||||
|
@ -179,7 +179,7 @@ onMounted(() => {
|
||||
font-size: 14px;
|
||||
|
||||
&:hover {
|
||||
background: var(--X7);
|
||||
background: var(--interactiveElementHovered);
|
||||
}
|
||||
|
||||
&.selected {
|
||||
|
@ -143,7 +143,7 @@ const headerActions = $computed(() => [
|
||||
text: i18n.ts.edit,
|
||||
handler: edit,
|
||||
},
|
||||
]
|
||||
]
|
||||
: []),
|
||||
]);
|
||||
|
||||
@ -155,7 +155,7 @@ definePageMetadata(
|
||||
? {
|
||||
title: channel.name,
|
||||
icon: "ph-television ph-bold ph-lg",
|
||||
}
|
||||
}
|
||||
: null,
|
||||
),
|
||||
);
|
||||
@ -201,7 +201,7 @@ definePageMetadata(
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 64px;
|
||||
background: linear-gradient(0deg, var(--panel), var(--X15));
|
||||
background: linear-gradient(0deg, var(--panel), var(--panelFade));
|
||||
}
|
||||
|
||||
> .status {
|
||||
|
@ -241,7 +241,7 @@ definePageMetadata(
|
||||
? {
|
||||
title: post.title,
|
||||
avatar: post.user,
|
||||
}
|
||||
}
|
||||
: null,
|
||||
),
|
||||
);
|
||||
@ -299,7 +299,7 @@ definePageMetadata(
|
||||
> .like {
|
||||
> .button {
|
||||
--accent: #eb6f92;
|
||||
--X8: #eb6f92;
|
||||
--accentLightenLess: #eb6f92;
|
||||
--buttonBg: rgb(216 71 106 / 5%);
|
||||
--buttonHoverBg: rgb(216 71 106 / 10%);
|
||||
color: #eb6f92;
|
||||
|
@ -261,7 +261,7 @@ function del(): void {
|
||||
padding-right: 32px;
|
||||
|
||||
> .balloon {
|
||||
$color: var(--X4);
|
||||
$color: var(--messagingIsNotMe);
|
||||
background: $color;
|
||||
|
||||
&.noText {
|
||||
|
@ -547,7 +547,7 @@ definePageMetadata({
|
||||
font-weight: bold;
|
||||
-webkit-backdrop-filter: var(--blur, blur(10px));
|
||||
backdrop-filter: var(--blur, blur(10px));
|
||||
background-color: var(--X16);
|
||||
background-color: var(--panelTransparent);
|
||||
}
|
||||
|
||||
> .content {
|
||||
|
@ -93,11 +93,11 @@ export default defineComponent({
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
background: var(--panel);
|
||||
border: solid 2px var(--X12);
|
||||
border: solid 2px var(--divider);
|
||||
border-radius: 6px;
|
||||
|
||||
&:hover {
|
||||
border: solid 2px var(--X13);
|
||||
border: solid 2px var(--dividerHovered);
|
||||
}
|
||||
|
||||
&.warn {
|
||||
|
@ -315,7 +315,7 @@ definePageMetadata(
|
||||
title: page.title || page.name,
|
||||
text: page.summary,
|
||||
},
|
||||
}
|
||||
}
|
||||
: null,
|
||||
),
|
||||
);
|
||||
@ -401,7 +401,7 @@ definePageMetadata(
|
||||
> .like {
|
||||
> .button {
|
||||
--accent: #eb6f92;
|
||||
--X8: #eb6f92;
|
||||
--accentLightenLess: #eb6f92;
|
||||
--buttonBg: rgb(216 71 106 / 5%);
|
||||
--buttonHoverBg: rgb(216 71 106 / 10%);
|
||||
color: #eb6f92;
|
||||
|
@ -274,7 +274,7 @@ export default defineComponent({
|
||||
background: linear-gradient(
|
||||
0deg,
|
||||
var(--panel),
|
||||
var(--X15)
|
||||
var(--panelFade)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
@ -302,11 +302,11 @@ hr {
|
||||
background: var(--accent);
|
||||
|
||||
&:not(:disabled):hover {
|
||||
background: var(--X8);
|
||||
background: var(--accentLightenLess);
|
||||
}
|
||||
|
||||
&:not(:disabled):active {
|
||||
background: var(--X9);
|
||||
background: var(--accentDarkenLess);
|
||||
}
|
||||
}
|
||||
|
||||
@ -320,11 +320,11 @@ hr {
|
||||
);
|
||||
|
||||
&:not(:disabled):hover {
|
||||
background: linear-gradient(90deg, var(--X8), var(--X8));
|
||||
background: var(--accentLightenLess)
|
||||
}
|
||||
|
||||
&:not(:disabled):active {
|
||||
background: linear-gradient(90deg, var(--X8), var(--X8));
|
||||
background: var(--accentLightenLess)
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -81,21 +81,15 @@
|
||||
codeNumber: '#cfff9e',
|
||||
codeBoolean: '#c59eff',
|
||||
htmlThemeColor: '@bg',
|
||||
X2: ':darken<2<@panel',
|
||||
X3: 'rgba(255, 255, 255, 0.05)',
|
||||
X4: 'rgba(255, 255, 255, 0.1)',
|
||||
X5: 'rgba(255, 255, 255, 0.05)',
|
||||
X6: 'rgba(255, 255, 255, 0.15)',
|
||||
X7: 'rgba(255, 255, 255, 0.05)',
|
||||
X8: ':lighten<5<@accent',
|
||||
X9: ':darken<5<@accent',
|
||||
X10: ':alpha<0.4<@accent',
|
||||
X11: 'rgba(0, 0, 0, 0.3)',
|
||||
X12: 'rgba(255, 255, 255, 0.1)',
|
||||
X13: 'rgba(255, 255, 255, 0.15)',
|
||||
X14: ':alpha<0.5<@navBg',
|
||||
X15: ':alpha<0<@panel',
|
||||
X16: ':alpha<0.7<@panel',
|
||||
X17: ':alpha<0.8<@bg',
|
||||
interactiveElementHovered: 'rgba(255, 255, 255, 0.05)',
|
||||
messagingIsNotMe: 'rgba(255, 255, 255, 0.1)',
|
||||
postFormButtonHoverBg: 'rgba(255, 255, 255, 0.05)',
|
||||
accentLightenLess: ':lighten<5<@accent',
|
||||
accentDarkenLess: ':darken<5<@accent',
|
||||
calendarInfoMeterBg: 'rgba(0, 0, 0, 0.3)',
|
||||
dividerHovered: 'rgba(255, 255, 255, 0.15)',
|
||||
navBgTransparent: ':alpha<0.5<@navBg',
|
||||
panelFade: ':alpha<0<@panel',
|
||||
panelTransparent: ':alpha<0.7<@panel',
|
||||
},
|
||||
}
|
||||
|
@ -81,21 +81,15 @@
|
||||
codeNumber: '#0fbbbb',
|
||||
codeBoolean: '#62b70c',
|
||||
htmlThemeColor: '@bg',
|
||||
X2: ':darken<2<@panel',
|
||||
X3: 'rgba(0, 0, 0, 0.05)',
|
||||
X4: 'rgba(0, 0, 0, 0.1)',
|
||||
X5: 'rgba(0, 0, 0, 0.05)',
|
||||
X6: 'rgba(0, 0, 0, 0.25)',
|
||||
X7: 'rgba(0, 0, 0, 0.05)',
|
||||
X8: ':lighten<5<@accent',
|
||||
X9: ':darken<5<@accent',
|
||||
X10: ':alpha<0.4<@accent',
|
||||
X11: 'rgba(0, 0, 0, 0.1)',
|
||||
X12: 'rgba(0, 0, 0, 0.1)',
|
||||
X13: 'rgba(0, 0, 0, 0.15)',
|
||||
X14: ':alpha<0.5<@navBg',
|
||||
X15: ':alpha<0<@panel',
|
||||
X16: ':alpha<0.7<@panel',
|
||||
X17: ':alpha<0.8<@bg',
|
||||
interactiveElementHovered: 'rgba(0, 0, 0, 0.05)',
|
||||
messagingIsNotMe: 'rgba(0, 0, 0, 0.1)',
|
||||
postFormButtonHoverBg: 'rgba(0, 0, 0, 0.05)',
|
||||
accentLightenLess: ':lighten<5<@accent',
|
||||
accentDarkenLess: ':darken<5<@accent',
|
||||
calendarInfoMeterBg: 'rgba(0, 0, 0, 0.1)',
|
||||
dividerHovered: 'rgba(0, 0, 0, 0.15)',
|
||||
navBgTransparent: ':alpha<0.5<@navBg',
|
||||
panelFade: ':alpha<0<@panel',
|
||||
panelTransparent: ':alpha<0.7<@panel',
|
||||
},
|
||||
}
|
||||
|
@ -59,20 +59,15 @@
|
||||
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)',
|
||||
X4: 'rgba(255, 255, 255, 0.1)',
|
||||
X5: 'rgba(255, 255, 255, 0.05)',
|
||||
X6: 'rgba(255, 255, 255, 0.15)',
|
||||
X7: 'rgba(255, 255, 255, 0.05)',
|
||||
X8: ':lighten<5<@accent',
|
||||
X9: ':darken<5<@accent',
|
||||
X10: ':alpha<0.4<@accent',
|
||||
X11: 'rgba(0, 0, 0, 0.3)',
|
||||
X12: 'rgba(255, 255, 255, 0.1)',
|
||||
X13: 'rgba(255, 255, 255, 0.15)',
|
||||
X14: ':alpha<0.5<@navBg',
|
||||
X15: ':alpha<0<@panel',
|
||||
X16: ':alpha<0.7<@panel',
|
||||
interactiveElementHovered: 'rgba(255, 255, 255, 0.05)',
|
||||
messagingIsNotMe: 'rgba(255, 255, 255, 0.1)',
|
||||
postFormButtonHoverBg: 'rgba(255, 255, 255, 0.05)',
|
||||
accentLightenLess: ':lighten<5<@accent',
|
||||
accentDarkenLess: ':darken<5<@accent',
|
||||
calendarInfoMeterBg: 'rgba(0, 0, 0, 0.3)',
|
||||
dividerHovered: 'rgba(255, 255, 255, 0.15)',
|
||||
navBgTransparent: ':alpha<0.5<@navBg',
|
||||
panelFade: ':alpha<0<@panel',
|
||||
panelTransparent: ':alpha<0.7<@panel',
|
||||
},
|
||||
}
|
||||
|
@ -3,24 +3,18 @@
|
||||
base: 'dark',
|
||||
name: 'Catppuccin frappe',
|
||||
props: {
|
||||
X2: ':darken<2<@panel',
|
||||
X3: 'rgba(255, 255, 255, 0.05)',
|
||||
X4: 'rgba(255, 255, 255, 0.1)',
|
||||
X5: 'rgba(255, 255, 255, 0.05)',
|
||||
X6: 'rgba(255, 255, 255, 0.15)',
|
||||
X7: 'rgba(255, 255, 255, 0.05)',
|
||||
X8: ':lighten<5<@accent',
|
||||
X9: ':darken<5<@accent',
|
||||
interactiveElementHovered: 'rgba(255, 255, 255, 0.05)',
|
||||
messagingIsNotMe: 'rgba(255, 255, 255, 0.1)',
|
||||
postFormButtonHoverBg: 'rgba(255, 255, 255, 0.05)',
|
||||
accentLightenLess: ':lighten<5<@accent',
|
||||
accentDarkenLess: ':darken<5<@accent',
|
||||
bg: '#232634',
|
||||
fg: '#c6d0f5',
|
||||
X10: ':alpha<0.4<@accent',
|
||||
X11: 'rgba(0, 0, 0, 0.3)',
|
||||
X12: 'rgba(255, 255, 255, 0.1)',
|
||||
X13: 'rgba(255, 255, 255, 0.15)',
|
||||
X14: ':alpha<0.5<@navBg',
|
||||
X15: ':alpha<0<@panel',
|
||||
X16: ':alpha<0.7<@panel',
|
||||
X17: ':alpha<0.8<@bg',
|
||||
calendarInfoMeterBg: 'rgba(0, 0, 0, 0.3)',
|
||||
dividerHovered: 'rgba(255, 255, 255, 0.15)',
|
||||
navBgTransparent: ':alpha<0.5<@navBg',
|
||||
panelFade: ':alpha<0<@panel',
|
||||
panelTransparent: ':alpha<0.7<@panel',
|
||||
cwBg: '#51576d',
|
||||
cwFg: '#b5bfe2',
|
||||
link: '#8caaee',
|
||||
|
@ -3,24 +3,18 @@
|
||||
base: 'dark',
|
||||
name: 'Catppuccin mocha',
|
||||
props: {
|
||||
X2: ':darken<2<@panel',
|
||||
X3: 'rgba(255, 255, 255, 0.05)',
|
||||
X4: 'rgba(255, 255, 255, 0.1)',
|
||||
X5: 'rgba(255, 255, 255, 0.05)',
|
||||
X6: 'rgba(255, 255, 255, 0.15)',
|
||||
X7: 'rgba(255, 255, 255, 0.05)',
|
||||
X8: ':lighten<5<@accent',
|
||||
X9: ':darken<5<@accent',
|
||||
interactiveElementHovered: 'rgba(255, 255, 255, 0.05)',
|
||||
messagingIsNotMe: 'rgba(255, 255, 255, 0.1)',
|
||||
postFormButtonHoverBg: 'rgba(255, 255, 255, 0.05)',
|
||||
accentLightenLess: ':lighten<5<@accent',
|
||||
accentDarkenLess: ':darken<5<@accent',
|
||||
bg: '#11111b',
|
||||
fg: '#cdd6f4',
|
||||
X10: ':alpha<0.4<@accent',
|
||||
X11: 'rgba(0, 0, 0, 0.3)',
|
||||
X12: 'rgba(255, 255, 255, 0.1)',
|
||||
X13: 'rgba(255, 255, 255, 0.15)',
|
||||
X14: ':alpha<0.5<@navBg',
|
||||
X15: ':alpha<0<@panel',
|
||||
X16: ':alpha<0.7<@panel',
|
||||
X17: ':alpha<0.8<@bg',
|
||||
calendarInfoMeterBg: 'rgba(0, 0, 0, 0.3)',
|
||||
dividerHovered: 'rgba(255, 255, 255, 0.15)',
|
||||
navBgTransparent: ':alpha<0.5<@navBg',
|
||||
panelFade: ':alpha<0<@panel',
|
||||
panelTransparent: ':alpha<0.7<@panel',
|
||||
cwBg: '#45475a',
|
||||
cwFg: '#bac2de',
|
||||
link: '#89b4fa',
|
||||
|
@ -4,24 +4,18 @@
|
||||
desc: 'Nord: an arctic, north-bluish color palette',
|
||||
name: 'Nord Dark',
|
||||
props: {
|
||||
X2: ':darken<2<@panel',
|
||||
X3: 'rgba(255, 255, 255, 0.05)',
|
||||
X4: 'rgba(255, 255, 255, 0.1)',
|
||||
X5: 'rgba(255, 255, 255, 0.05)',
|
||||
X6: 'rgba(255, 255, 255, 0.15)',
|
||||
X7: 'rgba(255, 255, 255, 0.05)',
|
||||
X8: ':lighten<5<@accent',
|
||||
X9: ':darken<5<@accent',
|
||||
interactiveElementHovered: 'rgba(255, 255, 255, 0.05)',
|
||||
messagingIsNotMe: 'rgba(255, 255, 255, 0.1)',
|
||||
postFormButtonHoverBg: 'rgba(255, 255, 255, 0.05)',
|
||||
accentLightenLess: ':lighten<5<@accent',
|
||||
accentDarkenLess: ':darken<5<@accent',
|
||||
bg: '#2e3440',
|
||||
fg: '#eceff4',
|
||||
X10: ':alpha<0.4<@accent',
|
||||
X11: 'rgba(0, 0, 0, 0.3)',
|
||||
X12: 'rgba(255, 255, 255, 0.1)',
|
||||
X13: 'rgba(255, 255, 255, 0.15)',
|
||||
X14: ':alpha<0.5<@navBg',
|
||||
X15: ':alpha<0<@panel',
|
||||
X16: ':alpha<0.7<@panel',
|
||||
X17: ':alpha<0.8<@bg',
|
||||
calendarInfoMeterBg: 'rgba(0, 0, 0, 0.3)',
|
||||
dividerHovered: 'rgba(255, 255, 255, 0.15)',
|
||||
navBgTransparent: ':alpha<0.5<@navBg',
|
||||
panelFade: ':alpha<0<@panel',
|
||||
panelTransparent: ':alpha<0.7<@panel',
|
||||
cwBg: '#4c566a',
|
||||
cwFg: '#393f4f',
|
||||
link: '#b48ead',
|
||||
|
@ -4,24 +4,18 @@
|
||||
desc: 'Soho vibes for Misskey',
|
||||
name: 'Rosé Pine',
|
||||
props: {
|
||||
X2: ':darken<2<@panel',
|
||||
X3: 'rgba(255, 255, 255, 0.05)',
|
||||
X4: 'rgba(255, 255, 255, 0.1)',
|
||||
X5: 'rgba(255, 255, 255, 0.05)',
|
||||
X6: 'rgba(255, 255, 255, 0.15)',
|
||||
X7: 'rgba(255, 255, 255, 0.05)',
|
||||
X8: ':lighten<5<@accent',
|
||||
X9: ':darken<5<@accent',
|
||||
interactiveElementHovered: 'rgba(255, 255, 255, 0.05)',
|
||||
messagingIsNotMe: 'rgba(255, 255, 255, 0.1)',
|
||||
postFormButtonHoverBg: 'rgba(255, 255, 255, 0.05)',
|
||||
accentLightenLess: ':lighten<5<@accent',
|
||||
accentDarkenLess: ':darken<5<@accent',
|
||||
bg: '#191724',
|
||||
fg: '#e0def4',
|
||||
X10: ':alpha<0.4<@accent',
|
||||
X11: 'rgba(0, 0, 0, 0.3)',
|
||||
X12: 'rgba(255, 255, 255, 0.1)',
|
||||
X13: 'rgba(255, 255, 255, 0.15)',
|
||||
X14: ':alpha<0.5<@navBg',
|
||||
X15: ':alpha<0<@panel',
|
||||
X16: ':alpha<0.7<@panel',
|
||||
X17: ':alpha<0.8<@bg',
|
||||
calendarInfoMeterBg: 'rgba(0, 0, 0, 0.3)',
|
||||
dividerHovered: 'rgba(255, 255, 255, 0.15)',
|
||||
navBgTransparent: ':alpha<0.5<@navBg',
|
||||
panelFade: ':alpha<0<@panel',
|
||||
panelTransparent: ':alpha<0.7<@panel',
|
||||
cwBg: '#1f1d2e',
|
||||
cwFg: '#f6c177',
|
||||
link: '#9ccfd8',
|
||||
|
@ -4,24 +4,18 @@
|
||||
desc: 'Soho vibes for Misskey, moon edition',
|
||||
name: 'Rosé Pine Moon',
|
||||
props: {
|
||||
X2: ':darken<2<@panel',
|
||||
X3: 'rgba(255, 255, 255, 0.05)',
|
||||
X4: 'rgba(255, 255, 255, 0.1)',
|
||||
X5: 'rgba(255, 255, 255, 0.05)',
|
||||
X6: 'rgba(255, 255, 255, 0.15)',
|
||||
X7: 'rgba(255, 255, 255, 0.05)',
|
||||
X8: ':lighten<5<@accent',
|
||||
X9: ':darken<5<@accent',
|
||||
interactiveElementHovered: 'rgba(255, 255, 255, 0.05)',
|
||||
messagingIsNotMe: 'rgba(255, 255, 255, 0.1)',
|
||||
postFormButtonHoverBg: 'rgba(255, 255, 255, 0.05)',
|
||||
accentLightenLess: ':lighten<5<@accent',
|
||||
accentDarkenLess: ':darken<5<@accent',
|
||||
bg: '#232136',
|
||||
fg: '#e0def4',
|
||||
X10: ':alpha<0.4<@accent',
|
||||
X11: 'rgba(0, 0, 0, 0.3)',
|
||||
X12: 'rgba(255, 255, 255, 0.1)',
|
||||
X13: 'rgba(255, 255, 255, 0.15)',
|
||||
X14: ':alpha<0.5<@navBg',
|
||||
X15: ':alpha<0<@panel',
|
||||
X16: ':alpha<0.7<@panel',
|
||||
X17: ':alpha<0.8<@bg',
|
||||
calendarInfoMeterBg: 'rgba(0, 0, 0, 0.3)',
|
||||
dividerHovered: 'rgba(255, 255, 255, 0.15)',
|
||||
navBgTransparent: ':alpha<0.5<@navBg',
|
||||
panelFade: ':alpha<0<@panel',
|
||||
panelTransparent: ':alpha<0.7<@panel',
|
||||
cwBg: '#393552',
|
||||
cwFg: '#f6c177',
|
||||
link: '#3e8fb0',
|
||||
|
@ -3,24 +3,18 @@
|
||||
base: 'dark',
|
||||
name: 'Mi U0 Dark',
|
||||
props: {
|
||||
X2: ':darken<2<@panel',
|
||||
X3: 'rgba(255, 255, 255, 0.05)',
|
||||
X4: 'rgba(255, 255, 255, 0.1)',
|
||||
X5: 'rgba(255, 255, 255, 0.05)',
|
||||
X6: 'rgba(255, 255, 255, 0.15)',
|
||||
X7: 'rgba(255, 255, 255, 0.05)',
|
||||
X8: ':lighten<5<@accent',
|
||||
X9: ':darken<5<@accent',
|
||||
interactiveElementHovered: 'rgba(255, 255, 255, 0.05)',
|
||||
messagingIsNotMe: 'rgba(255, 255, 255, 0.1)',
|
||||
postFormButtonHoverBg: 'rgba(255, 255, 255, 0.05)',
|
||||
accentLightenLess: ':lighten<5<@accent',
|
||||
accentDarkenLess: ':darken<5<@accent',
|
||||
bg: '#172426',
|
||||
fg: '#dadada',
|
||||
X10: ':alpha<0.4<@accent',
|
||||
X11: 'rgba(0, 0, 0, 0.3)',
|
||||
X12: 'rgba(255, 255, 255, 0.1)',
|
||||
X13: 'rgba(255, 255, 255, 0.15)',
|
||||
X14: ':alpha<0.5<@navBg',
|
||||
X15: ':alpha<0<@panel',
|
||||
X16: ':alpha<0.7<@panel',
|
||||
X17: ':alpha<0.8<@bg',
|
||||
calendarInfoMeterBg: 'rgba(0, 0, 0, 0.3)',
|
||||
dividerHovered: 'rgba(255, 255, 255, 0.15)',
|
||||
navBgTransparent: ':alpha<0.5<@navBg',
|
||||
panelFade: ':alpha<0<@panel',
|
||||
panelTransparent: ':alpha<0.7<@panel',
|
||||
cwBg: '#687390',
|
||||
cwFg: '#393f4f',
|
||||
link: '@accent',
|
||||
|
@ -3,24 +3,18 @@
|
||||
base: "light",
|
||||
name: "Catppuccin Latte",
|
||||
props: {
|
||||
X2: ":darken<2<@panel",
|
||||
X3: "rgba(255, 255, 255, 0.05)",
|
||||
X4: "rgba(255, 255, 255, 0.1)",
|
||||
X5: "rgba(255, 255, 255, 0.05)",
|
||||
X6: "rgba(255, 255, 255, 0.15)",
|
||||
X7: "rgba(255, 255, 255, 0.05)",
|
||||
X8: ":lighten<5<@accent",
|
||||
X9: ":darken<5<@accent",
|
||||
interactiveElementHovered: "rgba(255, 255, 255, 0.05)",
|
||||
messagingIsNotMe: "rgba(255, 255, 255, 0.1)",
|
||||
postFormButtonHoverBg: "rgba(255, 255, 255, 0.05)",
|
||||
accentLightenLess: ":lighten<5<@accent",
|
||||
accentDarkenLess: ":darken<5<@accent",
|
||||
bg: "#dce0e8",
|
||||
fg: "#4c4f69",
|
||||
X10: ":alpha<0.4<@accent",
|
||||
X11: "rgba(0, 0, 0, 0.3)",
|
||||
X12: "rgba(255, 255, 255, 0.1)",
|
||||
X13: "rgba(255, 255, 255, 0.15)",
|
||||
X14: ":alpha<0.5<@navBg",
|
||||
X15: ":alpha<0<@panel",
|
||||
X16: ":alpha<0.7<@panel",
|
||||
X17: ":alpha<0.8<@bg",
|
||||
calendarInfoMeterBg: "rgba(0, 0, 0, 0.3)",
|
||||
dividerHovered: "rgba(255, 255, 255, 0.15)",
|
||||
navBgTransparent: ":alpha<0.5<@navBg",
|
||||
panelFade: ":alpha<0<@panel",
|
||||
panelTransparent: ":alpha<0.7<@panel",
|
||||
cwBg: "#bcc0cc",
|
||||
cwFg: "#5c5f77",
|
||||
link: "#1e66f5",
|
||||
|
@ -4,24 +4,18 @@
|
||||
desc: 'Nord: an arctic, north-bluish color palette',
|
||||
name: 'Nord Light',
|
||||
props: {
|
||||
X2: ':darken<2<@panel',
|
||||
X3: 'rgba(255, 255, 255, 0.05)',
|
||||
X4: 'rgba(255, 255, 255, 0.1)',
|
||||
X5: 'rgba(255, 255, 255, 0.05)',
|
||||
X6: 'rgba(255, 255, 255, 0.15)',
|
||||
X7: 'rgba(255, 255, 255, 0.05)',
|
||||
X8: ':lighten<5<@accent',
|
||||
X9: ':darken<5<@accent',
|
||||
interactiveElementHovered: 'rgba(255, 255, 255, 0.05)',
|
||||
messagingIsNotMe: 'rgba(255, 255, 255, 0.1)',
|
||||
postFormButtonHoverBg: 'rgba(255, 255, 255, 0.05)',
|
||||
accentLightenLess: ':lighten<5<@accent',
|
||||
accentDarkenLess: ':darken<5<@accent',
|
||||
bg: '#d8dee9',
|
||||
fg: '#3b4252',
|
||||
X10: ':alpha<0.4<@accent',
|
||||
X11: 'rgba(0, 0, 0, 0.3)',
|
||||
X12: 'rgba(255, 255, 255, 0.1)',
|
||||
X13: 'rgba(255, 255, 255, 0.15)',
|
||||
X14: ':alpha<0.5<@navBg',
|
||||
X15: ':alpha<0<@panel',
|
||||
X16: ':alpha<0.7<@panel',
|
||||
X17: ':alpha<0.8<@bg',
|
||||
calendarInfoMeterBg: 'rgba(0, 0, 0, 0.3)',
|
||||
dividerHovered: 'rgba(255, 255, 255, 0.15)',
|
||||
navBgTransparent: ':alpha<0.5<@navBg',
|
||||
panelFade: ':alpha<0<@panel',
|
||||
panelTransparent: ':alpha<0.7<@panel',
|
||||
cwBg: '#687390',
|
||||
cwFg: '#393f4f',
|
||||
link: '#44a4c1',
|
||||
|
@ -68,22 +68,16 @@
|
||||
codeNumber: '#0fbbbb',
|
||||
codeBoolean: '#62b70c',
|
||||
htmlThemeColor: '@bg',
|
||||
X2: ':darken<2<@panel',
|
||||
X3: 'rgba(0, 0, 0, 0.05)',
|
||||
X4: 'rgba(0, 0, 0, 0.1)',
|
||||
X5: 'rgba(0, 0, 0, 0.05)',
|
||||
X6: 'rgba(0, 0, 0, 0.25)',
|
||||
X7: 'rgba(0, 0, 0, 0.05)',
|
||||
X8: ':lighten<5<@accent',
|
||||
X9: ':darken<5<@accent',
|
||||
X10: ':alpha<0.4<@accent',
|
||||
X11: 'rgba(0, 0, 0, 0.1)',
|
||||
X12: 'rgba(0, 0, 0, 0.1)',
|
||||
X13: 'rgba(0, 0, 0, 0.15)',
|
||||
X14: ':alpha<0.5<@navBg',
|
||||
X15: ':alpha<0<@panel',
|
||||
X16: ':alpha<0.7<@panel',
|
||||
X17: ':alpha<0.8<@bg',
|
||||
interactiveElementHovered: 'rgba(0, 0, 0, 0.05)',
|
||||
messagingIsNotMe: 'rgba(0, 0, 0, 0.1)',
|
||||
postFormButtonHoverBg: 'rgba(0, 0, 0, 0.05)',
|
||||
accentLightenLess: ':lighten<5<@accent',
|
||||
accentDarkenLess: ':darken<5<@accent',
|
||||
calendarInfoMeterBg: 'rgba(0, 0, 0, 0.1)',
|
||||
dividerHovered: 'rgba(0, 0, 0, 0.15)',
|
||||
navBgTransparent: ':alpha<0.5<@navBg',
|
||||
panelFade: ':alpha<0<@panel',
|
||||
panelTransparent: ':alpha<0.7<@panel',
|
||||
},
|
||||
author: '@thatonecalculator@stop.voring.me',
|
||||
}
|
||||
|
@ -3,24 +3,18 @@
|
||||
base: 'light',
|
||||
name: 'Mi U0 Light',
|
||||
props: {
|
||||
X2: ':darken<2<@panel',
|
||||
X3: 'rgba(255, 255, 255, 0.05)',
|
||||
X4: 'rgba(255, 255, 255, 0.1)',
|
||||
X5: 'rgba(255, 255, 255, 0.05)',
|
||||
X6: 'rgba(255, 255, 255, 0.15)',
|
||||
X7: 'rgba(255, 255, 255, 0.05)',
|
||||
X8: ':lighten<5<@accent',
|
||||
X9: ':darken<5<@accent',
|
||||
interactiveElementHovered: 'rgba(255, 255, 255, 0.05)',
|
||||
messagingIsNotMe: 'rgba(255, 255, 255, 0.1)',
|
||||
postFormButtonHoverBg: 'rgba(255, 255, 255, 0.05)',
|
||||
accentLightenLess: ':lighten<5<@accent',
|
||||
accentDarkenLess: ':darken<5<@accent',
|
||||
bg: '#e7e7eb',
|
||||
fg: '#5f5f5f',
|
||||
X10: ':alpha<0.4<@accent',
|
||||
X11: 'rgba(0, 0, 0, 0.3)',
|
||||
X12: 'rgba(255, 255, 255, 0.1)',
|
||||
X13: 'rgba(255, 255, 255, 0.15)',
|
||||
X14: ':alpha<0.5<@navBg',
|
||||
X15: ':alpha<0<@panel',
|
||||
X16: ':alpha<0.7<@panel',
|
||||
X17: ':alpha<0.8<@bg',
|
||||
calendarInfoMeterBg: 'rgba(0, 0, 0, 0.3)',
|
||||
dividerHovered: 'rgba(255, 255, 255, 0.15)',
|
||||
navBgTransparent: ':alpha<0.5<@navBg',
|
||||
panelFade: ':alpha<0<@panel',
|
||||
panelTransparent: ':alpha<0.7<@panel',
|
||||
cwBg: '#687390',
|
||||
cwFg: '#393f4f',
|
||||
link: '@accent',
|
||||
|
@ -62,21 +62,15 @@
|
||||
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)',
|
||||
X4: 'rgba(0, 0, 0, 0.1)',
|
||||
X5: 'rgba(0, 0, 0, 0.05)',
|
||||
X6: 'rgba(0, 0, 0, 0.25)',
|
||||
X7: 'rgba(0, 0, 0, 0.05)',
|
||||
X8: ':lighten<5<@accent',
|
||||
X9: ':darken<5<@accent',
|
||||
X10: ':alpha<0.4<@accent',
|
||||
X11: 'rgba(0, 0, 0, 0.1)',
|
||||
X12: 'rgba(0, 0, 0, 0.1)',
|
||||
X13: 'rgba(0, 0, 0, 0.15)',
|
||||
X14: ':alpha<0.5<@navBg',
|
||||
X15: ':alpha<0<@panel',
|
||||
X16: ':alpha<0.7<@panel',
|
||||
X17: ':alpha<0.8<@bg',
|
||||
interactiveElementHovered: 'rgba(0, 0, 0, 0.05)',
|
||||
messagingIsNotMe: 'rgba(0, 0, 0, 0.1)',
|
||||
postFormButtonHoverBg: 'rgba(0, 0, 0, 0.05)',
|
||||
accentLightenLess: ':lighten<5<@accent',
|
||||
accentDarkenLess: ':darken<5<@accent',
|
||||
calendarInfoMeterBg: 'rgba(0, 0, 0, 0.1)',
|
||||
dividerHovered: 'rgba(0, 0, 0, 0.15)',
|
||||
navBgTransparent: ':alpha<0.5<@navBg',
|
||||
panelFade: ':alpha<0<@panel',
|
||||
panelTransparent: ':alpha<0.7<@panel',
|
||||
},
|
||||
}
|
||||
|
@ -171,7 +171,7 @@ function more() {
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
padding: 2rem 0;
|
||||
background: var(--X14);
|
||||
background: var(--navBgTransparent);
|
||||
-webkit-backdrop-filter: var(--blur, blur(8px));
|
||||
backdrop-filter: var(--blur, blur(8px));
|
||||
|
||||
@ -213,7 +213,7 @@ function more() {
|
||||
position: sticky;
|
||||
bottom: 0;
|
||||
padding: 20px 0;
|
||||
background: var(--X14);
|
||||
background: var(--navBgTransparent);
|
||||
-webkit-backdrop-filter: var(--blur, blur(8px));
|
||||
backdrop-filter: var(--blur, blur(8px));
|
||||
|
||||
|
@ -30,7 +30,7 @@
|
||||
)
|
||||
.map((c) => c.width),
|
||||
) + 'px',
|
||||
}
|
||||
}
|
||||
"
|
||||
@wheel.self="onWheel"
|
||||
>
|
||||
@ -58,7 +58,7 @@
|
||||
columns.find(
|
||||
(c) => c.id === ids[0],
|
||||
)!.width + 'px',
|
||||
}
|
||||
}
|
||||
"
|
||||
@parent-focus="moveFocus(ids[0], $event)"
|
||||
@headerWheel="onWheel"
|
||||
@ -558,7 +558,7 @@ async function deleteProfile() {
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: var(--X2);
|
||||
background: var(--buttonHoverBg);
|
||||
}
|
||||
|
||||
> .indicator {
|
||||
|
@ -174,7 +174,7 @@ export default defineComponent({
|
||||
line-height: $height;
|
||||
-webkit-backdrop-filter: var(--blur, blur(32px));
|
||||
backdrop-filter: var(--blur, blur(32px));
|
||||
background-color: var(--X16);
|
||||
background-color: var(--panelTransparent);
|
||||
|
||||
> .wide {
|
||||
> .content {
|
||||
|
@ -214,7 +214,7 @@ defineExpose<WidgetComponentExpose>({
|
||||
> .meter {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
background: var(--X11);
|
||||
background: var(--calendarInfoMeterBg);
|
||||
border-radius: 8px;
|
||||
|
||||
> .val {
|
||||
|
Loading…
Reference in New Issue
Block a user