Add support for older browser with bad support for CSS Variables and ES6

This commit is contained in:
Jeremy Zhang 2017-12-14 05:22:06 +00:00
parent 7f415bd65a
commit 89b3f4a450
3 changed files with 64 additions and 12 deletions

View File

@ -27,6 +27,7 @@
} }
html { html {
background-color: #455A64;
background-color: var(--main); background-color: var(--main);
color: white; color: white;
font-family: Whitney, Helvetica Neue, Helvetica, Arial, sans-serif; font-family: Whitney, Helvetica Neue, Helvetica, Arial, sans-serif;
@ -43,11 +44,14 @@ footer {
left: 0; left: 0;
right: 0; right: 0;
height: 50px; height: 50px;
background-color: #37474F;
background-color: var(--chatbox); background-color: var(--chatbox);
} }
nav { nav {
background-color: #263238;
background-color: var(--header); background-color: var(--header);
background: linear-gradient(#263238, rgba(38,50,56,0));
background: linear-gradient(var(--header), rgba(38,50,56,0)); background: linear-gradient(var(--header), rgba(38,50,56,0));
box-shadow: none; box-shadow: none;
} }
@ -92,10 +96,12 @@ nav .brand-logo {
} }
#members-nav { #members-nav {
background-color: #607D8B;
background-color: var(--rightsidebar); background-color: var(--rightsidebar);
} }
#members-nav li>a { #members-nav li>a {
color: #ECEFF1;
color: var(--noroleusers); color: var(--noroleusers);
} }
@ -113,10 +119,12 @@ nav .brand-logo {
} }
#guild-nav { #guild-nav {
background-color: #607D8B;
background-color: var(--leftsidebar); background-color: var(--leftsidebar);
} }
.side-nav div.divider { .side-nav div.divider {
background-color: #90A4AE;
background-color: var(--sidebardivider); background-color: var(--sidebardivider);
margin-left: 10px; margin-left: 10px;
margin-right: 10px; margin-right: 10px;
@ -214,22 +222,27 @@ nav .brand-logo {
/*}*/ /*}*/
::-webkit-input-placeholder { ::-webkit-input-placeholder {
color: #636363;
color: var(--placeholder); color: var(--placeholder);
} }
:-moz-placeholder { :-moz-placeholder {
color: #636363;
color: var(--placeholder); color: var(--placeholder);
} }
::-moz-placeholder { ::-moz-placeholder {
color: #636363;
color: var(--placeholder); color: var(--placeholder);
} }
:-ms-input-placeholder { :-ms-input-placeholder {
color: #636363;
color: var(--placeholder); color: var(--placeholder);
} }
::-ms-input-placeholder { ::-ms-input-placeholder {
color: #636363;
color: var(--placeholder); color: var(--placeholder);
} }
@ -345,6 +358,7 @@ textarea.materialize-textarea:focus:not([readonly]) {
#curuser_discrim { #curuser_discrim {
font-size: 50%; font-size: 50%;
color: #FFFFFF;
color: var(--discrim); color: var(--discrim);
} }
@ -367,6 +381,7 @@ textarea.materialize-textarea:focus:not([readonly]) {
} }
.modal { .modal {
background-color: #546E7A;
background-color: var(--modal); background-color: var(--modal);
} }
@ -498,6 +513,7 @@ a {
/*}*/ /*}*/
.chatmessage { .chatmessage {
display: block; display: block;
color: #C3C4C5;
color: var(--chatmessage); color: var(--chatmessage);
margin-top: 5px; margin-top: 5px;
} }

View File

@ -103,7 +103,10 @@
return funct.promise(); return funct.promise();
} }
function fetch(channel_id, after=null) { function fetch(channel_id, after) {
if (after === undefined) {
after = null;
}
var url = "/api/fetch"; var url = "/api/fetch";
if (visitor_mode) { if (visitor_mode) {
url += "_visitor"; url += "_visitor";
@ -303,7 +306,16 @@
} }
} }
function changeTheme(theme=null, keep_custom_css=true, modifyLocalStore=true) { function changeTheme(theme, keep_custom_css, modifyLocalStore) {
if (theme === undefined) {
theme = null;
}
if (keep_custom_css === undefined) {
keep_custom_css = true;
}
if (modifyLocalStore === undefined) {
modifyLocalStore = 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);
@ -965,7 +977,10 @@
} }
} }
function generate_avatar_url(user_id, avatar_hash, message_contents=null) { function generate_avatar_url(user_id, avatar_hash, message_contents) {
if (message_contents === undefined) {
message_contents = null;
}
if (user_id == bot_client_id && (message_contents.includes("**") && ( (message_contents.includes("<")&&message_contents.includes(">")) || (message_contents.includes("[") && message_contents.includes("]")) ))) { if (user_id == bot_client_id && (message_contents.includes("**") && ( (message_contents.includes("<")&&message_contents.includes(">")) || (message_contents.includes("[") && message_contents.includes("]")) ))) {
return global_guest_icon; return global_guest_icon;
} else { } else {
@ -1001,7 +1016,10 @@
return emb; return emb;
} }
function fill_discord_messages(messages, jumpscroll, replace=null) { function fill_discord_messages(messages, jumpscroll, replace) {
if (replace === undefined) {
replace = null;
}
if (messages.length == 0) { if (messages.length == 0) {
return last_message_id; return last_message_id;
} }
@ -1194,7 +1212,10 @@
} }
} }
function update_embed_userchip(authenticated, avatar, username, nickname, userid, discrim=null) { function update_embed_userchip(authenticated, avatar, username, nickname, userid, discrim) {
if (discrim === undefined) {
discrim = null;
}
if (authenticated) { if (authenticated) {
$("#currentuserimage").show(); $("#currentuserimage").show();
$("#currentuserimage").attr("src", avatar); $("#currentuserimage").attr("src", avatar);
@ -1215,7 +1236,13 @@
} }
} }
function update_change_username_modal(authenticated=false, username=null) { function update_change_username_modal(authenticated, username) {
if (authenticated === undefined) {
authenticated = null;
}
if (username === undefined) {
username = null;
}
if (!$("#change_username_field") || $("#change_username_field").is(":focus")) { if (!$("#change_username_field") || $("#change_username_field").is(":focus")) {
return; return;
} }

View File

@ -43,6 +43,7 @@ font-family: Whitney, Helvetica Neue, Helvetica, Arial, sans-serif;
--dark-highlight-channelheader: #36393e; --dark-highlight-channelheader: #36393e;
} }
#footer { #footer {
background-color: #3C3C3C;
background-color: var(--chatbox); background-color: var(--chatbox);
} }
#footercontainer { #footercontainer {
@ -50,6 +51,7 @@ border-radius:20px;
border: 1px solid rgb(99,99,99); border: 1px solid rgb(99,99,99);
margin-left:-0px!important; margin-left:-0px!important;
padding-left:-4px!important; padding-left:-4px!important;
background-color: #3C3C3C;
background-color: var(--chatbox); background-color: var(--chatbox);
} }
#nameplate { #nameplate {
@ -63,6 +65,7 @@ display:block
} }
#curuser_discrim { #curuser_discrim {
font-size:50%; font-size:50%;
color: #7D8386;
color:var(--discrim); color:var(--discrim);
} }
#curuser_discrim, #curuser_discrim,
@ -77,20 +80,23 @@ margin-right:4px
#chatcontent > p > span { display: table-row } #chatcontent > p > span { display: table-row }
/*#chatcontent > p > span:nth-child(1):before { content:"Today at " }*/ /*#chatcontent > p > span:nth-child(1):before { content:"Today at " }*/
/*#chatcontent > p > span.chatusername { display: table-header-group }*/ /*#chatcontent > p > span.chatusername { display: table-header-group }*/
#chatcontent > p > span.chatmessage { display: table-footer-group;display:inline-block!important;color:var(--chatmessage) } #chatcontent > p > span.chatmessage { display: table-footer-group;display:inline-block!important;color:#C3C4C5;color:var(--chatmessage); }
#chatcontent { #chatcontent {
background: #36393E;
background:var(--main) background:var(--main)
} }
::-webkit-input-placeholder { color:var(--placeholder) } ::-webkit-input-placeholder { color: #636363; color:var(--placeholder); }
:-moz-placeholder { color:var(--placeholder) } :-moz-placeholder { color: #636363; color:var(--placeholder); }
::-moz-placeholder { color:var(--placeholder) } ::-moz-placeholder { color: #636363; color:var(--placeholder); }
:-ms-input-placeholder { color:var(--placeholder) } :-ms-input-placeholder { color: #636363; color:var(--placeholder); }
::-ms-input-placeholder { color:var(--placeholder) } ::-ms-input-placeholder { color: #636363; color:var(--placeholder); }
body > div.navbar-fixed > nav > div, body > div.navbar-fixed > nav > div,
#members-nav { #members-nav {
background: #1E2124;
background:var(--rightsidebar) background:var(--rightsidebar)
} }
#guild-nav { #guild-nav {
background: #2E3136;
background: var(--leftsidebar) background: var(--leftsidebar)
} }
div.divider { div.divider {
@ -111,6 +117,7 @@ color:rgb(130,131,134)
} }
body > main, body > main,
body { body {
background: #36393E;
background:var(--main) background:var(--main)
} }
#members-btn > i { visibility:hidden } #members-btn > i { visibility:hidden }
@ -130,9 +137,11 @@ background: linear-gradient(to right, #f9f9f9 90%, #fff);
#discord-members > li > a, #discord-members > li > a,
#embed-discord-members > li > a, #embed-discord-members > li > a,
#embed-unauth-users > li > a { #embed-unauth-users > li > a {
color: #ABADAF;
color:var(--noroleusers); color:var(--noroleusers);
} }
.modal { .modal {
background: #36393E;
background: var(--modal); background: var(--modal);
} }