aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/app/css/theming.css12
-rw-r--r--src/app/index.html8
-rw-r--r--src/app/js/browser.js6
-rw-r--r--src/app/js/mods.js4
-rw-r--r--src/app/main.css13
5 files changed, 27 insertions, 16 deletions
diff --git a/src/app/css/theming.css b/src/app/css/theming.css
index 6d7e223..d92c42e 100644
--- a/src/app/css/theming.css
+++ b/src/app/css/theming.css
@@ -61,11 +61,11 @@ a:hover {
background: rgb(var(--red)) !important;
}
-.blue {background: rgb(var(--blue)) !important}
-.blue2 {background: rgb(var(--blue2)) !important}
+.bg-blue {background: rgb(var(--blue)) !important}
+.bg-blue2 {background: rgb(var(--blue2)) !important}
-.orange {background: rgb(var(--orange)) !important}
-.orange2 {background: rgb(var(--orange2)) !important}
+.bg-orange {background: rgb(var(--orange)) !important}
+.bg-orange2 {background: rgb(var(--orange2)) !important}
-.red {background: rgb(var(--red)) !important}
-.red2 {background: rgb(var(--red2)) !important}
+.bg-red {background: rgb(var(--red)) !important}
+.bg-red2 {background: rgb(var(--red2)) !important}
diff --git a/src/app/index.html b/src/app/index.html
index 0e96486..30bee9e 100644
--- a/src/app/index.html
+++ b/src/app/index.html
@@ -230,10 +230,10 @@
<div class="line">
<div class="text" id="modcount">%%gui.mods%%</div>
<div class="buttons modbtns">
- <button id="removeall" class="red2" onclick="mods.remove('allmods')">%%gui.mods.removeall%%</button>
- <button id="toggleall" class="orange2" onclick="mods.toggle('allmods')">%%gui.mods.toggleall%%</button>
- <button id="installmod" class="blue" onclick="installmod()">%%gui.mods.install%%</button>
- <button id="findmod" class="blue2" onclick="Browser.toggle(true)">%%gui.mods.find%%</button>
+ <button id="removeall" class="bg-red2" onclick="mods.remove('allmods')">%%gui.mods.removeall%%</button>
+ <button id="toggleall" class="bg-orange2" onclick="mods.toggle('allmods')">%%gui.mods.toggleall%%</button>
+ <button id="installmod" class="bg-blue" onclick="installmod()">%%gui.mods.install%%</button>
+ <button id="findmod" class="bg-blue2" onclick="Browser.toggle(true)">%%gui.mods.find%%</button>
</div>
</div>
diff --git a/src/app/js/browser.js b/src/app/js/browser.js
index 05bf01d..c859024 100644
--- a/src/app/js/browser.js
+++ b/src/app/js/browser.js
@@ -263,6 +263,10 @@ var Browser = {
}
}
+if (navigator.onLine) {
+ Browser.loadfront();
+}
+
function openExternal(url) {
require("electron").shell.openExternal(url);
}
@@ -362,7 +366,7 @@ function BrowserEl(properties) {
<div class="text">
<div class="title">${properties.title}</div>
<div class="description">${properties.description}</div>
- <button class="install blue" onclick=''>${installstr}</button>
+ <button class="install bg-blue" onclick=''>${installstr}</button>
<button class="info" onclick="Preview.set('${properties.url}')">${lang('gui.browser.view')}</button>
<button class="visual">${properties.version}</button>
<button class="visual">${lang("gui.browser.madeby")} ${properties.author}</button>
diff --git a/src/app/js/mods.js b/src/app/js/mods.js
index 6c2fc22..a2e4492 100644
--- a/src/app/js/mods.js
+++ b/src/app/js/mods.js
@@ -34,8 +34,8 @@ mods.load = (mods_obj) => {
<div class="text">
<div class="title">${mod.Name}</div>
<div class="description">${mod.Description}</div>
- <button class="switch on"></button>
- <button class="red" onclick="mods.remove('${mod.Name}')">Remove</button>
+ <button class="switch on orange"></button>
+ <button class="bg-red" onclick="mods.remove('${mod.Name}')">Remove</button>
<button class="visual">${mod.Version}</button>
<button class="visual">by ${mod.Author || "Unknown"}</button>
</div>
diff --git a/src/app/main.css b/src/app/main.css
index 671be13..5779fa8 100644
--- a/src/app/main.css
+++ b/src/app/main.css
@@ -120,7 +120,8 @@ a, button, #close, #nsRelease, #vpReleaseNotes,
}
.switch.on {
- background: rgba(var(--red), 0.2) !important;
+ --on-color: var(--red);
+ background: rgba(var(--on-color), 0.4) !important;
}
.switch::after {
@@ -139,10 +140,16 @@ a, button, #close, #nsRelease, #vpReleaseNotes,
.switch.on::after {
left: 15px;
width: 20px;
- opacity: 0.5;
- background: rgb(var(--red));
+ opacity: 0.8;
+ background: rgb(var(--on-color));
}
+.switch.on.red2 {--on-color: var(--red2)}
+.switch.on.blue {--on-color: var(--blue)}
+.switch.on.blue2 {--on-color: var(--blue2)}
+.switch.on.orange {--on-color: var(--orange)}
+.switch.on.orange2 {--on-color: var(--orange2)}
+
.switch.on:hover::after {
transform: scale(1.2);
}