rainbownapkin/canopy
1
0
Fork 0
Code Issues 2 Pull requests Actions Packages Projects Releases Wiki Activity

Continued css clean-up.

Browse source
This commit is contained in:
rainbow napkin 2024-12-08 04:33:17 -05:00
parent 920948bcc1
commit b13e2bde24
18 changed files with 189 additions and 203 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/views/channel.ejs
View file

@ -98,12 +98,12 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<div class="chat-panel" id="chat-area"> <div class="chat-panel" id="chat-area">
<div class="chat-panel" id="chat-panel-buffer-div"> <div class="chat-panel" id="chat-panel-buffer-div">
</div> </div>
<div class="chat-panel" id="chat-panel-control-div"> <div class="chat-panel control-prompt" id="chat-panel-control-div">
<i class="chat-panel chat-panel-control bi-gear-fill" id="chat-panel-settings-icon"></i> <i class="chat-panel chat-panel-control control-prompt bi-gear-fill" id="chat-panel-settings-icon"></i>
<i class="chat-panel chat-panel-control bi-magic" id="chat-panel-admin-icon"></i> <i class="chat-panel chat-panel-control control-prompt bi-magic" id="chat-panel-admin-icon"></i>
<i class="chat-panel chat-panel-control bi-images" id="chat-panel-emote-icon"></i> <i class="chat-panel chat-panel-control control-prompt bi-images" id="chat-panel-emote-icon"></i>
<input class="chat-panel chat-panel-control" id="chat-panel-prompt" placeholder="Chat..."> <input class="chat-panel chat-panel-control control-prompt" id="chat-panel-prompt" placeholder="Chat...">
<button class="chat-panel chat-panel-control" id="chat-panel-send-button">Send</button> <button class="chat-panel chat-panel-control positive-button" id="chat-panel-send-button">Send</button>
</div> </div>
</div> </div>
</div> </div>

2
src/views/channelSettings.ejs
View file

@ -30,7 +30,7 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<%- include('partial/channelSettings/settings.ejs'); %> <%- include('partial/channelSettings/settings.ejs'); %>
<%- include('partial/channelSettings/permList.ejs'); %> <%- include('partial/channelSettings/permList.ejs'); %>
</div> </div>
<button href="javascript:" id="channel-delete">Delete Channel</button> <button href="javascript:" class="danger-button" id="chan-delete">Delete Channel</button>
<footer> <footer>
<%- include('partial/scripts', {user}); %> <%- include('partial/scripts', {user}); %>
<script src="/js/channelSettings.js"></script> <script src="/js/channelSettings.js"></script>

8
src/views/partial/adminPanel/channelList.ejs
View file

@ -20,10 +20,10 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<td id="admin-channel-list-entry-img-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-img-title"> <td id="admin-channel-list-entry-img-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-img-title">
<h3>Img</h3> <h3>Img</h3>
</td> </td>
<td id="admin-channel-list-entry-name-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-channel-list-entry-name-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
<h3>Name</h3> <h3>Name</h3>
</td> </td>
<td id="admin-channel-list-entry-description-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-channel-list-entry-description-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
<h3>Description</h3> <h3>Description</h3>
</td> </td>
</tr> </tr>
@ -34,12 +34,12 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<img id="admin-channel-list-entry-img-<%- channel.name %>" class="admin-list-entry admin-list-entry-item" src="<%- channel.thumbnail %>"> <img id="admin-channel-list-entry-img-<%- channel.name %>" class="admin-list-entry admin-list-entry-item" src="<%- channel.thumbnail %>">
</a> </a>
</td> </td>
<td id="admin-channel-list-entry-name-<%- channel.name %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-channel-list-entry-name-<%- channel.name %>" class="admin-list-entry admin-list-entry-item not-first-col">
<a href="/c/<%- channel.name %>" class="admin-list-entry admin-list-entry-item"> <a href="/c/<%- channel.name %>" class="admin-list-entry admin-list-entry-item">
<%- channel.name %> <%- channel.name %>
</a> </a>
</td> </td>
<td id="admin-channel-list-entry-description-<%- channel.name %>" class="admin-list-entry admin-list-entry-large admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-channel-list-entry-description-<%- channel.name %>" class="admin-list-entry admin-list-entry-large admin-list-entry-item not-first-col">
<%- channel.description %> <%- channel.description %>
</td> </td>
</tr> </tr>

