usbharu
/
misskey
mirror of https://github.com/misskey-dev/misskey.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor(frontend): remove X theme properties (#15376) 

* refactor(frontend): remove X theme properties

* Update MkAutocomplete.vue

* Update WidgetCalendar.vue
This commit is contained in:
syuilo 2025-02-05 20:17:48 +09:00 committed by GitHub
parent c548ec9906
commit cfb61289a9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
14 changed files with 17 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/frontend-shared/themes/_dark.json5
View File

@ -79,14 +79,6 @@
codeBoolean: '#c59eff', codeBoolean: '#c59eff',
deckBg: '#000', deckBg: '#000',
htmlThemeColor: '@bg', htmlThemeColor: '@bg',
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)',
X11: 'rgba(0, 0, 0, 0.3)',
X12: 'rgba(255, 255, 255, 0.1)',
X13: 'rgba(255, 255, 255, 0.15)',
}, },
codeHighlighter: { codeHighlighter: {

8
packages/frontend-shared/themes/_light.json5
View File

@ -79,14 +79,6 @@
codeBoolean: '#62b70c', codeBoolean: '#62b70c',
deckBg: ':darken<3<@bg', deckBg: ':darken<3<@bg',
htmlThemeColor: '@bg', htmlThemeColor: '@bg',
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)',
X11: 'rgba(0, 0, 0, 0.1)',
X12: 'rgba(0, 0, 0, 0.1)',
X13: 'rgba(0, 0, 0, 0.15)',
}, },
codeHighlighter: { codeHighlighter: {

8
packages/frontend-shared/themes/d-astro.json5
View File

@ -54,13 +54,5 @@
wallpaperOverlay: 'rgba(0, 0, 0, 0.5)', wallpaperOverlay: 'rgba(0, 0, 0, 0.5)',
panelHeaderDivider: 'rgba(0, 0, 0, 0)', panelHeaderDivider: 'rgba(0, 0, 0, 0)',
scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)', scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)',
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)',
X11: 'rgba(0, 0, 0, 0.3)',
X12: 'rgba(255, 255, 255, 0.1)',
X13: 'rgba(255, 255, 255, 0.15)',
}, },
} }

8
packages/frontend-shared/themes/d-u0.json5
View File

@ -3,17 +3,9 @@
base: 'dark', base: 'dark',
name: 'Mi U0 Dark', name: 'Mi U0 Dark',
props: { props: {
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)',
bg: '#172426', bg: '#172426',
fg: '#dadada', fg: '#dadada',
X10: ':alpha<0.4<@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', X14: ':alpha<0.5<@navBg',
X15: ':alpha<0<@panel', X15: ':alpha<0<@panel',
X16: ':alpha<0.7<@panel', X16: ':alpha<0.7<@panel',

8
packages/frontend-shared/themes/l-u0.json5
View File

@ -3,17 +3,9 @@
base: 'light', base: 'light',
name: 'Mi U0 Light', name: 'Mi U0 Light',
props: { props: {
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)',
bg: '#e7e7eb', bg: '#e7e7eb',
fg: '#5f5f5f', fg: '#5f5f5f',
X10: ':alpha<0.4<@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', X14: ':alpha<0.5<@navBg',
X15: ':alpha<0<@panel', X15: ':alpha<0<@panel',
X16: ':alpha<0.7<@panel', X16: ':alpha<0.7<@panel',

8
packages/frontend-shared/themes/l-vivid.json5
View File

@ -57,13 +57,5 @@
fgTransparentWeak: ':alpha<0.75<@fg', fgTransparentWeak: ':alpha<0.75<@fg',
panelHeaderDivider: '@divider', panelHeaderDivider: '@divider',
scrollbarHandleHover: 'rgba(0, 0, 0, 0.4)', scrollbarHandleHover: 'rgba(0, 0, 0, 0.4)',
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)',
X11: 'rgba(0, 0, 0, 0.1)',
X12: 'rgba(0, 0, 0, 0.1)',
X13: 'rgba(0, 0, 0, 0.15)',
}, },
} }

6
packages/frontend/src/components/MkAutocomplete.vue
View File

