Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-12-20 16:40:13 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

✨ fix https://github.com/siyuan-note/siyuan/issues/5854

Browse source
This commit is contained in:
Vanessa 2022-09-25 21:52:23 +08:00
parent 1c688288be
commit 30535ba6af
8 changed files with 67 additions and 81 deletions
Download patch file Download diff file Expand all files Collapse all files

3
app/appearance/icons/ant/icon.js
View file

@ -59,9 +59,6 @@ document.body.insertAdjacentHTML('afterBegin', `<svg style="position: absolute;
<path d="M15 4h2q0.267 0 0.267 0.267v23.467q0 0.267-0.267 0.267h-2q-0.267 0-0.267-0.267v-23.467q0-0.267 0.267-0.267z"></path>
<path d="M4.8 14.733h22.401q0.267 0 0.267 0.267v2q0 0.267-0.267 0.267h-22.401q-0.267 0-0.267-0.267v-2q0-0.267 0.267-0.267z"></path>
</symbol>
<symbol id="iconMoon" viewBox="0 0 32 32">
<path d="M11.324 4.462c-0.32 1.138-0.48 2.329-0.48 3.538 0 7.253 5.902 13.156 13.156 13.156 1.209 0 2.4-0.16 3.538-0.48-1.849 4.551-6.329 7.769-11.538 7.769-6.862 0-12.444-5.582-12.444-12.444 0-5.209 3.218-9.689 7.769-11.538zM16 0c-8.836 0-16 7.164-16 16s7.164 16 16 16 16-7.164 16-16c0-0.818-0.071-1.636-0.178-2.418-1.742 2.436-4.587 4.018-7.822 4.018-5.298 0-9.6-4.302-9.6-9.6 0-3.218 1.582-6.080 4.018-7.822-0.782-0.107-1.6-0.178-2.418-0.178v0z"></path>
</symbol>
<symbol id="iconCut" viewBox="0 0 32 32">
<path d="M18.345 16l13.553-13.587c0.213-0.213 0.064-0.583-0.238-0.583h-3.851c-0.089 0-0.179 0.034-0.238 0.098l-11.63 11.66-3.838-3.851c0.532-0.94 0.838-2.026 0.838-3.183 0-3.57-2.898-6.468-6.468-6.468s-6.468 2.898-6.468 6.468 2.898 6.468 6.468 6.468c1.179 0 2.281-0.315 3.23-0.864l3.83 3.843-3.834 3.843c-0.923-0.543-2.033-0.864-3.218-0.864-0.004 0-0.008 0-0.012 0h0.001c-3.57 0-6.468 2.898-6.468 6.468s2.898 6.468 6.468 6.468 6.468-2.898 6.468-6.468c0-1.157-0.306-2.243-0.838-3.183l3.838-3.851 11.63 11.66c0.064 0.064 0.149 0.098 0.238 0.098h3.855c0.302 0 0.455-0.366 0.238-0.583l-13.553-13.587zM6.468 9.957c-1.877 0-3.404-1.528-3.404-3.404s1.528-3.404 3.404-3.404 3.404 1.528 3.404 3.404-1.528 3.404-3.404 3.404zM6.468 28.851c-1.877 0-3.404-1.528-3.404-3.404s1.528-3.404 3.404-3.404 3.404 1.528 3.404 3.404-1.528 3.404-3.404 3.404z"></path>
</symbol>

6
app/appearance/icons/index.html
View file

@ -142,12 +142,6 @@
</svg>
iconAdd
</div>
<div>
<svg>
<use xlink:href="#iconMoon"></use>
</svg>
iconMoon
</div>
<div>
<svg>
<use xlink:href="#iconUncheck"></use>

3
app/appearance/icons/material/icon.js
View file

@ -57,9 +57,6 @@ document.body.insertAdjacentHTML('afterbegin', `<svg style="position: absolute;
<symbol id="iconAdd" viewBox="0 0 32 32">
<path d="M28 17.715h-10.285v10.285h-3.428v-10.285h-10.286v-3.428h10.286v-10.286h3.428v10.286h10.285v3.428z"></path>
</symbol>
<symbol id="iconMoon" viewBox="0 0 32 32">
<path d="M11.324 4.462c-0.32 1.138-0.48 2.329-0.48 3.538 0 7.253 5.902 13.156 13.156 13.156 1.209 0 2.4-0.16 3.538-0.48-1.849 4.551-6.329 7.769-11.538 7.769-6.862 0-12.444-5.582-12.444-12.444 0-5.209 3.218-9.689 7.769-11.538zM16 0c-8.836 0-16 7.164-16 16s7.164 16 16 16 16-7.164 16-16c0-0.818-0.071-1.636-0.178-2.418-1.742 2.436-4.587 4.018-7.822 4.018-5.298 0-9.6-4.302-9.6-9.6 0-3.218 1.582-6.080 4.018-7.822-0.782-0.107-1.6-0.178-2.418-0.178v0z"></path>
</symbol>
<symbol id="iconCut" viewBox="0 0 32 32">
<path d="M12.224 9.024c0.368-0.8 0.576-1.68 0.576-2.624 0-3.536-2.864-6.4-6.4-6.4s-6.4 2.864-6.4 6.4 2.864 6.4 6.4 6.4c0.944 0 1.824-0.208 2.624-0.576l3.776 3.776-3.776 3.776c-0.8-0.368-1.68-0.576-2.624-0.576-3.536 0-6.4 2.864-6.4 6.4s2.864 6.4 6.4 6.4 6.4-2.864 6.4-6.4c0-0.944-0.208-1.824-0.576-2.624l3.776-3.776 11.2 11.2h4.8v-1.6l-19.776-19.776zM6.4 9.6c-1.76 0-3.2-1.424-3.2-3.2s1.44-3.2 3.2-3.2 3.2 1.424 3.2 3.2-1.44 3.2-3.2 3.2zM6.4 28.8c-1.76 0-3.2-1.424-3.2-3.2s1.44-3.2 3.2-3.2 3.2 1.424 3.2 3.2-1.44 3.2-3.2 3.2zM16 16.8c-0.448 0-0.8-0.352-0.8-0.8s0.352-0.8 0.8-0.8 0.8 0.352 0.8 0.8-0.352 0.8-0.8 0.8zM27.2 1.6l-9.6 9.6 3.2 3.2 11.2-11.2v-1.6h-4.8z"></path>
</symbol>

11
app/electron/main.js
View file

@ -335,7 +335,12 @@ const boot = () => {
}
event.preventDefault()
})
nativeTheme.on('updated', () => {
mainWindow.webContents.send('siyuan-update-theme', {
theme: nativeTheme.shouldUseDarkColors ? 'dark' : 'light',
init: false,
})
})
// 监听主题切换
ipcMain.on('siyuan-config-theme', (event, theme) => {
nativeTheme.themeSource = theme
@ -376,6 +381,10 @@ const boot = () => {
writeLog('exited ui')
})
ipcMain.on('siyuan-init', async () => {
mainWindow.webContents.send('siyuan-update-theme', {
theme: nativeTheme.shouldUseDarkColors ? 'dark' : 'light',
init: true,
})
await fetch('http://127.0.0.1:6806/api/system/uiproc?pid=' + process.pid,
{method: 'POST'})
})

53
app/src/config/appearance.ts
View file

@ -20,9 +20,9 @@ export const appearance = {
</div>
<span class="fn__space"></span>
<select class="b3-select fn__flex-center fn__size200" id="mode">
<option value="0" ${window.siyuan.config.appearance.mode === 0 ? "selected" : ""}>${window.siyuan.languages.themeLight}</option>
<option value="1" ${window.siyuan.config.appearance.mode === 1 ? "selected" : ""}>${window.siyuan.languages.themeDark}</option>
<!--option value="dark" ${window.siyuan.config.appearance.mode === 2 ? "selected" : ""}>${window.siyuan.languages.appearance7}</option-->
<option value="0" ${(window.siyuan.config.appearance.mode === 0 && !window.siyuan.config.appearance.modeOS) ? "selected" : ""}>${window.siyuan.languages.themeLight}</option>
<option value="1" ${(window.siyuan.config.appearance.mode === 1 && !window.siyuan.config.appearance.modeOS) ? "selected" : ""}>${window.siyuan.languages.themeDark}</option>
<option value="2" ${window.siyuan.config.appearance.modeOS ? "selected" : ""}>${window.siyuan.languages.appearance7}</option>
</select>
</label>
<div class="b3-label">
@ -211,13 +211,14 @@ export const appearance = {
css
});
},
_send: (mode?: number) => {
_send: () => {
const themeLight = (appearance.element.querySelector("#themeLight") as HTMLSelectElement).value;
const themeDark = (appearance.element.querySelector("#themeDark") as HTMLSelectElement).value;
const modeNumber = typeof mode === "number" ? mode : parseInt((appearance.element.querySelector("#mode") as HTMLSelectElement).value);
const modeElementValue = parseInt((appearance.element.querySelector("#mode") as HTMLSelectElement).value)
fetchPost("/api/setting/setAppearance", {
icon: (appearance.element.querySelector("#icon") as HTMLSelectElement).value,
mode: modeNumber,
mode: modeElementValue === 2 ? window.siyuan.config.appearance.mode : modeElementValue,
modeOS: modeElementValue === 2,
codeBlockThemeDark: (appearance.element.querySelector("#codeBlockThemeDark") as HTMLSelectElement).value,
codeBlockThemeLight: (appearance.element.querySelector("#codeBlockThemeLight") as HTMLSelectElement).value,
themeDark,
@ -231,12 +232,9 @@ export const appearance = {
nativeEmoji: (appearance.element.querySelector("#nativeEmoji") as HTMLInputElement).checked,
hideStatusBar: (appearance.element.querySelector("#hideStatusBar") as HTMLInputElement).checked,
}, response => {
let needTip = false;
if (modeNumber !== window.siyuan.config.appearance.mode || themeLight !== window.siyuan.config.appearance.themeLight ||
themeDark !== window.siyuan.config.appearance.themeDark) {
needTip = true;
}
if (window.siyuan.config.appearance.themeJS && needTip) {
if ((window.siyuan.config.appearance.themeJS && !response.data.modeOS && response.data.mode !== window.siyuan.config.appearance.mode) ||
(response.data.modeOS && !window.siyuan.config.appearance.modeOS)
) {
exportLayout(true);
return;
}
@ -294,13 +292,7 @@ export const appearance = {
/// #endif
appearance.element.querySelectorAll("select").forEach(item => {
item.addEventListener("change", () => {
let mode;
if (item.id === "themeLight") {
mode = 0;
} else if (item.id === "themeDark") {
mode = 1;
}
appearance._send(mode);
appearance._send();
});
});
appearance.element.querySelectorAll(".b3-switch").forEach((item) => {
@ -309,7 +301,7 @@ export const appearance = {
});
});
},
onSetappearance(data: IAppearance) {
onSetappearance(data: IAppearance, needLoadAsset = true) {
if (data.lang !== window.siyuan.config.appearance.lang || data.nativeEmoji !== window.siyuan.config.appearance.nativeEmoji) {
exportLayout(true);
return;
@ -317,10 +309,13 @@ export const appearance = {
window.siyuan.config.appearance = data;
if (appearance.element) {
const theme = data.mode === 0 ? data.themeLight : data.themeDark;
const modeElement = appearance.element.querySelector("#mode");
const modeElement = appearance.element.querySelector("#mode") as HTMLSelectElement;
if (modeElement) {
modeElement.innerHTML = `<option value="0" ${data.mode === 0 ? "selected" : ""}>${window.siyuan.languages.themeLight}</option>
<option value="1" ${data.mode === 1 ? "selected" : ""}>${window.siyuan.languages.themeDark}</option>`;
if (data.modeOS) {
modeElement.value = "2";
} else {
modeElement.value = data.mode === 0 ? "0" : "1";
}
appearance.element.querySelector("#appearanceCustomName").textContent = theme;
}
const themeLightElement = appearance.element.querySelector("#themeLight") as HTMLSelectElement;
@ -344,19 +339,11 @@ export const appearance = {
}
}
/// #if !BROWSER
ipcRenderer.send(Constants.SIYUAN_CONFIG_THEME, data.mode === 1 ? "dark" : "light");
ipcRenderer.send(Constants.SIYUAN_CONFIG_THEME, data.modeOS ? "system" : (data.mode === 1 ? "dark" : "light"));
ipcRenderer.send(Constants.SIYUAN_CONFIG_CLOSE, data.closeButtonBehavior);
/// #endif
if (needLoadAsset) {
loadAssets(data);
const modeElement = document.getElementById("barThemeMode");
if (modeElement) {
if (data.mode === 1) {
modeElement.classList.add("toolbar__item--active");
modeElement.setAttribute("aria-label", window.siyuan.languages.themeLight);
} else {
modeElement.classList.remove("toolbar__item--active");
modeElement.setAttribute("aria-label", window.siyuan.languages.themeDark);
}
}
}
};

1
app/src/constants.ts
View file

@ -31,6 +31,7 @@ export abstract class Constants {
public static readonly SIYUAN_SAVE_CLOSE: string = "siyuan-save-close";
public static readonly SIYUAN_EXPORT_PDF: string = "siyuan-export-pdf";
public static readonly SIYUAN_EXPORT_CLOSE: string = "siyuan-export-close";
public static readonly SIYUAN_UPDATE_THEME: string = "siyuan-update-theme";
// size
public static readonly SIZE_TOOLBAR_HEIGHT: number = 30;

1
app/src/types/index.d.ts vendored
View file

@ -246,6 +246,7 @@ declare interface IWebSocketData {
}
declare interface IAppearance {
modeOS: boolean,
hideStatusBar: boolean,
nativeEmoji: boolean,
customCSS: boolean,

68
app/src/util/onGetConfig.ts
View file

@ -143,7 +143,7 @@ export const onGetConfig = (isStart: boolean) => {
initBar();
initStatus();
initWindow();
appearance.onSetappearance(window.siyuan.config.appearance);
appearance.onSetappearance(window.siyuan.config.appearance, false);
initAssets();
setInlineStyle();
let resizeTimeout = 0;
@ -171,11 +171,6 @@ const initBar = () => {
<use xlink:href="#iconSearch"></use>
</svg>
</div>
<div id="barThemeMode" class="toolbar__item b3-tooltips b3-tooltips__se${window.siyuan.config.appearance.mode === 1 ? " toolbar__item--active" : ""}" aria-label="${window.siyuan.config.appearance.mode === 1 ? window.siyuan.languages.themeLight : window.siyuan.languages.themeDark}">
<svg>
<use xlink:href="#iconMoon"></use>
</svg>
</div>
<div id="barHistory" class="toolbar__item b3-tooltips b3-tooltips__se" aria-label="${window.siyuan.languages.dataHistory} ${updateHotkeyTip(window.siyuan.config.keymap.general.history.custom)}">
<svg>
<use xlink:href="#iconVideo"></use>
@ -233,34 +228,6 @@ const initBar = () => {
openSearch(window.siyuan.config.keymap.general.globalSearch.custom);
event.stopPropagation();
break;
} else if (target.id === "barThemeMode") {
if (target.getAttribute("disabled")) {
return;
}
if (target.classList.contains("toolbar__item--active")) {
target.classList.remove("toolbar__item--active");
target.setAttribute("aria-label", window.siyuan.languages.themeDark);
} else {
target.classList.add("toolbar__item--active");
target.setAttribute("aria-label", window.siyuan.languages.themeLight);
}
target.setAttribute("disabled", "disabled");
fetchPost("/api/system/setAppearanceMode", {
mode: target.classList.contains("toolbar__item--active") ? 1 : 0
}, response => {
if (window.siyuan.config.appearance.themeJS) {
exportLayout(true);
return;
}
window.siyuan.config.appearance = response.data.appearance;
target.removeAttribute("disabled");
/// #if !BROWSER
ipcRenderer.send(Constants.SIYUAN_CONFIG_THEME, response.data.mode === 1 ? "dark" : "light");
/// #endif
loadAssets(response.data.appearance);
});
event.stopPropagation();
break;
} else if (target.id === "barDailyNote") {
if (getOpenNotebookCount() < 2) {
newDailyNote();
@ -343,6 +310,39 @@ const initWindow = () => {
zoomIn: getSearch("focus", url) === "1"
});
});
ipcRenderer.on(Constants.SIYUAN_UPDATE_THEME, (event, data) => {
if (data.init) {
if ((window.siyuan.config.appearance.mode === 0 && data.theme === "light") ||
(window.siyuan.config.appearance.mode === 1 && data.theme === "dark")) {
loadAssets(window.siyuan.config.appearance);
} else {
fetchPost("/api/system/setAppearanceMode", {
mode: data.theme === "light" ? 0 : 1
}, response => {
window.siyuan.config.appearance = response.data.appearance;
loadAssets(response.data.appearance);
});
}
return;
}
if (!window.siyuan.config.appearance.modeOS) {
return;
}
if ((window.siyuan.config.appearance.mode === 0 && data.theme === "light") ||
(window.siyuan.config.appearance.mode === 1 && data.theme === "dark")) {
return;
}
fetchPost("/api/system/setAppearanceMode", {
mode: data.theme === "light" ? 0 : 1
}, response => {
if (window.siyuan.config.appearance.themeJS) {
exportLayout(true);
return;
}
window.siyuan.config.appearance = response.data.appearance;
loadAssets(response.data.appearance);
});
});
ipcRenderer.on(Constants.SIYUAN_SAVE_CLOSE, (event, close) => {
winOnClose(currentWindow, close);
});