14
src/views/partial/adminPanel/userBanList.ejs
View file

@ -20,25 +20,25 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<td id="admin-ban-list-entry-img-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-img-title"> <td id="admin-ban-list-entry-img-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-img-title">
<h3>Img</h3> <h3>Img</h3>
</td> </td>
<td id="admin-ban-list-entry-id-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-ban-list-entry-id-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
<h3>ID</h3> <h3>ID</h3>
</td> </td>
<td id="admin-ban-list-entry-name-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-ban-list-entry-name-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
<h3>Name</h3> <h3>Name</h3>
</td> </td>
<td id="admin-ban-list-entry-date-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-ban-list-entry-date-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
<h3>Sign-Up<br>Date</h3> <h3>Sign-Up<br>Date</h3>
</td> </td>
<td id="admin-ban-list-entry-ban-date-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-ban-list-entry-ban-date-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
<h3>Ban<br>Date</h3> <h3>Ban<br>Date</h3>
</td> </td>
<td id="admin-ban-list-entry-expiration-date-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-ban-list-entry-expiration-date-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
<h3>Expires</h3> <h3>Expires</h3>
</td> </td>
<td id="admin-ban-list-entry-expiration-type-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-ban-list-entry-expiration-type-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
<h3>Expiration<br>Action</h3> <h3>Expiration<br>Action</h3>
</td> </td>
<td id="admin-ban-list-entry-actions-type-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-ban-list-entry-actions-type-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
&nbsp; &nbsp;
</td> </td>
</tr> </tr>

24
src/views/partial/adminPanel/userList.ejs
View file

