Overriding builtin themes with user defined css. Users should take advantage of the url query parmeters to choose which theme to override at load. Closes #36.

This commit is contained in:
Jeremy Zhang 2017-08-08 03:14:17 +00:00
parent 1b8da1a5c1
commit 335d9f569e
3 changed files with 28 additions and 8 deletions

View File

@ -301,6 +301,10 @@ body > div.navbar-fixed > nav > div {
font-size: 85%; font-size: 85%;
} }
.input-field label {
color: white;
}
a { a {
color: #82b1ff; color: #82b1ff;
} }

View File

@ -151,14 +151,20 @@
$("#loginmodal").modal("open"); $("#loginmodal").modal("open");
}); });
$( "#theme-selector" ).change(function() { $( "#theme-selector" ).change(function () {
var theme = $("#theme-selector option:selected").val(); var theme = $("#theme-selector option:selected").val();
changeTheme(theme); var keep_custom_css = $("#overwrite_theme_custom_css_checkbox").is(':checked');
changeTheme(theme, keep_custom_css);
});
$("#overwrite_theme_custom_css_checkbox").change(function () {
var keep_custom_css = $("#overwrite_theme_custom_css_checkbox").is(':checked');
changeTheme(null, keep_custom_css);
}); });
var themeparam = getParameterByName('theme'); var themeparam = getParameterByName('theme');
var localstore_theme = localStorage.getItem("theme"); var localstore_theme = localStorage.getItem("theme");
if ((getParameterByName("css") == null) && ((themeparam && $.inArray(themeparam, theme_options) != -1) || (localstore_theme))) { if ((themeparam && $.inArray(themeparam, theme_options) != -1) || (localstore_theme)) {
var theme; var theme;
if (themeparam) { if (themeparam) {
theme = themeparam; theme = themeparam;
@ -199,15 +205,21 @@
} }
}); });
function changeTheme(theme) { function changeTheme(theme=null, keep_custom_css=true) {
if (theme == "") { if (theme == "") {
$("#css-theme").attr("href", ""); $("#css-theme").attr("href", "");
$("#user-defined-css").text(user_def_css); $("#user-defined-css").text(user_def_css);
localStorage.removeItem("theme"); localStorage.removeItem("theme");
} else if ($.inArray(theme, theme_options) != -1) { } else if ($.inArray(theme, theme_options) != -1 || theme == null) {
$("#user-defined-css").text(""); if (!keep_custom_css) {
$("#css-theme").attr("href", "/static/themes/" + theme + "/css/style.css"); $("#user-defined-css").text("");
localStorage.setItem("theme", theme); } else {
$("#user-defined-css").text(user_def_css);
}
if (theme) {
$("#css-theme").attr("href", "/static/themes/" + theme + "/css/style.css");
localStorage.setItem("theme", theme);
}
} }
} }

View File

@ -134,6 +134,10 @@
<option value="DiscordDark">DiscordDark</option> <option value="DiscordDark">DiscordDark</option>
<option value="BetterTitan">BetterTitan</option> <option value="BetterTitan">BetterTitan</option>
</select> </select>
<p>
<input type="checkbox" class="filled-in" id="overwrite_theme_custom_css_checkbox" checked="checked" />
<label for="overwrite_theme_custom_css_checkbox">Overwrite Current Embed Theme w/ User CSS</label>
</p>
</div> </div>
</div> </div>
</div> </div>