sendnrw/misskey
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wip

Browse Source
This commit is contained in:
syuilo
2024-08-27 10:14:30 +09:00
parent 296b8ce24b
commit dc76f14457
31 changed files with 120 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -79,6 +79,8 @@ import tinycolor from 'tinycolor2';
import { v4 as uuid } from 'uuid';
import JSON5 from 'json5';
import lightTheme from '@@/themes/_light.json5';
import darkTheme from '@@/themes/_dark.json5';
import MkButton from '@/components/MkButton.vue';
import MkCodeEditor from '@/components/MkCodeEditor.vue';
import MkTextarea from '@/components/MkTextarea.vue';
@@ -86,8 +88,6 @@ import MkFolder from '@/components/MkFolder.vue';
import { $i } from '@/account.js';
import { Theme, applyTheme } from '@/scripts/theme.js';
import lightTheme from '@/themes/_light.json5';
import darkTheme from '@/themes/_dark.json5';
import { host } from '@/config.js';
import * as os from '@/os.js';
import { ColdDeviceStorage, defaultStore } from '@/store.js';

4
packages/frontend/src/scripts/code-highlighter.ts
View File

@@ -7,13 +7,13 @@ import { getHighlighterCore, loadWasm } from 'shiki/core';
import darkPlus from 'shiki/themes/dark-plus.mjs';
import { bundledThemesInfo } from 'shiki/themes';
import { bundledLanguagesInfo } from 'shiki/langs';
import lightTheme from '@@/themes/_light.json5';
import darkTheme from '@@/themes/_dark.json5';
import { unique } from './array.js';
import { deepClone } from './clone.js';
import { deepMerge } from './merge.js';
import type { HighlighterCore, LanguageRegistration, ThemeRegistration, ThemeRegistrationRaw } from 'shiki/core';
import { ColdDeviceStorage } from '@/store.js';
import lightTheme from '@/themes/_light.json5';
import darkTheme from '@/themes/_dark.json5';
let _highlighter: HighlighterCore | null = null;

4
packages/frontend/src/scripts/theme.ts
View File