@ -20,22 +20,22 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<td id="admin-user-list-entry-img-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-img-title"> <td id="admin-user-list-entry-img-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-img-title">
<h3>Img</h3> <h3>Img</h3>
</td> </td>
<td id="admin-user-list-entry-id-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-user-list-entry-id-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
<h3>ID</h3> <h3>ID</h3>
</td> </td>
<td id="admin-user-list-entry-name-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-user-list-entry-name-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
<h3>Name</h3> <h3>Name</h3>
</td> </td>
<td id="admin-user-list-entry-rank-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-user-list-entry-rank-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
<h3>Rank</h3> <h3>Rank</h3>
</td> </td>
<td id="admin-user-list-entry-mail-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-user-list-entry-mail-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
<h3>E-Mail</h3> <h3>E-Mail</h3>
</td> </td>
<td id="admin-user-list-entry-date-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-user-list-entry-date-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
<h3>Sign-Up<br>Date</h3> <h3>Sign-Up<br>Date</h3>
</td> </td>
<td id="admin-user-list-entry-control-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-user-list-entry-control-title" class="admin-list-entry admin-list-entry-title admin-list-entry-item not-first-col">
&nbsp; &nbsp;
</td> </td>
</tr> </tr>
@ -46,17 +46,17 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<img id="admin-user-list-entry-img-<%- curUser.user %>" class="admin-list-entry admin-list-entry-item" src="<%- curUser.img %>"> <img id="admin-user-list-entry-img-<%- curUser.user %>" class="admin-list-entry admin-list-entry-item" src="<%- curUser.img %>">
</a> </a>
</td> </td>
<td id="admin-user-list-entry-id-<%- curUser.user %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-user-list-entry-id-<%- curUser.user %>" class="admin-list-entry admin-list-entry-item not-first-col">
<a href="/profile/<%- curUser.user %>" class="admin-list-entry admin-list-entry-item"> <a href="/profile/<%- curUser.user %>" class="admin-list-entry admin-list-entry-item">
<%- curUser.id %> <%- curUser.id %>
</a> </a>
</td> </td>
<td id="admin-user-list-entry-name-<%- curUser.user %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-user-list-entry-name-<%- curUser.user %>" class="admin-list-entry admin-list-entry-item not-first-col">
<a href="/profile/<%- curUser.user %>" class="admin-list-entry admin-list-entry-item"> <a href="/profile/<%- curUser.user %>" class="admin-list-entry admin-list-entry-item">
<%- curUser.user %> <%- curUser.user %>
</a> </a>
</td> </td>
<td id="admin-user-list-entry-rank-<%- curUser.user %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-user-list-entry-rank-<%- curUser.user %>" class="admin-list-entry admin-list-entry-item not-first-col">
<% if(rankEnum.indexOf(curUser.rank) < rankEnum.indexOf(user.rank)){%> <% if(rankEnum.indexOf(curUser.rank) < rankEnum.indexOf(user.rank)){%>
<select id="admin-user-list-rank-select-<%- curUser.user %>" class="admin-user-list-rank-select"> <select id="admin-user-list-rank-select-<%- curUser.user %>" class="admin-user-list-rank-select">
<%rankEnum.slice().reverse().forEach((rank)=>{ %> <%rankEnum.slice().reverse().forEach((rank)=>{ %>
@ -67,13 +67,13 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<%- curUser.rank %> <%- curUser.rank %>
<% } %> <% } %>
</td> </td>
<td id="admin-user-list-entry-email-<%- curUser.user %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-user-list-entry-email-<%- curUser.user %>" class="admin-list-entry admin-list-entry-item not-first-col">
<%- curUser.email ? curUser.email : "N/A" %> <%- curUser.email ? curUser.email : "N/A" %>
</td> </td>
<td id="admin-user-list-entry-date-<%- curUser.user %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-user-list-entry-date-<%- curUser.user %>" class="admin-list-entry admin-list-entry-item not-first-col">
<%- curUser.date.toUTCString() %> <%- curUser.date.toUTCString() %>
</td> </td>
<td id="admin-user-list-entry-action-<%- curUser.user %>" class="admin-list-entry admin-list-entry-item admin-list-entry-not-first-col"> <td id="admin-user-list-entry-action-<%- curUser.user %>" class="admin-list-entry admin-list-entry-item not-first-col">
<!-- It's either this or add whitespce >:( --> <!-- It's either this or add whitespce >:( -->
<i class="bi-radioactive admin-user-list-icon admin-user-list-nuke-icon" id="admin-user-list-nuke-icon-<%- curUser.user %>" title="Nuke Account: <%- curUser.user %>"></i><i class="bi-fire admin-user-list-icon admin-user-list-ban-icon" id="admin-user-list-ban-icon-<%- curUser.user %>" title="Ban User: <%- curUser.user %>"></i><i class="bi-arrow-clockwise admin-user-list-icon admin-user-list-pw-reset-icon" id="admin-user-list-pw-reset-icon-<%- curUser.user %>" title="Generate Password Reset Link for <%- curUser.user %>"></i> <i class="bi-radioactive admin-user-list-icon admin-user-list-nuke-icon" id="admin-user-list-nuke-icon-<%- curUser.user %>" title="Nuke Account: <%- curUser.user %>"></i><i class="bi-fire admin-user-list-icon admin-user-list-ban-icon" id="admin-user-list-ban-icon-<%- curUser.user %>" title="Ban User: <%- curUser.user %>"></i><i class="bi-arrow-clockwise admin-user-list-icon admin-user-list-pw-reset-icon" id="admin-user-list-pw-reset-icon-<%- curUser.user %>" title="Generate Password Reset Link for <%- curUser.user %>"></i>
</td> </td>

20
src/views/partial/channelSettings/banList.ejs
View file

@ -15,19 +15,19 @@ You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.--> along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<div class="admin-list-div"> <div class="admin-list-div">
<h3 id="channel-ban-title">Channel Bans:</h3> <h3 id="channel-ban-title">Channel Bans:</h3>
<span id="new-ban-span" class="admin-list-new-span"> <div class="control-prompt">
<input placeholder="Add Username..." id="new-ban-input" class="admin-list-new-input"> <input placeholder="Add Username..." id="new-ban-input" class="control-prompt">
<button id="new-ban-button">Ban</button> <button id="new-ban-button" class="danger-button">Ban</button>
</span> </div>
<table id="admin-ban-list-table" class="admin-list-table"> <table id="admin-ban-list-table" class="admin-list-table">
<tr class="admin-list-entry-title-row"> <tr class="admin-list-entry-title-row">
<td class="admin-list-entry-item admin-list-entry admin-list-entry-img-title"><h3>Img</h3></td> <td class="admin-list-entry-item admin-list-entry admin-list-entry-img-title"><h3>Img</h3></td>
<td id="admin-user-list-entry-id-title" class="admin-list-entry-item admin-list-entry admin-list-entry-not-first-col"><h3>ID</h3></td> <td id="admin-user-list-entry-id-title" class="admin-list-entry-item admin-list-entry not-first-col"><h3>ID</h3></td>
<td class="admin-list-entry-item admin-list-entry admin-list-entry-not-first-col"><h3>Name</h3></td> <td class="admin-list-entry-item admin-list-entry not-first-col"><h3>Name</h3></td>
<td class="admin-list-entry-item admin-list-entry admin-list-entry-not-first-col"><h3>Ban<br>Alts</h3></td> <td class="admin-list-entry-item admin-list-entry not-first-col"><h3>Ban<br>Alts</h3></td>
<td id="channel-user-list-entry-ban-date-title" class="admin-list-entry-item admin-list-entry admin-list-entry-not-first-col"><h3>Ban Date</h3></td> <td id="channel-user-list-entry-ban-date-title" class="admin-list-entry-item admin-list-entry not-first-col"><h3>Ban Date</h3></td>
<td id="channel-user-list-entry-expiration-date-title" class="admin-list-entry-item admin-list-entry admin-list-entry-not-first-col"><h3>Expires</h3></td> <td id="channel-user-list-entry-expiration-date-title" class="admin-list-entry-item admin-list-entry not-first-col"><h3>Expires</h3></td>
<td id="channel-user-list-entry-actions-title" class="admin-list-entry-item admin-list-entry admin-list-entry-not-first-col">&nbsp;</td> <td id="channel-user-list-entry-actions-title" class="admin-list-entry-item admin-list-entry not-first-col">&nbsp;</td>
</tr> </tr>
<!-- This is getting filled via AJAX since we need to refresh it when new users are added anywho. --> <!-- This is getting filled via AJAX since we need to refresh it when new users are added anywho. -->
</table> </table>

12
src/views/partial/channelSettings/userList.ejs
View file

@ -16,20 +16,20 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<div class="admin-list-div"> <div class="admin-list-div">
<h3 id="channel-rank-title">Channel Ranks:</h3> <h3 id="channel-rank-title">Channel Ranks:</h3>
<sup id="channel-rank-sup">Users set to default channel rank 'user' will NOT be listed below.</sup> <sup id="channel-rank-sup">Users set to default channel rank 'user' will NOT be listed below.</sup>
<span id="new-rank-span" class="admin-list-new-span"> <div class="control-prompt">
<input placeholder="Add Username..." id="new-rank-input" class="admin-list-new-input"> <input placeholder="Add Username..." id="new-rank-input" class="control-prompt">
<select id="new-rank-select"> <select id="new-rank-select">
<%rankEnum.slice().reverse().forEach((rank)=>{ %> <%rankEnum.slice().reverse().forEach((rank)=>{ %>
<option value="<%= rank %>"><%= rank %></option> <option value="<%= rank %>"><%= rank %></option>
<% }); %> <% }); %>
</select> </select>
</span> </div>
<table class="admin-list-table"> <table class="admin-list-table">
<tr class="admin-list-entry-title-row"> <tr class="admin-list-entry-title-row">
<td class="admin-list-entry-item admin-list-entry admin-list-entry-img-title"><h3>Img</h3></td> <td class="admin-list-entry-item admin-list-entry admin-list-entry-img-title"><h3>Img</h3></td>
<td id="admin-user-list-entry-id-title" class="admin-list-entry-item admin-list-entry admin-list-entry-not-first-col"><h3>ID</h3></td> <td id="admin-user-list-entry-id-title" class="admin-list-entry-item admin-list-entry not-first-col"><h3>ID</h3></td>
<td class="admin-list-entry-item admin-list-entry admin-list-entry-not-first-col"><h3>Name</h3></td> <td class="admin-list-entry-item admin-list-entry not-first-col"><h3>Name</h3></td>
<td id="channel-user-list-entry-rank-title" class="admin-list-entry-item admin-list-entry admin-list-entry-not-first-col"><h3>Rank</h3></td> <td id="channel-user-list-entry-rank-title" class="admin-list-entry-item admin-list-entry not-first-col"><h3>Rank</h3></td>
</tr> </tr>
<!-- This is getting filled via AJAX since we need to refresh it when new users are added anywho. --> <!-- This is getting filled via AJAX since we need to refresh it when new users are added anywho. -->
</table> </table>

4
src/views/partial/popup/channelUserBan.ejs
View file

@ -15,7 +15,7 @@ You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.--> along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<!-- I could turn this into partials which get called by both this and userBan but that seems like a lot of work to avoid a quick copy/pase <!-- I could turn this into partials which get called by both this and userBan but that seems like a lot of work to avoid a quick copy/pase
even if I'm usually against that, sometimes you gotta break da rulez :P --> even if I'm usually against that, sometimes you gotta break da rulez :P -->
<link rel="stylesheet" type="text/css" href="/css/popup/userBan.css"> <link rel="stylesheet" type="text/css" href="/css/popup/ban.css">
<h3 class="popup-title">Ban NULL</h3> <h3 class="popup-title">Ban NULL</h3>
<form class="ban-popup-content" action="javascript:"> <form class="ban-popup-content" action="javascript:">
<span> <span>
@ -34,6 +34,6 @@ even if I'm usually against that, sometimes you gotta break da rulez :P -->
<span id="ban-popup-button-span"> <span id="ban-popup-button-span">
<button id="ban-popup-cancel-button">Cancel</button> <button id="ban-popup-cancel-button">Cancel</button>
<span id="ban-popup-button-span-spacer"></span> <span id="ban-popup-button-span-spacer"></span>
<button id="ban-popup-ban-button">Ban</button> <button id="ban-popup-ban-button" class="danger-button">Ban</button>
</span> </span>
</form> </form>

4
src/views/partial/popup/userBan.ejs
View file

@ -13,7 +13,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.--> along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<link rel="stylesheet" type="text/css" href="/css/popup/userBan.css"> <link rel="stylesheet" type="text/css" href="/css/popup/ban.css">
<h3 class="popup-title">Ban NULL</h3> <h3 class="popup-title">Ban NULL</h3>
<form class="ban-popup-content" action="javascript:"> <form class="ban-popup-content" action="javascript:">
<span> <span>
@ -28,6 +28,6 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<span id="ban-popup-button-span"> <span id="ban-popup-button-span">
<button id="ban-popup-cancel-button">Cancel</button> <button id="ban-popup-cancel-button">Cancel</button>
<span id="ban-popup-button-span-spacer"></span> <span id="ban-popup-button-span-spacer"></span>
<button id="ban-popup-ban-button">Ban</button> <button id="ban-popup-ban-button" class="danger-button">Ban</button>
</span> </span>
</form> </form>

2
src/views/profile.ejs
View file

@ -66,7 +66,7 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.-->
<input class="account-settings-password-reset" id="account-settings-password-reset-confirm" placeholder="Confirm New Password" type="password"> <input class="account-settings-password-reset" id="account-settings-password-reset-confirm" placeholder="Confirm New Password" type="password">
</span> </span>
<span class="account-settings" id="account-settings-delete"> <span class="account-settings" id="account-settings-delete">
<a href="javascript:" class="account-settings" id="account-settings-delete-link">Delete Account</a> <button href="javascript:" class="account-settings danger-button" id="account-settings-delete-button">Delete Account</button>
</span> </span>
</div> </div>
<% } %> <% } %>

21
www/css/adminPanel.css
View file

@ -28,14 +28,6 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.*/
padding: 1em 15%; padding: 1em 15%;
} }
.admin-list-table{
border-spacing: 0px;
}
td.admin-list-entry{
padding: 0.3em 1em;
}
.admin-list-entry{ .admin-list-entry{
text-align: center; text-align: center;
} }
@ -95,17 +87,6 @@ img.admin-list-entry-item{
text-align: center; 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{ #new-rank-select{
margin: auto; margin: auto;
height: 1.3em; height: 1.3em;
@ -121,7 +102,7 @@ img.admin-list-entry-item{
height: 1.5em; height: 1.5em;
} }
#channel-delete{ #chan-delete{
margin: auto auto 2em; margin: auto auto 2em;
} }

