refactor(frontend): prefix css variables (#14725)
* wip * Update index.d.ts * remove unnecessary codes
This commit is contained in:
@@ -126,8 +126,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
<i class="ti ti-ban"></i>
|
||||
</button>
|
||||
<button ref="reactButton" :class="$style.footerButton" class="_button" @click="toggleReact()">
|
||||
<i v-if="appearNote.reactionAcceptance === 'likeOnly' && appearNote.myReaction != null" class="ti ti-heart-filled" style="color: var(--love);"></i>
|
||||
<i v-else-if="appearNote.myReaction != null" class="ti ti-minus" style="color: var(--accent);"></i>
|
||||
<i v-if="appearNote.reactionAcceptance === 'likeOnly' && appearNote.myReaction != null" class="ti ti-heart-filled" style="color: var(--MI_THEME-love);"></i>
|
||||
<i v-else-if="appearNote.myReaction != null" class="ti ti-minus" style="color: var(--MI_THEME-accent);"></i>
|
||||
<i v-else-if="appearNote.reactionAcceptance === 'likeOnly'" class="ti ti-heart"></i>
|
||||
<i v-else class="ti ti-plus"></i>
|
||||
<p v-if="(appearNote.reactionAcceptance === 'likeOnly' || defaultStore.state.showReactionsCount) && appearNote.reactionCount > 0" :class="$style.footerButtonCount">{{ number(appearNote.reactionCount) }}</p>
|
||||
@@ -643,7 +643,7 @@ function emitUpdReaction(emoji: string, delta: number) {
|
||||
margin: auto;
|
||||
width: calc(100% - 8px);
|
||||
height: calc(100% - 8px);
|
||||
border: dashed 2px var(--focus);
|
||||
border: dashed 2px var(--MI_THEME-focus);
|
||||
border-radius: var(--radius);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
@@ -666,9 +666,9 @@ function emitUpdReaction(emoji: string, delta: number) {
|
||||
right: 12px;
|
||||
padding: 0 4px;
|
||||
margin-bottom: 0 !important;
|
||||
background: var(--popup);
|
||||
background: var(--MI_THEME-popup);
|
||||
border-radius: 8px;
|
||||
box-shadow: 0px 4px 32px var(--shadow);
|
||||
box-shadow: 0px 4px 32px var(--MI_THEME-shadow);
|
||||
}
|
||||
|
||||
.footerButton {
|
||||
@@ -713,7 +713,7 @@ function emitUpdReaction(emoji: string, delta: number) {
|
||||
padding: 16px 32px 8px 32px;
|
||||
line-height: 28px;
|
||||
white-space: pre;
|
||||
color: var(--renote);
|
||||
color: var(--MI_THEME-renote);
|
||||
|
||||
& + .article {
|
||||
padding-top: 8px;
|
||||
@@ -836,7 +836,7 @@ function emitUpdReaction(emoji: string, delta: number) {
|
||||
|
||||
.showLessLabel {
|
||||
display: inline-block;
|
||||
background: var(--popup);
|
||||
background: var(--MI_THEME-popup);
|
||||
padding: 6px 10px;
|
||||
font-size: 0.8em;
|
||||
border-radius: 999px;
|
||||
@@ -857,16 +857,16 @@ function emitUpdReaction(emoji: string, delta: number) {
|
||||
z-index: 2;
|
||||
width: 100%;
|
||||
height: 64px;
|
||||
background: linear-gradient(0deg, var(--panel), color(from var(--panel) srgb r g b / 0));
|
||||
background: linear-gradient(0deg, var(--MI_THEME-panel), color(from var(--MI_THEME-panel) srgb r g b / 0));
|
||||
|
||||
&:hover > .collapsedLabel {
|
||||
background: var(--panelHighlight);
|
||||
background: var(--MI_THEME-panelHighlight);
|
||||
}
|
||||
}
|
||||
|
||||
.collapsedLabel {
|
||||
display: inline-block;
|
||||
background: var(--panel);
|
||||
background: var(--MI_THEME-panel);
|
||||
padding: 6px 10px;
|
||||
font-size: 0.8em;
|
||||
border-radius: 999px;
|
||||
@@ -878,12 +878,12 @@ function emitUpdReaction(emoji: string, delta: number) {
|
||||
}
|
||||
|
||||
.replyIcon {
|
||||
color: var(--accent);
|
||||
color: var(--MI_THEME-accent);
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
|
||||
.translation {
|
||||
border: solid 0.5px var(--divider);
|
||||
border: solid 0.5px var(--MI_THEME-divider);
|
||||
border-radius: var(--radius);
|
||||
padding: 12px;
|
||||
margin-top: 8px;
|
||||
@@ -903,7 +903,7 @@ function emitUpdReaction(emoji: string, delta: number) {
|
||||
|
||||
.quoteNote {
|
||||
padding: 16px;
|
||||
border: dashed 1px var(--renote);
|
||||
border: dashed 1px var(--MI_THEME-renote);
|
||||
border-radius: 8px;
|
||||
overflow: clip;
|
||||
}
|
||||
@@ -927,7 +927,7 @@ function emitUpdReaction(emoji: string, delta: number) {
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: var(--fgHighlighted);
|
||||
color: var(--MI_THEME-fgHighlighted);
|
||||
}
|
||||
}
|
||||
|
||||
|
Reference in New Issue
Block a user