@@ -5,11 +5,11 @@
import { ref } from 'vue';
import tinycolor from 'tinycolor2';
import lightTheme from '@@/themes/_light.json5';
import darkTheme from '@@/themes/_dark.json5';
import { deepClone } from './clone.js';
import type { BundledTheme } from 'shiki/themes';
import { globalEvents } from '@/events.js';
import lightTheme from '@/themes/_light.json5';
import darkTheme from '@/themes/_dark.json5';
import { miLocalStorage } from '@/local-storage.js';
export type Theme = {

10
packages/frontend/src/store.ts
View File

@@ -458,10 +458,10 @@ export const defaultStore = markRaw(new Storage('base', {
where: 'device',
default: false,
},
contextMenu: {
contextMenu: {
where: 'device',
default: 'app' as 'app' | 'appWithShift' | 'native',
},
},
sound_masterVolume: {
where: 'device',
@@ -520,8 +520,8 @@ interface Watcher {
/**
* 常にメモリにロードしておく必要がないような設定情報を保管するストレージ(非リアクティブ)
*/
import lightTheme from '@/themes/l-light.json5';
import darkTheme from '@/themes/d-green-lime.json5';
import lightTheme from '@@/themes/l-light.json5';
import darkTheme from '@@/themes/d-green-lime.json5';
export class ColdDeviceStorage {
public static default = {
@@ -558,7 +558,7 @@ export class ColdDeviceStorage {
public static set<T extends keyof typeof ColdDeviceStorage.default>(key: T, value: typeof ColdDeviceStorage.default[T]): void {
// 呼び出し側のバグ等で undefined が来ることがある
// undefined を文字列として miLocalStorage に入れると参照する際の JSON.parse でコケて不具合の元になるため無視
// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
if (value === undefined) {
console.error(`attempt to store undefined value for key '${key}'`);
return;

93
packages/frontend/src/themes/_dark.json5
View File

@@ -1,93 +0,0 @@
// ダークテーマのベーステーマ
// このテーマが直接使われることは無い
{
id: 'dark',
name: 'Dark',
author: 'syuilo',
desc: 'Default dark theme',
kind: 'dark',
props: {
accent: '#86b300',
accentDarken: ':darken<10<@accent',
accentLighten: ':lighten<10<@accent',
accentedBg: ':alpha<0.15<@accent',
focus: ':alpha<0.3<@accent',
bg: '#000',
acrylicBg: ':alpha<0.5<@bg',
fg: '#dadada',
fgTransparentWeak: ':alpha<0.75<@fg',
fgTransparent: ':alpha<0.5<@fg',
fgHighlighted: ':lighten<3<@fg',
fgOnAccent: '#fff',
fgOnWhite: '#333',
divider: 'rgba(255, 255, 255, 0.1)',
indicator: '@accent',
panel: ':lighten<3<@bg',
panelHighlight: ':lighten<3<@panel',
panelHeaderBg: ':lighten<3<@panel',
panelHeaderFg: '@fg',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
panelBorder: '" solid 1px var(--divider)',
acrylicPanel: ':alpha<0.5<@panel',
windowHeader: ':alpha<0.85<@panel',
popup: ':lighten<3<@panel',
shadow: 'rgba(0, 0, 0, 0.3)',
header: ':alpha<0.7<@panel',
navBg: '@panel',
navFg: '@fg',
navHoverFg: ':lighten<17<@fg',
navActive: '@accent',
navIndicator: '@indicator',
link: '#44a4c1',
hashtag: '#ff9156',
mention: '@accent',
mentionMe: '@mention',
renote: '#229e82',
modalBg: 'rgba(0, 0, 0, 0.5)',
scrollbarHandle: 'rgba(255, 255, 255, 0.2)',
scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)',
dateLabelFg: '@fg',
infoBg: '#253142',
infoFg: '#fff',
infoWarnBg: '#42321c',
infoWarnFg: '#ffbd3e',
switchBg: 'rgba(255, 255, 255, 0.15)',
buttonBg: 'rgba(255, 255, 255, 0.05)',
buttonHoverBg: 'rgba(255, 255, 255, 0.1)',
buttonGradateA: '@accent',
buttonGradateB: ':hue<20<@accent',
switchOffBg: 'rgba(255, 255, 255, 0.1)',
switchOffFg: ':alpha<0.8<@fg',
switchOnBg: '@accentedBg',
switchOnFg: '@accent',
inputBorder: 'rgba(255, 255, 255, 0.1)',
inputBorderHover: 'rgba(255, 255, 255, 0.2)',
listItemHoverBg: 'rgba(255, 255, 255, 0.03)',
driveFolderBg: ':alpha<0.3<@accent',
wallpaperOverlay: 'rgba(0, 0, 0, 0.5)',
badge: '#31b1ce',
messageBg: '@bg',
success: '#86b300',
error: '#ec4137',
warn: '#ecb637',
codeString: '#ffb675',
codeNumber: '#cfff9e',
codeBoolean: '#c59eff',
deckBg: '#000',
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: {
base: 'one-dark-pro',
},
}

93
packages/frontend/src/themes/_light.json5
View File

@@ -1,93 +0,0 @@
// ライトテーマのベーステーマ
// このテーマが直接使われることは無い
{
id: 'light',
name: 'Light',
author: 'syuilo',
desc: 'Default light theme',
kind: 'light',
props: {
accent: '#86b300',
accentDarken: ':darken<10<@accent',
accentLighten: ':lighten<10<@accent',
accentedBg: ':alpha<0.15<@accent',
focus: ':alpha<0.3<@accent',
bg: '#fff',
acrylicBg: ':alpha<0.5<@bg',
fg: '#5f5f5f',
fgTransparentWeak: ':alpha<0.75<@fg',
fgTransparent: ':alpha<0.5<@fg',
fgHighlighted: ':darken<3<@fg',
fgOnAccent: '#fff',
fgOnWhite: '#333',
divider: 'rgba(0, 0, 0, 0.1)',
indicator: '@accent',
panel: ':lighten<3<@bg',
panelHighlight: ':darken<3<@panel',
panelHeaderBg: ':lighten<3<@panel',
panelHeaderFg: '@fg',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
panelBorder: '" solid 1px var(--divider)',
acrylicPanel: ':alpha<0.5<@panel',
windowHeader: ':alpha<0.85<@panel',
popup: ':lighten<3<@panel',
shadow: 'rgba(0, 0, 0, 0.1)',
header: ':alpha<0.7<@panel',
navBg: '@panel',
navFg: '@fg',
navHoverFg: ':darken<17<@fg',
navActive: '@accent',
navIndicator: '@indicator',
link: '#44a4c1',
hashtag: '#ff9156',
mention: '@accent',
mentionMe: '@mention',
renote: '#229e82',
modalBg: 'rgba(0, 0, 0, 0.3)',
scrollbarHandle: 'rgba(0, 0, 0, 0.2)',
scrollbarHandleHover: 'rgba(0, 0, 0, 0.4)',
dateLabelFg: '@fg',
infoBg: '#e5f5ff',
infoFg: '#72818a',
infoWarnBg: '#fff0db',
infoWarnFg: '#8f6e31',
switchBg: 'rgba(0, 0, 0, 0.15)',
buttonBg: 'rgba(0, 0, 0, 0.05)',
buttonHoverBg: 'rgba(0, 0, 0, 0.1)',
buttonGradateA: '@accent',
buttonGradateB: ':hue<20<@accent',
switchOffBg: 'rgba(0, 0, 0, 0.1)',
switchOffFg: '@panel',
switchOnBg: '@accent',
switchOnFg: '@fgOnAccent',
inputBorder: 'rgba(0, 0, 0, 0.1)',
inputBorderHover: 'rgba(0, 0, 0, 0.2)',
listItemHoverBg: 'rgba(0, 0, 0, 0.03)',
driveFolderBg: ':alpha<0.3<@accent',
wallpaperOverlay: 'rgba(255, 255, 255, 0.5)',
badge: '#31b1ce',
messageBg: '@bg',
success: '#86b300',
error: '#ec4137',
warn: '#ecb637',
codeString: '#b98710',
codeNumber: '#0fbbbb',
codeBoolean: '#62b70c',
deckBg: ':darken<3<@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: {
base: 'catppuccin-latte',
},
}

69
packages/frontend/src/themes/d-astro.json5
View File

@@ -1,69 +0,0 @@
{
id: '080a01c5-377d-4fbb-88cc-6bb5d04977ea',
base: 'dark',
name: 'Mi Astro Dark',
author: 'syuilo',
props: {
bg: '#232125',
fg: '#efdab9',
link: '#78b0a0',
warn: '#ecb637',
badge: '#31b1ce',
error: '#ec4137',
focus: ':alpha<0.3<@accent',
navBg: '@panel',
navFg: '@fg',
panel: '#2a272b',
accent: '#81c08b',
header: ':alpha<0.7<@bg',
infoBg: '#253142',
infoFg: '#fff',
renote: '#659CC8',
shadow: 'rgba(0, 0, 0, 0.3)',
divider: 'rgba(255, 255, 255, 0.1)',
hashtag: '#ff9156',
mention: '#ffd152',
modalBg: 'rgba(0, 0, 0, 0.5)',
success: '#86b300',
buttonBg: 'rgba(255, 255, 255, 0.05)',
acrylicBg: ':alpha<0.5<@bg',
indicator: '@accent',
mentionMe: '#fb5d38',
messageBg: '@bg',
navActive: '@accent',
infoWarnBg: '#42321c',
infoWarnFg: '#ffbd3e',
navHoverFg: ':lighten<17<@fg',
dateLabelFg: '@fg',
inputBorder: 'rgba(255, 255, 255, 0.1)',
inputBorderHover: 'rgba(255, 255, 255, 0.2)',
panelBorder: '" solid 1px var(--divider)',
accentDarken: ':darken<10<@accent',
acrylicPanel: ':alpha<0.5<@panel',
navIndicator: '@accent',
accentLighten: ':lighten<10<@accent',
buttonHoverBg: 'rgba(255, 255, 255, 0.1)',
buttonGradateA: '@accent',
buttonGradateB: ':hue<-20<@accent',
driveFolderBg: ':alpha<0.3<@accent',
fgHighlighted: ':lighten<3<@fg',
panelHeaderBg: ':lighten<3<@panel',
panelHeaderFg: '@fg',
htmlThemeColor: '@bg',
fgOnWhite: '@accent',
panelHighlight: ':lighten<3<@panel',
listItemHoverBg: 'rgba(255, 255, 255, 0.03)',
scrollbarHandle: 'rgba(255, 255, 255, 0.2)',
wallpaperOverlay: 'rgba(0, 0, 0, 0.5)',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
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)',
},
}

26
packages/frontend/src/themes/d-botanical.json5
View File

@@ -1,26 +0,0 @@
{
id: '504debaf-4912-6a4c-5059-1db08a76b737',
name: 'Mi Botanical Dark',
author: 'syuilo',
base: 'dark',
props: {
accent: 'rgb(148, 179, 0)',
bg: 'rgb(37, 38, 36)',
fg: 'rgb(216, 212, 199)',
fgHighlighted: '#fff',
fgOnWhite: '@accent',
divider: 'rgba(255, 255, 255, 0.14)',
panel: 'rgb(47, 47, 44)',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
header: ':alpha<0.7<@panel',
navBg: '#363636',
renote: '@accent',
mention: 'rgb(212, 153, 76)',
mentionMe: 'rgb(212, 210, 76)',
hashtag: '#5bcbb0',
link: '@accent',
},
}

21
packages/frontend/src/themes/d-cherry.json5
View File

@@ -1,21 +0,0 @@
{
id: '679b3b87-a4e9-4789-8696-b56c15cc33b0',
name: 'Mi Cherry Dark',
author: 'syuilo',
base: 'dark',
props: {
accent: 'rgb(255, 89, 117)',
bg: 'rgb(28, 28, 37)',
fg: 'rgb(236, 239, 244)',
fgOnWhite: '@accent',
panel: 'rgb(35, 35, 47)',
renote: '@accent',
link: '@accent',
mention: '@accent',
hashtag: '@accent',
divider: 'rgb(63, 63, 80)',
},
}

26
packages/frontend/src/themes/d-dark.json5
View File

@@ -1,26 +0,0 @@
{
id: '8050783a-7f63-445a-b270-36d0f6ba1677',
name: 'Mi Dark',
author: 'syuilo',
desc: 'Default light theme',
base: 'dark',
props: {
bg: '#232323',
fg: 'rgb(199, 209, 216)',
fgHighlighted: '#fff',
fgOnWhite: '@accent',
divider: 'rgba(255, 255, 255, 0.14)',
panel: '#2d2d2d',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
header: ':alpha<0.7<@panel',
navBg: '#363636',
renote: '@accent',
mention: '#da6d35',
mentionMe: '#d44c4c',
hashtag: '#4cb8d4',
link: '@accent',
},
}

27
packages/frontend/src/themes/d-future.json5
View File

@@ -1,27 +0,0 @@
{
id: '32a637ef-b47a-4775-bb7b-bacbb823f865',
name: 'Mi Future Dark',
author: 'syuilo',
base: 'dark',
props: {
accent: '#63e2b7',
bg: '#101014',
fg: '#D5D5D6',
fgHighlighted: '#fff',
fgOnAccent: '#000',
fgOnWhite: '@accent',
divider: 'rgba(255, 255, 255, 0.1)',
panel: '#18181c',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
renote: '@accent',
mention: '#f2c97d',
mentionMe: '@accent',
hashtag: '#70c0e8',
link: '#e88080',
buttonGradateA: '@accent',
buttonGradateB: ':saturate<30<:hue<30<@accent',
},
}

24
packages/frontend/src/themes/d-green-lime.json5
View File

@@ -1,24 +0,0 @@
{
id: '02816013-8107-440f-877e-865083ffe194',
name: 'Mi Green+Lime Dark',
author: 'syuilo',
base: 'dark',
props: {
accent: '#b4e900',
bg: '#0C1210',
fg: '#dee7e4',
fgHighlighted: '#fff',
fgOnAccent: '#192320',
fgOnWhite: '@accent',
divider: '#e7fffb24',
panel: '#192320',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
popup: '#293330',
renote: '@accent',
mentionMe: '#ffaa00',
link: '#24d7ce',
},
}

24
packages/frontend/src/themes/d-green-orange.json5
View File

@@ -1,24 +0,0 @@
{
id: 'dc489603-27b5-424a-9b25-1ff6aec9824a',
name: 'Mi Green+Orange Dark',
author: 'syuilo',
base: 'dark',
props: {
accent: '#e97f00',
bg: '#0C1210',
fg: '#dee7e4',
fgHighlighted: '#fff',
fgOnAccent: '#192320',
fgOnWhite: '@accent',
divider: '#e7fffb24',
panel: '#192320',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
popup: '#293330',
renote: '@accent',
mentionMe: '#b4e900',
link: '#24d7ce',
},
}

14
packages/frontend/src/themes/d-ice.json5
View File

@@ -1,14 +0,0 @@
{
id: '66e7e5a9-cd43-42cd-837d-12f47841fa34',
name: 'Mi Ice Dark',
author: 'syuilo',
base: 'dark',
props: {
accent: '#47BFE8',
fgOnWhite: '@accent',
bg: '#212526',
},
}

26
packages/frontend/src/themes/d-persimmon.json5
View File

@@ -1,26 +0,0 @@
{
id: 'c503d768-7c70-4db2-a4e6-08264304bc8d',
name: 'Mi Persimmon Dark',
author: 'syuilo',
base: 'dark',
props: {
accent: 'rgb(206, 102, 65)',
bg: 'rgb(31, 33, 31)',
fg: '#cdd8c7',
fgHighlighted: '#fff',
fgOnWhite: '@accent',
divider: 'rgba(255, 255, 255, 0.14)',
panel: 'rgb(41, 43, 41)',
infoFg: '@fg',
infoBg: '#333c3b',
navBg: '#141714',
renote: '@accent',
mention: '@accent',
mentionMe: '#de6161',
hashtag: '#68bad0',
link: '#a1c758',
},
}

83
packages/frontend/src/themes/d-u0.json5
View File

@@ -1,83 +0,0 @@
{
id: '7a5bc13b-df8f-4d44-8e94-4452f0c634bb',
base: 'dark',
name: 'Mi U0 Dark',
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',
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',
link: '@accent',
warn: '#ecb637',
badge: '#31b1ce',
error: '#ec4137',
focus: ':alpha<0.3<@accent',
navBg: '@panel',
navFg: '@fg',
panel: ':lighten<3<@bg',
popup: ':lighten<3<@panel',
accent: '#00a497',
header: ':alpha<0.7<@panel',
infoBg: '#253142',
infoFg: '#fff',
renote: '@accent',
shadow: 'rgba(0, 0, 0, 0.3)',
divider: 'rgba(255, 255, 255, 0.1)',
hashtag: '#e6b422',
mention: '@accent',
modalBg: 'rgba(0, 0, 0, 0.5)',
success: '#86b300',
buttonBg: 'rgba(255, 255, 255, 0.05)',
switchBg: 'rgba(255, 255, 255, 0.15)',
acrylicBg: ':alpha<0.5<@bg',
indicator: '@accent',
mentionMe: '@mention',
messageBg: '@bg',
navActive: '@accent',
accentedBg: ':alpha<0.15<@accent',
codeNumber: '#cfff9e',
codeString: '#ffb675',
fgOnAccent: '#fff',
fgOnWhite: '@accent',
infoWarnBg: '#42321c',
infoWarnFg: '#ffbd3e',
navHoverFg: ':lighten<17<@fg',
codeBoolean: '#c59eff',
dateLabelFg: '@fg',
inputBorder: 'rgba(255, 255, 255, 0.1)',
panelBorder: '" solid 1px var(--divider)',
accentDarken: ':darken<10<@accent',
acrylicPanel: ':alpha<0.5<@panel',
navIndicator: '@indicator',
accentLighten: ':lighten<10<@accent',
buttonHoverBg: 'rgba(255, 255, 255, 0.1)',
driveFolderBg: ':alpha<0.3<@accent',
fgHighlighted: ':lighten<3<@fg',
fgTransparent: ':alpha<0.5<@fg',
panelHeaderBg: ':lighten<3<@panel',
panelHeaderFg: '@fg',
buttonGradateA: '@accent',
buttonGradateB: ':hue<20<@accent',
htmlThemeColor: '@bg',
panelHighlight: ':lighten<3<@panel',
listItemHoverBg: 'rgba(255, 255, 255, 0.03)',
scrollbarHandle: 'rgba(255, 255, 255, 0.2)',
inputBorderHover: 'rgba(255, 255, 255, 0.2)',
wallpaperOverlay: 'rgba(0, 0, 0, 0.5)',
fgTransparentWeak: ':alpha<0.75<@fg',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)',
deckBg: '#142022',
},
}

23
packages/frontend/src/themes/l-apricot.json5
View File

@@ -1,23 +0,0 @@
{
id: '0ff48d43-aab3-46e7-ab12-8492110d2e2b',
name: 'Mi Apricot Light',
author: 'syuilo',
base: 'light',
props: {
accent: 'rgb(234, 154, 82)',
bg: '#e6e5e2',
fg: 'rgb(149, 143, 139)',
fgOnWhite: '@accent',
panel: '#EEECE8',
renote: '@accent',
link: '@accent',
mention: '@accent',
hashtag: '@accent',
inputBorder: 'rgba(0, 0, 0, 0.1)',
inputBorderHover: 'rgba(0, 0, 0, 0.2)',
infoBg: 'rgb(226, 235, 241)',
},
}

30
packages/frontend/src/themes/l-botanical.json5
View File

@@ -1,30 +0,0 @@
{
id: '1100673c-f902-4ccd-93aa-7cb88be56178',
name: 'Mi Botanical Light',
author: 'ThinaticSystem',
base: 'light',
props: {
accent: '#77b58c',
bg: 'e2deda',
fg: '#3d3d3d',
fgHighlighted: '#6bc9a0',
fgOnWhite: '@accent',
divider: '#cfcfcf',
panel: '@X14',
panelHeaderBg: '@panel',
panelHeaderDivider: '@divider',
header: ':alpha<0.7<@panel',
navBg: '@X14',
renote: '#229e92',
mention: '#da6d35',
mentionMe: '#d44c4c',
hashtag: '#4cb8d4',
link: '@accent',
buttonGradateB: ':hue<-70<@accent',
success: '#86b300',
X14: '#ebe7e5'
},
}

22
packages/frontend/src/themes/l-cherry.json5
View File

@@ -1,22 +0,0 @@
{
id: 'ac168876-f737-4074-a3fc-a370c732ef48',
name: 'Mi Cherry Light',
author: 'syuilo',
base: 'light',
props: {
accent: 'rgb(219, 96, 114)',
bg: 'rgb(254, 248, 249)',
fg: 'rgb(152, 13, 26)',
fgOnWhite: '@accent',
panel: 'rgb(255, 255, 255)',
renote: '@accent',
link: 'rgb(156, 187, 5)',
mention: '@accent',
hashtag: '@accent',
divider: 'rgba(134, 51, 51, 0.1)',
inputBorderHover: 'rgb(238, 221, 222)',
},
}

22
packages/frontend/src/themes/l-coffee.json5
View File

@@ -1,22 +0,0 @@
{
id: '6ed80faa-74f0-42c2-98e4-a64d9e138eab',
name: 'Mi Coffee Light',
author: 'syuilo',
base: 'light',
props: {
accent: '#9f8989',
bg: '#f5f3f3',
fg: '#7f6666',
fgOnWhite: '@accent',
panel: '#fff',
divider: 'rgba(87, 68, 68, 0.1)',
renote: 'rgb(160, 172, 125)',
link: 'rgb(137, 151, 159)',
mention: '@accent',
mentionMe: 'rgb(170, 149, 98)',
hashtag: '@accent',
},
}

21
packages/frontend/src/themes/l-light.json5
View File

@@ -1,21 +0,0 @@
{
id: '4eea646f-7afa-4645-83e9-83af0333cd37',
name: 'Mi Light',
author: 'syuilo',
desc: 'Default light theme',
base: 'light',
props: {
bg: '#f9f9f9',
fg: '#676767',
fgOnWhite: '@accent',
divider: '#e8e8e8',
header: ':alpha<0.7<@panel',
navBg: '#fff',
panel: '#fff',
panelHeaderDivider: '@divider',
mentionMe: 'rgb(0, 179, 70)',
},
}

22
packages/frontend/src/themes/l-rainy.json5
View File

@@ -1,22 +0,0 @@
{
id: 'a58a0abb-ff8c-476a-8dec-0ad7837e7e96',
name: 'Mi Rainy Light',
author: 'syuilo',
base: 'light',
props: {
accent: '#5db0da',
bg: 'rgb(246 248 249)',
fg: '#636b71',
fgOnWhite: '@accent',
panel: '#fff',
divider: 'rgb(230 233 234)',
panelHeaderDivider: '@divider',
renote: '@accent',
link: '@accent',
mention: '@accent',
hashtag: '@accent',
},
}

19
packages/frontend/src/themes/l-sushi.json5
View File

@@ -1,19 +0,0 @@
{
id: '213273e5-7d20-d5f0-6e36-1b6a4f67115c',
name: 'Mi Sushi Light',
author: 'syuilo',
base: 'light',
props: {
accent: '#e36749',
bg: '#f0eee9',
fg: '#5f5f5f',
fgOnWhite: '@accent',
renote: '@accent',
link: '@accent',
mention: '@accent',
hashtag: '#229e82',
},
}

82
packages/frontend/src/themes/l-u0.json5
View File

@@ -1,82 +0,0 @@
{
id: 'e2c940b5-6e9a-4c03-b738-261c720c426d',
base: 'light',
name: 'Mi U0 Light',
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',
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',
link: '@accent',
warn: '#ecb637',
badge: '#31b1ce',
error: '#ec4137',
focus: ':alpha<0.3<@accent',
navBg: '@panel',
navFg: '@fg',
panel: ':lighten<3<@bg',
popup: ':lighten<3<@panel',
accent: '#478384',
header: ':alpha<0.7<@panel',
infoBg: '#253142',
infoFg: '#fff',
renote: '@accent',
shadow: 'rgba(0, 0, 0, 0.3)',
divider: '#4646461a',
hashtag: '#1f3134',
mention: '@accent',
modalBg: 'rgba(0, 0, 0, 0.5)',
success: '#86b300',
buttonBg: '#0000000d',
switchBg: 'rgba(255, 255, 255, 0.15)',
acrylicBg: ':alpha<0.5<@bg',
indicator: '@accent',
mentionMe: '@mention',
messageBg: '@bg',
navActive: '@accent',
accentedBg: ':alpha<0.15<@accent',
codeNumber: '#cfff9e',
codeString: '#ffb675',
fgOnAccent: '#fff',
fgOnWhite: '@accent',
infoWarnBg: '#42321c',
infoWarnFg: '#ffbd3e',
navHoverFg: ':lighten<17<@fg',
codeBoolean: '#c59eff',
dateLabelFg: '@fg',
inputBorder: 'rgba(255, 255, 255, 0.1)',
panelBorder: '" solid 1px var(--divider)',
accentDarken: ':darken<10<@accent',
acrylicPanel: ':alpha<0.5<@panel',
navIndicator: '@indicator',
accentLighten: ':lighten<10<@accent',
buttonHoverBg: '#0000001a',
driveFolderBg: ':alpha<0.3<@accent',
fgHighlighted: ':lighten<3<@fg',
fgTransparent: ':alpha<0.5<@fg',
panelHeaderBg: ':lighten<3<@panel',
panelHeaderFg: '@fg',
buttonGradateA: '@accent',
buttonGradateB: ':hue<20<@accent',
htmlThemeColor: '@bg',
panelHighlight: ':lighten<3<@panel',
listItemHoverBg: 'rgba(255, 255, 255, 0.03)',
scrollbarHandle: '#74747433',
inputBorderHover: 'rgba(255, 255, 255, 0.2)',
wallpaperOverlay: 'rgba(0, 0, 0, 0.5)',
fgTransparentWeak: ':alpha<0.75<@fg',
panelHeaderDivider: 'rgba(0, 0, 0, 0)',
scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)',
},
}

72
packages/frontend/src/themes/l-vivid.json5
View File

@@ -1,72 +0,0 @@
{
id: '6128c2a9-5c54-43fe-a47d-17942356470b',
name: 'Mi Vivid Light',
author: 'syuilo',
base: 'light',
props: {
bg: '#fafafa',
fg: '#444',
link: '#ff9400',
warn: '#ecb637',
badge: '#31b1ce',
error: '#ec4137',
focus: ':alpha<0.3<@accent',
navBg: '@panel',
navFg: '@fg',
panel: '#fff',
accent: '#008cff',
header: ':alpha<0.7<@panel',
infoBg: '#e5f5ff',
infoFg: '#72818a',
renote: '@accent',
shadow: 'rgba(0, 0, 0, 0.1)',
divider: 'rgba(0, 0, 0, 0.08)',
hashtag: '#92d400',
mention: '@accent',
modalBg: 'rgba(0, 0, 0, 0.3)',
success: '#86b300',
buttonBg: 'rgba(0, 0, 0, 0.05)',
acrylicBg: ':alpha<0.5<@bg',
indicator: '@accent',
mentionMe: '@mention',
messageBg: '@bg',
navActive: '@accent',
infoWarnBg: '#fff0db',
infoWarnFg: '#8f6e31',
navHoverFg: ':darken<17<@fg',
dateLabelFg: '@fg',
inputBorder: 'rgba(0, 0, 0, 0.1)',
inputBorderHover: 'rgba(0, 0, 0, 0.2)',
panelBorder: '" solid 1px var(--divider)',
accentDarken: ':darken<10<@accent',
acrylicPanel: ':alpha<0.5<@panel',
navIndicator: '@accent',
accentLighten: ':lighten<10<@accent',
buttonHoverBg: 'rgba(0, 0, 0, 0.1)',
driveFolderBg: ':alpha<0.3<@accent',
fgHighlighted: ':darken<3<@fg',
fgTransparent: ':alpha<0.5<@fg',
fgOnWhite: '@accent',
panelHeaderBg: ':lighten<3<@panel',
panelHeaderFg: '@fg',
htmlThemeColor: '@bg',
panelHighlight: ':darken<3<@panel',
listItemHoverBg: 'rgba(0, 0, 0, 0.03)',
scrollbarHandle: 'rgba(0, 0, 0, 0.2)',
wallpaperOverlay: 'rgba(255, 255, 255, 0.5)',
fgTransparentWeak: ':alpha<0.75<@fg',
panelHeaderDivider: '@divider',
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)',
},
}

3
packages/frontend/tsconfig.json
View File

@@ -23,7 +23,8 @@
"useDefineForClassFields": true,
"baseUrl": ".",
"paths": {
"@/*": ["./src/*"]
"@/*": ["./src/*"],
"@@/*": ["../frontend-shared/*"]
},
"typeRoots": [
"./@types",

1
packages/frontend/vite.config.ts
View File

@@ -87,6 +87,7 @@ export function getConfig(): UserConfig {
extensions,
alias: {
'@/': __dirname + '/src/',
'@@/': __dirname + '/../frontend-shared/',
'/client-assets/': __dirname + '/assets/',
'/static-assets/': __dirname + '/../backend/assets/',
'/fluent-emojis/': __dirname + '/../../fluent-emojis/dist/',