37
www/css/channel.css
View file

@ -123,29 +123,6 @@ div#chat-panel-main-div{
flex-direction: column; 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{ p#chat-panel-high-level-paragraph{
margin: auto; margin: auto;
margin-left: 0; margin-left: 0;
@ -161,10 +138,6 @@ p.panel-head-element{
appearance: none; appearance: none;
} }
input#chat-panel-prompt{
flex: 1;
}
#chat-panel-send-button{ #chat-panel-send-button{
margin: auto; margin: auto;
margin-right: 1em; margin-right: 1em;
@ -235,6 +208,10 @@ span.user-entry{
display: none; display: none;
} }
#chat-panel-settings-icon{
margin-left: 1em;
}
#cpanel-active-div{ #cpanel-active-div{
position: absolute; position: absolute;
z-index: 4; z-index: 4;
@ -258,3 +235,9 @@ span.user-entry{
flex-direction: row; flex-direction: row;
flex: 1; flex: 1;
} }
#chat-panel-control-div{
height: 2em;
padding: 0;
margin: 0.5em;
}

31
www/css/global.css
View file

@ -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 You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.*/ along with this program. If not, see <https://www.gnu.org/licenses/>.*/
/* Global Styles */
html{ html{
height: 100%; height: 100%;
} }
@ -25,7 +26,35 @@ body{
flex-direction: column; 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{ #navbar{
display: flex; display: flex;
padding: 0.5em; padding: 0.5em;
@ -50,6 +79,8 @@ p.navbar-item, input.navbar-item{
padding: 0.2em; padding: 0.2em;
} }
/* Popup Container */
.popup-backer{ .popup-backer{
position: fixed; position: fixed;
top: 0; top: 0;

2
www/css/profile.css
View file

@ -38,6 +38,6 @@ input.account-settings-password-reset{
display: block; display: block;
} }
a#account-settings-delete-link{ a#account-settings-delete-button{
font-weight: bold; font-weight: bold;
} }

