refactor(frontend): prefix css variables (#14725)

* wip

* Update index.d.ts

* remove unnecessary codes
This commit is contained in:
syuilo
2024-10-09 18:08:14 +09:00
committed by GitHub
parent 0ad31bd5d4
commit 4a356f1ba7
280 changed files with 1076 additions and 1093 deletions

View File

@@ -21,7 +21,7 @@ SPDX-License-Identifier: AGPL-3.0-only
>
<svg viewBox="0 0 256 128" :class="$style.tabShape">
<g transform="matrix(6.2431,0,0,6.2431,-677.417,-29.3839)">
<path d="M149.512,4.707L108.507,4.707C116.252,4.719 118.758,14.958 118.758,14.958C118.758,14.958 121.381,25.283 129.009,25.209L149.512,25.209L149.512,4.707Z" style="fill:var(--deckBg);"/>
<path d="M149.512,4.707L108.507,4.707C116.252,4.719 118.758,14.958 118.758,14.958C118.758,14.958 121.381,25.283 129.009,25.209L149.512,25.209L149.512,4.707Z" style="fill:var(--MI_THEME-deckBg);"/>
</g>
</svg>
<div :class="$style.color"></div>
@@ -299,7 +299,7 @@ function onDrop(ev) {
left: 0;
width: 100%;
height: 100%;
background: var(--focus);
background: var(--MI_THEME-focus);
}
}
@@ -313,7 +313,7 @@ function onDrop(ev) {
left: 0;
width: 100%;
height: 100%;
background: var(--focus);
background: var(--MI_THEME-focus);
opacity: 0.5;
}
}
@@ -331,19 +331,19 @@ function onDrop(ev) {
}
&.naked {
background: var(--acrylicBg) !important;
background: var(--MI_THEME-acrylicBg) !important;
-webkit-backdrop-filter: var(--blur, blur(10px));
backdrop-filter: var(--blur, blur(10px));
> .header {
background: transparent;
box-shadow: none;
color: var(--fg);
color: var(--MI_THEME-fg);
}
> .body {
background: transparent !important;
scrollbar-color: var(--scrollbarHandle) transparent;
scrollbar-color: var(--MI_THEME-scrollbarHandle) transparent;
&::-webkit-scrollbar-track {
background: transparent;
@@ -352,12 +352,12 @@ function onDrop(ev) {
}
&.paged {
background: var(--bg) !important;
background: var(--MI_THEME-bg) !important;
> .body {
background: var(--bg) !important;
background: var(--MI_THEME-bg) !important;
overflow-y: scroll !important;
scrollbar-color: var(--scrollbarHandle) transparent;
scrollbar-color: var(--MI_THEME-scrollbarHandle) transparent;
&::-webkit-scrollbar-track {
background: inherit;
@@ -374,9 +374,9 @@ function onDrop(ev) {
height: var(--deckColumnHeaderHeight);
padding: 0 16px 0 30px;
font-size: 0.9em;
color: var(--panelHeaderFg);
background: var(--panelHeaderBg);
box-shadow: 0 1px 0 0 var(--panelHeaderDivider);
color: var(--MI_THEME-panelHeaderFg);
background: var(--MI_THEME-panelHeaderBg);
box-shadow: 0 1px 0 0 var(--MI_THEME-panelHeaderDivider);
cursor: pointer;
user-select: none;
}
@@ -387,7 +387,7 @@ function onDrop(ev) {
left: 12px;
width: 3px;
height: calc(100% - 24px);
background: var(--accent);
background: var(--MI_THEME-accent);
border-radius: 999px;
}
@@ -441,11 +441,11 @@ function onDrop(ev) {
overscroll-behavior-y: contain;
box-sizing: border-box;
container-type: size;
background-color: var(--bg);
scrollbar-color: var(--scrollbarHandle) var(--panel);
background-color: var(--MI_THEME-bg);
scrollbar-color: var(--MI_THEME-scrollbarHandle) var(--MI_THEME-panel);
&::-webkit-scrollbar-track {
background: var(--panel);
background: var(--MI_THEME-panel);
}
}
</style>

View File

@@ -58,7 +58,7 @@ const menu = [{
<style lang="scss" module>
.root {
--margin: 8px;
--panelBorder: none;
--MI_THEME-panelBorder: none;
padding: 0 var(--margin);
}