etc/Sharkey
0
0
Fork 0
mirror of https://activitypub.software/TransFem-org/Sharkey synced 2024-11-27 00:13:03 +00:00
Code Issues Projects Releases Packages Wiki Activity

テーマの切り替えをなめらかに

Browse source
This commit is contained in:
syuilo 2019-03-03 08:43:51 +09:00
parent e8ef8f0004
commit 4de75448b6
No known key found for this signature in database
GPG key ID: BDC4C49D06AB9D69
3 changed files with 14 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/client/app/init.ts
View file

@ -389,7 +389,7 @@ export default (callback: (launch: (router: VueRouter) => [Vue, MiOS], os: MiOS)
}); });
//#endregion //#endregion
// Reapply current theme /*// Reapply current theme
try { try {
const themeName = os.store.state.device.darkmode ? os.store.state.device.darkTheme : os.store.state.device.lightTheme; const themeName = os.store.state.device.darkmode ? os.store.state.device.darkTheme : os.store.state.device.lightTheme;
const themes = os.store.state.device.themes.concat(builtinThemes); const themes = os.store.state.device.themes.concat(builtinThemes);
@ -399,7 +399,7 @@ export default (callback: (launch: (router: VueRouter) => [Vue, MiOS], os: MiOS)
} }
} catch (e) { } catch (e) {
console.log(`Cannot reapply theme. ${e}`); console.log(`Cannot reapply theme. ${e}`);
} }*/
//#region line width //#region line width
document.documentElement.style.setProperty('--lineWidth', `${os.store.state.device.lineWidth}px`); document.documentElement.style.setProperty('--lineWidth', `${os.store.state.device.lineWidth}px`);

6
src/client/app/theme.ts
View file

@ -43,6 +43,12 @@ export const builtinThemes = [
]; ];
export function applyTheme(theme: Theme, persisted = true) { export function applyTheme(theme: Theme, persisted = true) {
document.documentElement.classList.add('change-theme');
setTimeout(() => {
document.documentElement.classList.remove('change-theme');
}, 500);
// Deep copy // Deep copy
const _theme = JSON.parse(JSON.stringify(theme)); const _theme = JSON.parse(JSON.stringify(theme));

6
src/client/style.styl
View file

@ -20,6 +20,12 @@ html, body
text-size-adjust 100% text-size-adjust 100%
font-family sans-serif font-family sans-serif
html.change-theme
&, *
transition-property all
transition-duration 0.5s
transition-timing-function ease
a a
text-decoration none text-decoration none
color var(--link) color var(--link)