193
www/css/theme/movie-night.css
View file

@ -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 You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.*/ along with this program. If not, see <https://www.gnu.org/licenses/>.*/
/* global */ /* Theme Variables */
:root{ :root{
--main-font: "open-sans", system-ui; --main-font: "open-sans", system-ui;
--bg0: rgb(158, 158, 158); --bg0: rgb(158, 158, 158);
@ -28,13 +28,21 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.*/
--accent0: rgb(48, 47, 47); --accent0: rgb(48, 47, 47);
--accent0-alt0: rgb(34, 34, 34); --accent0-alt0: rgb(34, 34, 34);
--accent0-warning: firebrick;
--accent0-warning-alt0: rgb(121, 11, 11);
--accent1: rgb(245, 245, 245); --accent1: rgb(245, 245, 245);
--accent1-alt0: rgb(185, 185, 185); --accent1-alt0: rgb(185, 185, 185);
--accent2: var(--accent0-alt0); --accent2: var(--accent0-alt0);
--focus0: rgb(51, 153, 51); --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-color0:rgb(63, 121, 71);
--userlist-color1:rgb(143, 46, 26); --userlist-color1:rgb(143, 46, 26);
@ -50,6 +58,7 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.*/
--background-panel-effect-fast: none; --background-panel-effect-fast: none;
} }
/* global */
body{ body{
background-color: var(--bg0); background-color: var(--bg0);
font-family: var(--main-font); font-family: var(--main-font);
@ -61,28 +70,98 @@ a{
color: var(--accent0); color: var(--accent0);
} }
a:hover{
color: var(--focus0-alt0);
text-shadow: var(--focus-glow0);
}
select{ select{
background-color: var(--bg2); background-color: var(--bg2);
border-radius: 0.5em; border-radius: 0.5em;
border: none; border: none;
} }
button{
border-radius: 0.5em;
}
a:hover{
color: var(--accent0-alt0);
}
button{ button{
background-color: var(--bg0); background-color: var(--bg0);
color: var(--accent0); color: var(--accent0);
border: none; 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 */
#navbar{ #navbar{
background-color: var(--bg1); background-color: var(--bg1);
} }
@ -92,10 +171,6 @@ button{
border: hidden; border: hidden;
} }
a:hover.navbar-item{
color: var(--accent1-alt0);
}
.navbar-item input{ .navbar-item input{
background-color: var(--bg1-alt0); background-color: var(--bg1-alt0);
} }
@ -116,10 +191,6 @@ a.channel-guide-entry-item{
color: var(--accent1); color: var(--accent1);
} }
a:hover.channel-guide-entry-item{
color: var(--accent1-alt0);
}
span.channel-guide-entry-item{ span.channel-guide-entry-item{
background-color: var(--bg1-alt0); background-color: var(--bg1-alt0);
box-shadow: 0.2em 0.2em 0.1em black inset; box-shadow: 0.2em 0.2em 0.1em black inset;
@ -132,42 +203,7 @@ p.channel-guide-entry-item{
background-color: var(--bg1-alt0); background-color: var(--bg1-alt0);
} }
/* account settings */
a#account-settings-delete-link{
color: var(--accent0-warning);
}
/* channel settings/admin panel mixed */ /* 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{ a.admin-list-entry-item{
color: var(--accent1); color: var(--accent1);
} }
@ -176,26 +212,7 @@ a:hover.admin-list-entry-item{
color: var(--accent1-alt0); 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 */ /* channel */
#media-panel-div{ #media-panel-div{
background-color: black; background-color: black;
} }
@ -204,31 +221,10 @@ a:hover.admin-list-entry-item{
background-color: var(--bg2); 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{ #chat-area{
background-color: var(--bg2); 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{ .chat-entry{
background-color: var(--bg2); background-color: var(--bg2);
border-bottom: 1px solid var(--bg2-alt1); border-bottom: 1px solid var(--bg2-alt1);
@ -280,11 +276,6 @@ div#chat-panel-control-div{
color: var(--accent1-alt0); color: var(--accent1-alt0);
} }
#chat-panel-send-button{
background-color: var(--focus0);
color: white;
}
select.panel-head-element{ select.panel-head-element{
height: 1.2em; height: 1.2em;
margin: auto; margin: auto;
@ -319,5 +310,5 @@ select.panel-head-element{
} }
#delete-account-popup-title, #delete-channel-popup-title{ #delete-account-popup-title, #delete-channel-popup-title{
color: var(--accent0-warning); color: var(--danger0);
} }

2
www/js/channelSettings.js
View file

@ -333,7 +333,7 @@ class permList{
class deleteBtn{ class deleteBtn{
constructor(channel){ constructor(channel){
this.channel = channel; this.channel = channel;
this.delete = document.querySelector("#channel-delete"); this.delete = document.querySelector("#chan-delete");
this.setupInput(); this.setupInput();
} }

2
www/js/profile.js
View file

@ -157,7 +157,7 @@ class passwordResetPrompt{
class deleteAccountButton{ class deleteAccountButton{
constructor(){ constructor(){
this.deleteLink = document.querySelector('#account-settings-delete-link'); this.deleteLink = document.querySelector('#account-settings-delete-button');
this.setupInput(); this.setupInput();
} }

2
www/js/utils.js
View file

@ -43,7 +43,7 @@ class canopyUXUtils{
//If it's not the first column, mention it! //If it's not the first column, mention it!
if(!firstCol){ if(!firstCol){
cell.classList.add("admin-list-entry-not-first-col"); cell.classList.add("not-first-col");
} }
//check for arrays //check for arrays