From f3e5e1596a22c3df38a8c00a5ceadf8a5dd2967a Mon Sep 17 00:00:00 2001 From: 0neGal Date: Sat, 16 Sep 2023 18:17:04 +0200 Subject: added buttons for fixing some problems and alike I will likely add more buttons in the future, but for now this is most of the ones a user could need to repair problems. --- src/app/css/popups.css | 26 +++++++++++++++++++++----- src/app/css/theming.css | 8 ++++++++ src/app/css/toasts.css | 7 ++++++- src/app/index.html | 34 +++++++++++++++++++++++++++++++--- src/app/js/settings.js | 1 - src/app/js/toast.js | 12 ++++++++++-- src/app/main.js | 32 +++++++++++++++++++++++++++++++- 7 files changed, 107 insertions(+), 13 deletions(-) (limited to 'src/app') diff --git a/src/app/css/popups.css b/src/app/css/popups.css index 7ece7e3..9d307d1 100644 --- a/src/app/css/popups.css +++ b/src/app/css/popups.css @@ -89,7 +89,8 @@ margin: calc(var(--padding) / 2); } -.popup .options .option { +.popup .options .option, +.popup .options .buttons { width: 100%; display: flex; margin-bottom: var(--padding); @@ -146,8 +147,13 @@ background-image: url(../icons/check.png); } -.option .text {font-weight: 600} -.option .text .desc { +.option .text, +.buttons .text { + font-weight: 600; +} + +.option .text .desc, +.buttons .text .desc { opacity: 0.8; font-weight: 500; font-size: 0.9em; @@ -155,7 +161,8 @@ margin-top: calc(var(--padding) / 3); } -.option .actions input, .option .actions select { +.option .actions input, +.option .actions select { width: 100%; margin: 0px; --spacing: calc(var(--padding) / 3); @@ -166,7 +173,16 @@ margin-right: 15vw; } -.option .actions button { +.buttons .actions { + text-align: right; +} + +.buttons .actions button { + margin-bottom: calc(var(--padding) / 5); +} + +.option .actions button, +.buttons .actions button { background: var(--selbg); } diff --git a/src/app/css/theming.css b/src/app/css/theming.css index d92c42e..d16f455 100644 --- a/src/app/css/theming.css +++ b/src/app/css/theming.css @@ -37,10 +37,18 @@ a { transition: filter 0.2s ease-in !important; } +a.disabled { + opacity: 0.5; + pointer-events: none; +} + a:hover { filter: brightness(80%) !important; } +input:disabled { + opacity: 0.5; +} ::-webkit-scrollbar { width: 8px !important; diff --git a/src/app/css/toasts.css b/src/app/css/toasts.css index 57ba055..65e325f 100644 --- a/src/app/css/toasts.css +++ b/src/app/css/toasts.css @@ -18,9 +18,10 @@ cursor: pointer; overflow: hidden; max-height: 100vh; - background: #FFFFFF; transform: scale(0.95); + background: var(--selbg); transition: 0.2s ease-in-out; + backdrop-filter: blur(15px); padding: calc(var(--padding) / 2); margin-top: calc(var(--padding) / 2); border-radius: calc(var(--padding) / 2.5); @@ -33,6 +34,10 @@ animation-timing-function: ease-in-out; } +#toasts .toast .title:only-child { + margin-bottom: 0px; +} + #toasts .toast.hidden { margin-top: 0px; max-height: 0px; diff --git a/src/app/index.html b/src/app/index.html index 4a8dca9..9ca5e07 100644 --- a/src/app/index.html +++ b/src/app/index.html @@ -121,7 +121,20 @@
- + +
+ +
+
+ %%gui.settings.updatebuttons.title%% +
+ %%gui.settings.updatebuttons.desc%% +
+
+
+ + +
@@ -139,6 +152,21 @@
+
+
+ %%gui.settings.miscbuttons.title%% +
+ %%gui.settings.miscbuttons.desc%% +
+
+
+ + + + + +
+
@@ -195,7 +223,7 @@
| - %%gui.setpath%% + %%gui.setpath%%
@@ -228,7 +256,7 @@
- (%%gui.update.check%%) + (%%gui.update.check%%)
diff --git a/src/app/js/settings.js b/src/app/js/settings.js index db29300..8aeb2ca 100644 --- a/src/app/js/settings.js +++ b/src/app/js/settings.js @@ -1,4 +1,3 @@ - var Settings = { toggle: (state) => { let settings_btn = document.getElementById("settings"); diff --git a/src/app/js/toast.js b/src/app/js/toast.js index 3bc1745..e0aba6b 100644 --- a/src/app/js/toast.js +++ b/src/app/js/toast.js @@ -1,8 +1,8 @@ function Toast(properties) { let toast = { - fg: "#000000", - bg: "#FFFFFF", timeout: 3000, + fg: "#FFFFFF", + bg: "var(--selbg)", callback: () => {}, title: "Untitled Toast", description: "No description provided for toast", @@ -45,6 +45,14 @@ function Toast(properties) {
${toast.description}
` + if (! toast.title) { + el.querySelector(".title").remove(); + } + + if (! toast.description) { + el.querySelector(".description").remove(); + } + toasts.appendChild(el); setTimeout(() => { diff --git a/src/app/main.js b/src/app/main.js index bbf1e57..d94d508 100644 --- a/src/app/main.js +++ b/src/app/main.js @@ -122,6 +122,17 @@ if (! navigator.onLine) { function exit() {ipcRenderer.send("exit")} function updateNorthstar() {ipcRenderer.send("update-northstar")} +function force_update_ns() { + ipcRenderer.send("update-northstar", true); +} + +function reset_config() { + ipcRenderer.send("reset-config"); +} + +function relaunch() { + ipcRenderer.send("relaunch"); +} // Reports to the main process about game path status. // @param {boolean} value is game path loaded @@ -151,11 +162,18 @@ function setButtons(state) { let disablearray = (array) => { for (let i = 0; i < array.length; i++) { - array[i].disabled = !state; + array[i].disabled = ! state; + + if (state) { + array[i].classList.remove("disabled") + } else { + array[i].classList.add("disabled") + } } } disablearray(document.querySelectorAll("#modsdiv .el button")); + disablearray(document.querySelectorAll(".disable-when-installing")); disablearray(document.querySelectorAll(".playBtnContainer .playBtn")); disablearray(document.querySelectorAll("#nsMods .buttons.modbtns button")); disablearray(document.querySelectorAll("#browser #browserEntries .text button")); @@ -333,6 +351,18 @@ function kill_game() { ipcRenderer.send("kill-game"); } +function kill_origin() { + ipcRenderer.send("kill-origin"); +} + +function delete_request_cache() { + ipcRenderer.send("delete-request-cache"); +} + +function delete_install_cache() { + ipcRenderer.send("delete-install-cache"); +} + // Updates the installed mods ipcRenderer.on("mods", (event, mods_obj) => { modsobj = mods_obj; -- cgit v1.2.3