@ -47,8 +47,9 @@ SPDX-License-Identifier: AGPL-3.0-only
import { markRaw, ref, shallowRef, computed, onUpdated, onMounted, onBeforeUnmount, nextTick, watch } from 'vue'; import { markRaw, ref, shallowRef, computed, onUpdated, onMounted, onBeforeUnmount, nextTick, watch } from 'vue';
import sanitizeHtml from 'sanitize-html'; import sanitizeHtml from 'sanitize-html';
import { emojilist, getEmojiName } from '@@/js/emojilist.js'; import { emojilist, getEmojiName } from '@@/js/emojilist.js';
import contains from '@/scripts/contains.js';
import { char2twemojiFilePath, char2fluentEmojiFilePath } from '@@/js/emoji-base.js'; import { char2twemojiFilePath, char2fluentEmojiFilePath } from '@@/js/emoji-base.js';
import { MFM_TAGS, MFM_PARAMS } from '@@/js/const.js';
import contains from '@/scripts/contains.js';
import { acct } from '@/filters/user.js'; import { acct } from '@/filters/user.js';
import * as os from '@/os.js'; import * as os from '@/os.js';
import { misskeyApi } from '@/scripts/misskey-api.js'; import { misskeyApi } from '@/scripts/misskey-api.js';
@ -56,7 +57,6 @@ import { defaultStore } from '@/store.js';
import { i18n } from '@/i18n.js'; import { i18n } from '@/i18n.js';
import { miLocalStorage } from '@/local-storage.js'; import { miLocalStorage } from '@/local-storage.js';
import { customEmojis } from '@/custom-emojis.js'; import { customEmojis } from '@/custom-emojis.js';
import { MFM_TAGS, MFM_PARAMS } from '@@/js/const.js';
import { searchEmoji } from '@/scripts/search-emoji.js'; import { searchEmoji } from '@/scripts/search-emoji.js';
import type { EmojiDef } from '@/scripts/search-emoji.js'; import type { EmojiDef } from '@/scripts/search-emoji.js';
@ -408,7 +408,7 @@ onBeforeUnmount(() => {
text-overflow: ellipsis; text-overflow: ellipsis;
&:hover { &:hover {
background: var(--MI_THEME-X3); background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.05));
} }
&[data-selected='true'] { &[data-selected='true'] {

4
packages/frontend/src/components/MkCustomEmojiDetailedDialog.vue
View File

@ -85,7 +85,7 @@ function cancel() {
.emojiImgWrapper { .emojiImgWrapper {
max-width: 100%; max-width: 100%;
height: 40cqh; height: 40cqh;
background-image: repeating-linear-gradient(45deg, transparent, transparent 8px, var(--MI_THEME-X5) 8px, var(--MI_THEME-X5) 14px); background-image: repeating-linear-gradient(45deg, transparent, transparent 8px, light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.05)) 8px, light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.05)) 14px);
border-radius: var(--MI-radius); border-radius: var(--MI-radius);
margin: auto; margin: auto;
overflow-y: hidden; overflow-y: hidden;
@ -101,7 +101,7 @@ function cancel() {
display: inline-block; display: inline-block;
word-break: break-all; word-break: break-all;
padding: 3px 10px; padding: 3px 10px;
background-color: var(--MI_THEME-X5); background-color: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.05));
border: solid 1px var(--MI_THEME-divider); border: solid 1px var(--MI_THEME-divider);
border-radius: var(--MI-radius); border-radius: var(--MI-radius);
} }

6
packages/frontend/src/components/MkEmojiPicker.vue
View File

