mirror of
https://github.com/misskey-dev/misskey.git
synced 2026-05-05 05:26:03 +02:00
🎨
This commit is contained in:
@@ -420,7 +420,7 @@ onBeforeUnmount(() => {
|
||||
}
|
||||
|
||||
&:active {
|
||||
background: var(--MI_THEME-accentDarken);
|
||||
background: hsl(from var(--MI_THEME-accent) h s calc(l - 10));
|
||||
color: #fff !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -103,13 +103,13 @@ async function onClick() {
|
||||
background: var(--MI_THEME-accent);
|
||||
|
||||
&:hover {
|
||||
background: var(--MI_THEME-accentLighten);
|
||||
border-color: var(--MI_THEME-accentLighten);
|
||||
background: hsl(from var(--MI_THEME-accent) h s calc(l + 10));
|
||||
border-color: hsl(from var(--MI_THEME-accent) h s calc(l + 10));
|
||||
}
|
||||
|
||||
&:active {
|
||||
background: var(--MI_THEME-accentDarken);
|
||||
border-color: var(--MI_THEME-accentDarken);
|
||||
background: hsl(from var(--MI_THEME-accent) h s calc(l - 10));
|
||||
border-color: hsl(from var(--MI_THEME-accent) h s calc(l - 10));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -151,11 +151,11 @@ function onDragend() {
|
||||
background: var(--MI_THEME-accent);
|
||||
|
||||
&:hover {
|
||||
background: var(--MI_THEME-accentLighten);
|
||||
background: hsl(from var(--MI_THEME-accent) h s calc(l + 10));
|
||||
}
|
||||
|
||||
&:active {
|
||||
background: var(--MI_THEME-accentDarken);
|
||||
background: hsl(from var(--MI_THEME-accent) h s calc(l - 10));
|
||||
}
|
||||
|
||||
> .label {
|
||||
|
||||
@@ -211,13 +211,13 @@ onBeforeUnmount(() => {
|
||||
background: var(--MI_THEME-accent);
|
||||
|
||||
&:hover {
|
||||
background: var(--MI_THEME-accentLighten);
|
||||
border-color: var(--MI_THEME-accentLighten);
|
||||
background: hsl(from var(--MI_THEME-accent) h s calc(l + 10));
|
||||
border-color: hsl(from var(--MI_THEME-accent) h s calc(l + 10));
|
||||
}
|
||||
|
||||
&:active {
|
||||
background: var(--MI_THEME-accentDarken);
|
||||
border-color: var(--MI_THEME-accentDarken);
|
||||
background: hsl(from var(--MI_THEME-accent) h s calc(l - 10));
|
||||
border-color: hsl(from var(--MI_THEME-accent) h s calc(l - 10));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -220,7 +220,7 @@ function showMenu(ev: MouseEvent) {
|
||||
position: absolute;
|
||||
border-radius: 6px;
|
||||
background-color: var(--MI_THEME-fg);
|
||||
color: var(--MI_THEME-accentLighten);
|
||||
color: hsl(from var(--MI_THEME-accent) h s calc(l + 10));
|
||||
font-size: 12px;
|
||||
opacity: .5;
|
||||
padding: 5px 8px;
|
||||
@@ -294,7 +294,7 @@ html[data-color-scheme=light] .visible {
|
||||
/* Hardcode to black because either --MI_THEME-bg or --MI_THEME-fg makes it hard to read in dark/light mode */
|
||||
background-color: black;
|
||||
border-radius: 6px;
|
||||
color: var(--MI_THEME-accentLighten);
|
||||
color: hsl(from var(--MI_THEME-accent) h s calc(l + 10));
|
||||
display: inline-block;
|
||||
font-weight: bold;
|
||||
font-size: 0.8em;
|
||||
|
||||
@@ -553,7 +553,7 @@ onDeactivated(() => {
|
||||
/* Hardcode to black because either --MI_THEME-bg or --MI_THEME-fg makes it hard to read in dark/light mode */
|
||||
background-color: black;
|
||||
border-radius: 6px;
|
||||
color: var(--MI_THEME-accentLighten);
|
||||
color: hsl(from var(--MI_THEME-accent) h s calc(l + 10));
|
||||
display: inline-block;
|
||||
font-weight: bold;
|
||||
font-size: 0.8em;
|
||||
@@ -565,7 +565,7 @@ onDeactivated(() => {
|
||||
position: absolute;
|
||||
border-radius: 6px;
|
||||
background-color: var(--MI_THEME-fg);
|
||||
color: var(--MI_THEME-accentLighten);
|
||||
color: hsl(from var(--MI_THEME-accent) h s calc(l + 10));
|
||||
font-size: 12px;
|
||||
opacity: .5;
|
||||
padding: 5px 8px;
|
||||
|
||||
@@ -287,7 +287,7 @@ function onMousedown(ev: MouseEvent | TouchEvent) {
|
||||
border-radius: 999px;
|
||||
|
||||
&:hover {
|
||||
background: var(--MI_THEME-accentLighten);
|
||||
background: hsl(from var(--MI_THEME-accent) h s calc(l + 10));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -345,7 +345,7 @@ $cellHeight: 28px;
|
||||
border: solid 0.5px transparent;
|
||||
|
||||
&.selected {
|
||||
border: solid 0.5px var(--MI_THEME-accentLighten);
|
||||
border: solid 0.5px hsl(from var(--MI_THEME-accent) h s calc(l + 10));
|
||||
}
|
||||
|
||||
&.ranged {
|
||||
|
||||
@@ -151,7 +151,7 @@ misskeyApiGet('federation/instances', {
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
background: var(--MI_THEME-acrylicPanel);
|
||||
background: color(from var(--MI_THEME-panel) srgb r g b / 0.5);
|
||||
-webkit-backdrop-filter: var(--MI-blur, blur(15px));
|
||||
backdrop-filter: var(--MI-blur, blur(15px));
|
||||
border-radius: 999px;
|
||||
|
||||
@@ -398,7 +398,7 @@ rt {
|
||||
}
|
||||
|
||||
._acrylic {
|
||||
background: var(--MI_THEME-acrylicPanel);
|
||||
background: color(from var(--MI_THEME-panel) srgb r g b / 0.5);
|
||||
-webkit-backdrop-filter: var(--MI-blur, blur(15px));
|
||||
backdrop-filter: var(--MI-blur, blur(15px));
|
||||
}
|
||||
|
||||
@@ -159,7 +159,7 @@ function more() {
|
||||
|
||||
&:hover, &.active {
|
||||
&::before {
|
||||
background: var(--MI_THEME-accentLighten);
|
||||
background: hsl(from var(--MI_THEME-accent) h s calc(l + 10));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -382,7 +382,7 @@ function menuEdit() {
|
||||
|
||||
&:hover, &.active {
|
||||
&::before {
|
||||
background: var(--MI_THEME-accentLighten);
|
||||
background: hsl(from var(--MI_THEME-accent) h s calc(l + 10));
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -612,7 +612,7 @@ function menuEdit() {
|
||||
|
||||
&:hover, &.active {
|
||||
&::before {
|
||||
background: var(--MI_THEME-accentLighten);
|
||||
background: hsl(from var(--MI_THEME-accent) h s calc(l + 10));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -49,7 +49,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
<button v-tooltip.noDelay.left="i18n.ts._deck.addColumn" :class="$style.sideMenuButton" class="_button" @click="addColumn"><i class="ti ti-plus"></i></button>
|
||||
</div>
|
||||
<div :class="$style.sideMenuBottom">
|
||||
<button v-tooltip.noDelay.left="i18n.ts.settings" :class="$style.sideMenuButton" class="_button" @click="showSettings"><i class="ti ti-settings"></i></button>
|
||||
<button v-tooltip.noDelay.left="i18n.ts.settings" :class="$style.sideMenuButton" class="_button" @click="showSettings"><i class="ti ti-settings-2"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -63,7 +63,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
<button v-tooltip.noDelay.left="i18n.ts._deck.addColumn" :class="$style.bottomMenuButton" class="_button" @click="addColumn"><i class="ti ti-plus"></i></button>
|
||||
</div>
|
||||
<div :class="$style.bottomMenuRight">
|
||||
<button v-tooltip.noDelay.left="i18n.ts.settings" :class="$style.bottomMenuButton" class="_button" @click="showSettings"><i class="ti ti-settings"></i></button>
|
||||
<button v-tooltip.noDelay.left="i18n.ts.settings" :class="$style.bottomMenuButton" class="_button" @click="showSettings"><i class="ti ti-settings-2"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user