diff --git a/CHANGELOG_CHERRYPICK.md b/CHANGELOG_CHERRYPICK.md index 6e65721cc5..4f2441679d 100644 --- a/CHANGELOG_CHERRYPICK.md +++ b/CHANGELOG_CHERRYPICK.md @@ -30,6 +30,7 @@ - 노트 작성 폼의 '노트' 버튼을 '냥!'으로 변경할 수 있는 옵션 추가 - 노트의 리액션을 삭제하지 않고도 리액션 버튼을 눌러 리액션을 변경할 수 있도록 (misskey-dev/misskey#11157) - 리노트를 신고할 수 있도록 (misskey-dev/misskey#11466) +- Rosé Pine 테마 추가 ([rose-pine/misskey](https://github.com/rose-pine/misskey)) ### Client - about-misskey 페이지에서 클라이언트 버전을 누르면 변경 사항을 볼 수 있음 diff --git a/packages/frontend/src/scripts/theme.ts b/packages/frontend/src/scripts/theme.ts index d518ed2808..6fec685989 100644 --- a/packages/frontend/src/scripts/theme.ts +++ b/packages/frontend/src/scripts/theme.ts @@ -26,6 +26,7 @@ export const themeProps = Object.keys(lightTheme.props).filter(key => !key.start export const getBuiltinThemes = () => Promise.all( [ 'l-cherrypick', + 'l-rosepinedawn', 'l-byeolvit-polaris', 'l-scone-color', 'l-stella-r2', @@ -41,6 +42,8 @@ export const getBuiltinThemes = () => Promise.all( 'l-birdsite', 'd-cherrypick', + 'd-rosepine', + 'd-rosepinemoon', 'd-byeolvit-noctiluca', 'd-scone-color', 'd-stella-r2', diff --git a/packages/frontend/src/themes/d-rosepine.json5 b/packages/frontend/src/themes/d-rosepine.json5 new file mode 100644 index 0000000000..c948c29cf2 --- /dev/null +++ b/packages/frontend/src/themes/d-rosepine.json5 @@ -0,0 +1,86 @@ +{ + id: '3cdfd635-4d5e-4d06-9ba3-20f123f0999b', + base: 'dark', + desc: 'Soho vibes for Misskey', + name: 'Rosé Pine', + props: { + X2: ':darken<2<@panel', + 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)', + X8: ':lighten<5<@accent', + X9: ':darken<5<@accent', + bg: '#191724', + fg: '#e0def4', + 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', + cwBg: '#1f1d2e', + cwFg: '#f6c177', + link: '#9ccfd8', + warn: '#f6c177', + badge: '#ebbcba', + error: '#eb6f92', + focus: ':alpha<0.3<@accent', + navBg: '@panel', + navFg: '@fg', + panel: ':lighten<3<@bg', + popup: ':lighten<3<@panel', + accent: '#c4a7e7', + header: ':alpha<0.7<@panel', + infoBg: '#253142', + infoFg: '#fff', + renote: '#31748f', + shadow: 'rgba(0, 0, 0, 0.3)', + divider: 'rgba(255, 255, 255, 0.1)', + hashtag: '#ebbcba', + mention: '@accent', + modalBg: 'rgba(0, 0, 0, 0.5)', + success: '#ebbcba', + buttonBg: 'rgba(255, 255, 255, 0.05)', + switchBg: 'rgba(255, 255, 255, 0.15)', + acrylicBg: ':alpha<0.5<@bg', + cwHoverBg: '#26233a', + indicator: '@accent', + mentionMe: '@mention', + messageBg: '@bg', + navActive: '@accent', + accentedBg: ':alpha<0.15<@accent', + fgOnAccent: '#26233a', + infoWarnBg: '#26233a', + infoWarnFg: '#f6c177', + navHoverFg: ':lighten<17<@fg', + 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: '#ebbcba', + 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)', + }, + author: '@thatonecalculator@stop.voring.me', +} diff --git a/packages/frontend/src/themes/d-rosepinemoon.json5 b/packages/frontend/src/themes/d-rosepinemoon.json5 new file mode 100644 index 0000000000..97c368a0f3 --- /dev/null +++ b/packages/frontend/src/themes/d-rosepinemoon.json5 @@ -0,0 +1,86 @@ +{ + id: 'c57b0d7b-80ed-4a84-95d8-bfdefbe91ed7', + base: 'dark', + desc: 'Soho vibes for Misskey, moon edition', + name: 'Rosé Pine Moon', + props: { + X2: ':darken<2<@panel', + 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)', + X8: ':lighten<5<@accent', + X9: ':darken<5<@accent', + bg: '#232136', + fg: '#e0def4', + 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', + cwBg: '#393552', + cwFg: '#f6c177', + link: '#3e8fb0', + warn: '#f6c177', + badge: '#ea9a97', + error: '#eb6f92', + focus: ':alpha<0.3<@accent', + navBg: '@panel', + navFg: '@fg', + panel: ':lighten<3<@bg', + popup: ':lighten<3<@panel', + accent: '#c4a7e7', + header: ':alpha<0.7<@panel', + infoBg: '#253142', + infoFg: '#fff', + renote: '#229e82', + shadow: 'rgba(0, 0, 0, 0.3)', + divider: 'rgba(255, 255, 255, 0.1)', + hashtag: '#ea9a97', + mention: '@accent', + modalBg: 'rgba(0, 0, 0, 0.5)', + success: '#ebbcba', + buttonBg: 'rgba(255, 255, 255, 0.05)', + switchBg: 'rgba(255, 255, 255, 0.15)', + acrylicBg: ':alpha<0.5<@bg', + cwHoverBg: '#393552', + indicator: '@accent', + mentionMe: '@mention', + messageBg: '@bg', + navActive: '@accent', + accentedBg: ':alpha<0.15<@accent', + fgOnAccent: '#393552', + infoWarnBg: '#393552', + infoWarnFg: '#f6c177', + navHoverFg: ':lighten<17<@fg', + 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: '#ea9a97', + 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)', + }, + author: '@thatonecalculator@stop.voring.me', +} diff --git a/packages/frontend/src/themes/l-rosepinedawn.json5 b/packages/frontend/src/themes/l-rosepinedawn.json5 new file mode 100644 index 0000000000..d19eb5925c --- /dev/null +++ b/packages/frontend/src/themes/l-rosepinedawn.json5 @@ -0,0 +1,89 @@ +{ + id: '919c91ac-c6fa-43dc-a423-3cc84fd67d7c', + base: 'light', + name: ' Rosé Pine Dawn', + description: 'Soho vibes for Misskey, dawn edition', + props: { + accent: '#286983', + accentDarken: ':darken<10<@accent', + accentLighten: ':lighten<10<@accent', + accentedBg: ':alpha<0.15<@accent', + focus: ':alpha<0.3<@accent', + bg: '#faf4ed', + acrylicBg: ':alpha<0.5<@bg', + fg: '#575279', + fgTransparentWeak: ':alpha<0.75<@fg', + fgTransparent: ':alpha<0.5<@fg', + fgHighlighted: ':darken<3<@fg', + fgOnAccent: '#fffaf3', + 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', + 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: '#56949f', + hashtag: '#ea9d34', + mention: '@accent', + mentionMe: '@mention', + renote: '#56949f', + modalBg: 'rgba(0, 0, 0, 0.3)', + scrollbarHandle: 'rgba(0, 0, 0, 0.2)', + scrollbarHandleHover: 'rgba(0, 0, 0, 0.4)', + dateLabelFg: '@fg', + infoBg: '#f2e9e1', + infoFg: '#ea9d34', + infoWarnBg: '#f2e9e1', + infoWarnFg: '#b4637a', + switchBg: 'rgba(0, 0, 0, 0.15)', + cwBg: '#b4637a', + cwFg: '#faf4ed', + cwHoverBg: '#d7827e', + buttonBg: 'rgba(0, 0, 0, 0.05)', + buttonHoverBg: 'rgba(0, 0, 0, 0.1)', + buttonGradateA: '#d7827e', + buttonGradateB: ':hue<20<#d7827e', + 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: '#907aa9', + error: '#b4637a', + warn: '#ea9d34', + codeString: '#b98710', + codeNumber: '#0fbbbb', + codeBoolean: '#62b70c', + htmlThemeColor: '@bg', + X2: ':darken<2<@panel', + 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)', + X8: ':lighten<5<@accent', + X9: ':darken<5<@accent', + X10: ':alpha<0.4<@accent', + X11: 'rgba(0, 0, 0, 0.1)', + X12: 'rgba(0, 0, 0, 0.1)', + X13: 'rgba(0, 0, 0, 0.15)', + X14: ':alpha<0.5<@navBg', + X15: ':alpha<0<@panel', + X16: ':alpha<0.7<@panel', + X17: ':alpha<0.8<@bg', + }, + author: '@thatonecalculator@stop.voring.me', +}