@ -582,7 +582,7 @@ defineExpose({
&:disabled { &:disabled {
cursor: not-allowed; cursor: not-allowed;
background: linear-gradient(-45deg, transparent 0% 48%, var(--MI_THEME-X6) 48% 52%, transparent 52% 100%); background: linear-gradient(-45deg, transparent 0% 48%, light-dark(rgba(0, 0, 0, 0.25), rgba(255, 255, 255, 0.15)) 48% 52%, transparent 52% 100%);
opacity: 1; opacity: 1;
> .emoji { > .emoji {
@ -617,7 +617,7 @@ defineExpose({
&:disabled { &:disabled {
cursor: not-allowed; cursor: not-allowed;
background: linear-gradient(-45deg, transparent 0% 48%, var(--MI_THEME-X6) 48% 52%, transparent 52% 100%); background: linear-gradient(-45deg, transparent 0% 48%, light-dark(rgba(0, 0, 0, 0.25), rgba(255, 255, 255, 0.15)) 48% 52%, transparent 52% 100%);
opacity: 1; opacity: 1;
> .emoji { > .emoji {
@ -738,7 +738,7 @@ defineExpose({
&:disabled { &:disabled {
cursor: not-allowed; cursor: not-allowed;
background: linear-gradient(-45deg, transparent 0% 48%, var(--MI_THEME-X6) 48% 52%, transparent 52% 100%); background: linear-gradient(-45deg, transparent 0% 48%, light-dark(rgba(0, 0, 0, 0.25), rgba(255, 255, 255, 0.15)) 48% 52%, transparent 52% 100%);
opacity: 1; opacity: 1;
> .emoji { > .emoji {

6
packages/frontend/src/components/MkPostForm.vue
View File

@ -1166,7 +1166,7 @@ defineExpose({
border-radius: 6px; border-radius: 6px;
&:hover { &:hover {
background: var(--MI_THEME-X5); background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.05));
} }
&:disabled { &:disabled {
@ -1238,7 +1238,7 @@ html[data-color-scheme=light] .preview {
margin-right: 14px; margin-right: 14px;
padding: 8px 0 8px 8px; padding: 8px 0 8px 8px;
border-radius: 8px; border-radius: 8px;
background: var(--MI_THEME-X4); background: light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1));
} }
.hasNotSpecifiedMentions { .hasNotSpecifiedMentions {
@ -1349,7 +1349,7 @@ html[data-color-scheme=light] .preview {
border-radius: 6px; border-radius: 6px;
&:hover { &:hover {
background: var(--MI_THEME-X5); background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.05));
} }
&.footerButtonActive { &.footerButtonActive {

4
packages/frontend/src/components/MkUserSelectDialog.vue
View File

@ -63,6 +63,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<script lang="ts" setup> <script lang="ts" setup>
import { onMounted, ref, computed, shallowRef } from 'vue'; import { onMounted, ref, computed, shallowRef } from 'vue';
import * as Misskey from 'misskey-js'; import * as Misskey from 'misskey-js';
import { host as currentHost, hostname } from '@@/js/config.js';
import MkInput from '@/components/MkInput.vue'; import MkInput from '@/components/MkInput.vue';
import FormSplit from '@/components/form/split.vue'; import FormSplit from '@/components/form/split.vue';
import MkModalWindow from '@/components/MkModalWindow.vue'; import MkModalWindow from '@/components/MkModalWindow.vue';
@ -71,7 +72,6 @@ import { defaultStore } from '@/store.js';
import { i18n } from '@/i18n.js'; import { i18n } from '@/i18n.js';
import { $i } from '@/account.js'; import { $i } from '@/account.js';
import { instance } from '@/instance.js'; import { instance } from '@/instance.js';
import { host as currentHost, hostname } from '@@/js/config.js';
const emit = defineEmits<{ const emit = defineEmits<{
(ev: 'ok', selected: Misskey.entities.UserDetailed): void; (ev: 'ok', selected: Misskey.entities.UserDetailed): void;
@ -198,7 +198,7 @@ onMounted(() => {
font-size: 14px; font-size: 14px;
&:hover { &:hover {
background: var(--MI_THEME-X7); background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.05));
} }
&.selected { &.selected {

2
packages/frontend/src/pages/admin/server-rules.vue
View File

@ -122,7 +122,7 @@ definePageMetadata(() => ({
border-radius: 6px; border-radius: 6px;
&:hover { &:hover {
background: var(--MI_THEME-X5); background: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.05));
} }
} }

4
packages/frontend/src/pages/page-editor/page-editor.container.vue
View File

@ -61,11 +61,11 @@ function remove() {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
background: var(--MI_THEME-panel); background: var(--MI_THEME-panel);
border: solid 2px var(--MI_THEME-X12); border: solid 2px light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1));
border-radius: 8px; border-radius: 8px;
&:hover { &:hover {
border: solid 2px var(--MI_THEME-X13); border: solid 2px light-dark(rgba(0, 0, 0, 0.15), rgba(255, 255, 255, 0.15));
} }
&.warn { &.warn {

2
packages/frontend/src/widgets/WidgetCalendar.vue
View File

@ -208,7 +208,7 @@ defineExpose<WidgetComponentExpose>({
.meter { .meter {
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
background: var(--MI_THEME-X11); background: light-dark(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.3));
border-radius: 8px; border-radius: 8px;
} }