Channel Bans:
-
- Ban
-
+
+ Ban
+
Img ID Name Ban Ban Date Expires
+ ID Name Ban Ban Date Expires
diff --git a/src/views/partial/channelSettings/userList.ejs b/src/views/partial/channelSettings/userList.ejs
index 5712a9c..a5a2930 100644
--- a/src/views/partial/channelSettings/userList.ejs
+++ b/src/views/partial/channelSettings/userList.ejs
@@ -16,20 +16,20 @@ along with this program. If not, see
.-->
<% } %>
diff --git a/www/css/adminPanel.css b/www/css/adminPanel.css
index 4c10844..2355116 100644
--- a/www/css/adminPanel.css
+++ b/www/css/adminPanel.css
@@ -28,14 +28,6 @@ along with this program. If not, see
.*/
padding: 1em 15%;
}
-.admin-list-table{
- border-spacing: 0px;
-}
-
-td.admin-list-entry{
- padding: 0.3em 1em;
-}
-
.admin-list-entry{
text-align: center;
}
@@ -95,17 +87,6 @@ img.admin-list-entry-item{
text-align: center;
}
-.admin-list-new-span{
- display: flex;
- padding: 0 1em;
- height: 1.5em;
- margin-bottom: 1em;
-}
-
-.admin-list-new-input{
- flex-grow: 1;
-}
-
#new-rank-select{
margin: auto;
height: 1.3em;
@@ -121,7 +102,7 @@ img.admin-list-entry-item{
height: 1.5em;
}
-#channel-delete{
+#chan-delete{
margin: auto auto 2em;
}
diff --git a/www/css/channel.css b/www/css/channel.css
index a5de122..29877f9 100644
--- a/www/css/channel.css
+++ b/www/css/channel.css
@@ -123,29 +123,6 @@ div#chat-panel-main-div{
flex-direction: column;
}
-div#chat-panel-control-div{
- height: 2em;
- display: flex;
- flex-direction: row;
- margin: 0.5em;
-}
-
-i.chat-panel-control{
- height: 1em;
- margin: auto;
- margin-left: 0.5em;
- cursor: pointer;
-}
-
-#chat-panel-settings-icon{
- margin-left: 1em;
-}
-
-#chat-panel-prompt{
- margin-left: 0.5em;
- width: 100%;
-}
-
p#chat-panel-high-level-paragraph{
margin: auto;
margin-left: 0;
@@ -161,10 +138,6 @@ p.panel-head-element{
appearance: none;
}
-input#chat-panel-prompt{
- flex: 1;
-}
-
#chat-panel-send-button{
margin: auto;
margin-right: 1em;
@@ -235,6 +208,10 @@ span.user-entry{
display: none;
}
+#chat-panel-settings-icon{
+ margin-left: 1em;
+}
+
#cpanel-active-div{
position: absolute;
z-index: 4;
@@ -257,4 +234,10 @@ span.user-entry{
display: flex;
flex-direction: row;
flex: 1;
+}
+
+#chat-panel-control-div{
+ height: 2em;
+ padding: 0;
+ margin: 0.5em;
}
\ No newline at end of file
diff --git a/www/css/global.css b/www/css/global.css
index fccf6eb..1fa9b14 100644
--- a/www/css/global.css
+++ b/www/css/global.css
@@ -14,6 +14,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see
.*/
+/* Global Styles */
html{
height: 100%;
}
@@ -25,7 +26,35 @@ body{
flex-direction: column;
}
+table{
+ border-spacing: 0px;
+}
+td{
+ padding: 0.3em 1em;
+}
+
+div.control-prompt{
+ display: flex;
+ flex-direction: row;
+ margin: 0.5em 0;
+ padding: 0.2em 0.5em;
+}
+
+i.control-prompt{
+ height: 1em;
+ margin: auto;
+ margin-left: 0.5em;
+ cursor: pointer;
+}
+
+input.control-prompt{
+ margin-left: 0.5em;
+ width: 100%;
+ flex: 1;
+}
+
+/* Navbar */
#navbar{
display: flex;
padding: 0.5em;
@@ -50,6 +79,8 @@ p.navbar-item, input.navbar-item{
padding: 0.2em;
}
+/* Popup Container */
+
.popup-backer{
position: fixed;
top: 0;
diff --git a/www/css/profile.css b/www/css/profile.css
index 7ffda07..4490f0f 100644
--- a/www/css/profile.css
+++ b/www/css/profile.css
@@ -38,6 +38,6 @@ input.account-settings-password-reset{
display: block;
}
-a#account-settings-delete-link{
+a#account-settings-delete-button{
font-weight: bold;
}
\ No newline at end of file
diff --git a/www/css/theme/movie-night.css b/www/css/theme/movie-night.css
index 55e967a..b31370c 100644
--- a/www/css/theme/movie-night.css
+++ b/www/css/theme/movie-night.css
@@ -14,7 +14,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see
.*/
-/* global */
+/* Theme Variables */
:root{
--main-font: "open-sans", system-ui;
--bg0: rgb(158, 158, 158);
@@ -28,13 +28,21 @@ along with this program. If not, see
.*/
--accent0: rgb(48, 47, 47);
--accent0-alt0: rgb(34, 34, 34);
- --accent0-warning: firebrick;
- --accent0-warning-alt0: rgb(121, 11, 11);
--accent1: rgb(245, 245, 245);
--accent1-alt0: rgb(185, 185, 185);
--accent2: var(--accent0-alt0);
--focus0: rgb(51, 153, 51);
+ --focus0-alt0: rgb(229, 255, 229);
+ --focus0-alt1: rgb(12, 85, 12);
+ --focus-glow0: 2px 2px 3px var(--focus0), -2px 2px 3px var(--focus0), 2px -2px 3px var(--focus0), -2px -2px 3px var(--focus0);
+ --focus-glow0-alt0: 2px 2px 3px var(--focus0-alt0), -2px 2px 3px var(--focus0-alt0), 2px -2px 3px var(--focus0-alt0), -2px -2px 3px var(--focus0-alt0);
+
+ --danger0: firebrick;
+ --danger0-alt0: rgb(121, 11, 11);
+ --danger0-alt1: rgb(255, 105, 105);
+ --danger-glow0: 2px 2px 3px var(--danger0), -2px 2px 3px var(--danger0), 2px -2px 3px var(--danger0), -2px -2px 3px var(--danger0);
+ --danger-glow0-alt1: 2px 2px 3px var(--danger0-alt1), -2px 2px 3px var(--danger0-alt1), 2px -2px 3px var(--danger0-alt1), -2px -2px 3px var(--danger0-alt1);
--userlist-color0:rgb(63, 121, 71);
--userlist-color1:rgb(143, 46, 26);
@@ -50,6 +58,7 @@ along with this program. If not, see
.*/
--background-panel-effect-fast: none;
}
+/* global */
body{
background-color: var(--bg0);
font-family: var(--main-font);
@@ -61,28 +70,98 @@ a{
color: var(--accent0);
}
+a:hover{
+ color: var(--focus0-alt0);
+ text-shadow: var(--focus-glow0);
+}
+
select{
background-color: var(--bg2);
border-radius: 0.5em;
border: none;
}
-button{
- border-radius: 0.5em;
-}
-
-a:hover{
- color: var(--accent0-alt0);
-}
-
button{
background-color: var(--bg0);
color: var(--accent0);
border: none;
+ border-radius: 0.5em;
+}
+
+button:hover{
+ color: var(--focus0-alt1);
+ background-color: var(--focus0-alt0);
+ box-shadow: var(--focus-glow0);
+}
+
+button:active{
+ color: var(--focus0-alt0);
+ background-color: var(--focus0-alt1);
+ box-shadow: var(--focus-glow0-alt0);
+}
+
+.danger-button{
+ background-color: var(--danger0);
+ color: var(--accent1);
+}
+
+.danger-button:hover{
+ background-color: var(--danger0-alt1);
+ color: var(--danger0-alt0);
+ box-shadow: var(--danger-glow0);
+}
+
+.danger-button:active{
+ background-color: var(--danger0-alt0);
+ color: var(--accent0-alt0);
+ box-shadow: var(--danger-glow0-alt1);
+}
+
+.positive-button{
+ background-color: var(--focus0);
+ color: white;
+}
+
+.positive-button:hover{
+ color: var(--focus0-alt1);
+ background-color: var(--focus0-alt0);
+}
+
+.positive-button:active{
+ color: var(--focus0-alt0);
+ background-color: var(--focus0-alt1);
+}
+
+tr{
+ box-shadow: var(--accent1) 0px 1em 1px -2em, var(--accent1) 0px -1em 1px -1em;
+}
+
+td.not-first-col{
+ box-shadow: var(--accent1) 1em 0px 1px -2em, var(--accent1) -1em 0px 1px -1em;
+}
+
+.admin-list-field,.admin-list-table{
+ background-color: var(--bg1);
+ color: var(--accent1);
+ box-shadow: 3px 3px 1px var(--bg1-alt0) inset;
+ border-radius: 1em;
+}
+
+div.control-prompt{
+ border-radius: 1em;
+ background-color: white;
+}
+
+div.control-prompt:focus-within{
+ box-shadow: var(--focus-glow0);
+}
+
+input.control-prompt, input.control-prompt:focus{
+ border: none;
+ outline: none;
}
/* navbar */
-
#navbar{
background-color: var(--bg1);
}
@@ -92,10 +171,6 @@ button{
border: hidden;
}
-a:hover.navbar-item{
- color: var(--accent1-alt0);
-}
-
.navbar-item input{
background-color: var(--bg1-alt0);
}
@@ -116,10 +191,6 @@ a.channel-guide-entry-item{
color: var(--accent1);
}
-a:hover.channel-guide-entry-item{
- color: var(--accent1-alt0);
-}
-
span.channel-guide-entry-item{
background-color: var(--bg1-alt0);
box-shadow: 0.2em 0.2em 0.1em black inset;
@@ -132,42 +203,7 @@ p.channel-guide-entry-item{
background-color: var(--bg1-alt0);
}
-/* account settings */
-a#account-settings-delete-link{
- color: var(--accent0-warning);
-}
-
/* channel settings/admin panel mixed */
-
-#channel-delete, #ban-popup-ban-button, #new-ban-button{
- background-color: var(--accent0-warning);
- color: var(--accent1);
-}
-
-#channel-delete:hover, #ban-popup-ban-button:hover, #new-ban-button:hover{
- background-color: var(--accent0-warning-alt0);
-}
-
-#channel-delete:active, #ban-popup-ban-button:active, #new-ban-button:active{
- background-color: var(--accent0-warning-alt0);
- color: var(--accent1-alt0);
-}
-
-.admin-list-field,.admin-list-table{
- background-color: var(--bg1);
- color: var(--accent1);
- box-shadow: 3px 3px 1px var(--bg1-alt0) inset;
- border-radius: 1em;
-}
-
-tr.admin-list-entry{
- box-shadow: var(--accent1) 0px 1em 1px -2em, var(--accent1) 0px -1em 1px -1em;
-}
-
-td.admin-list-entry-not-first-col{
- box-shadow: var(--accent1) 1em 0px 1px -2em, var(--accent1) -1em 0px 1px -1em;
-}
-
a.admin-list-entry-item{
color: var(--accent1);
}
@@ -176,26 +212,7 @@ a:hover.admin-list-entry-item{
color: var(--accent1-alt0);
}
-.admin-list-new-span{
- background-color: white;
- border-radius: 1em;
-}
-
-.admin-list-new-span:focus-within{
- box-shadow: 2px 2px 3px var(--focus0), -2px 2px 3px var(--focus0), 2px -2px 3px var(--focus0), -2px -2px 3px var(--focus0);
-}
-
-.admin-list-new-input{
- border: none;
-}
-
-.admin-list-new-input:focus{
- border: none;
- outline: none;
-}
-
/* channel */
-
#media-panel-div{
background-color: black;
}
@@ -204,31 +221,10 @@ a:hover.admin-list-entry-item{
background-color: var(--bg2);
}
-#chat-panel-control-div{
- background-color: white;
-}
-
-#chat-panel-control-div:focus-within{
- box-shadow: 2px 2px 3px var(--focus0), -2px 2px 3px var(--focus0), 2px -2px 3px var(--focus0), -2px -2px 3px var(--focus0);
-}
-
#chat-area{
background-color: var(--bg2);
}
-div#chat-panel-control-div{
- border-radius: 1em;
-}
-
-#chat-panel-prompt{
- border: none;
-}
-
-#chat-panel-prompt:focus{
- border: none;
- outline: none;
-}
-
.chat-entry{
background-color: var(--bg2);
border-bottom: 1px solid var(--bg2-alt1);
@@ -280,11 +276,6 @@ div#chat-panel-control-div{
color: var(--accent1-alt0);
}
-#chat-panel-send-button{
- background-color: var(--focus0);
- color: white;
-}
-
select.panel-head-element{
height: 1.2em;
margin: auto;
@@ -319,5 +310,5 @@ select.panel-head-element{
}
#delete-account-popup-title, #delete-channel-popup-title{
- color: var(--accent0-warning);
+ color: var(--danger0);
}
\ No newline at end of file
diff --git a/www/js/channelSettings.js b/www/js/channelSettings.js
index 57989a9..0bdd035 100644
--- a/www/js/channelSettings.js
+++ b/www/js/channelSettings.js
@@ -333,7 +333,7 @@ class permList{
class deleteBtn{
constructor(channel){
this.channel = channel;
- this.delete = document.querySelector("#channel-delete");
+ this.delete = document.querySelector("#chan-delete");
this.setupInput();
}
diff --git a/www/js/profile.js b/www/js/profile.js
index 49d85e7..5b26adc 100644
--- a/www/js/profile.js
+++ b/www/js/profile.js
@@ -157,7 +157,7 @@ class passwordResetPrompt{
class deleteAccountButton{
constructor(){
- this.deleteLink = document.querySelector('#account-settings-delete-link');
+ this.deleteLink = document.querySelector('#account-settings-delete-button');
this.setupInput();
}
diff --git a/www/js/utils.js b/www/js/utils.js
index fc47f67..64f7d2d 100644
--- a/www/js/utils.js
+++ b/www/js/utils.js
@@ -43,7 +43,7 @@ class canopyUXUtils{
//If it's not the first column, mention it!
if(!firstCol){
- cell.classList.add("admin-list-entry-not-first-col");
+ cell.classList.add("not-first-col");
}
//check for arrays