Continuing along with the effort to replace the remaining w3css styles with hand...

diff --git a/webcit-ng/static/css/webcit.css b/webcit-ng/static/css/webcit.css
index 20c7c64de820b042e8a5e6af01ef5c7a30173e4b..9f8ec68eef4afe9184420ef63b4ab26c71a8a2a2 100644 (file)
--- a/webcit-ng/static/css/webcit.css
+++ b/webcit-ng/static/css/webcit.css
@@ -17,7 +17,7 @@
 
 .ctdl-grid-navbar-item {
        grid-area: menu;
-       background-color: #f0f0f0;
+       background-color: ghostwhite;
 }
 
 .ctdl-grid-main-item {
@@ -51,12 +51,17 @@
        padding: 8px;
        background-color: #282a35;
        color: white;
+       font-size: 1.25vw;
 }
 
 .ctdl-banner-buttons li:hover {                /* Buttons that appear in the top banner also reference this class when hovered over */
        background-color: black;
 }
 
+.ctdl-banner-buttons a {
+       color: white;
+}
+
 html,body,h1,h2,h3,h4,h5 {
        font-family: sans-serif
 }
@@ -70,18 +75,35 @@ html,body,h1,h2,h3,h4,h5 {
        transform: translate(-50%, -50%);
        border-style: outset;
        border-width: 3px;
+       border-color: black;
        justify-content: center;
        align-items: center;
        padding: 10px;
-       background-color: #BBBBBB;
+       background-color: GhostWhite;
+}
+
+.ctdl-modal-header {
+       background-color: GhostWhite;
+       padding: 10px;
+}
+
+.ctdl-modal-main {
+       padding: 10px;
+}
+
+.ctdl-modal-footer {
+       background-color: GhostWhite;
+       padding: 10px;
 }
 
 .ctdl-sidebar-class button {
        width: 100%;
+       padding: 10px;
        text-align: left;
-       border-color: #f0f0f0;
-       background-color: #f0f0f0;
+       border-color: GhostWhite;
+       background-color: #GhostWhite;;
        color: #000000;
+       font-size: 1vw;
 }
 
 .ctdl-sidebar-class button:hover {
@@ -120,7 +142,9 @@ html,body,h1,h2,h3,h4,h5 {
 .ctdl-msg-header {
        overflow: hidden;
        padding: 4px;
+       min-height: 35px;
        background-color: GhostWhite;
+       margin-bottom: 10px;    /* this is the vertical space between the header and the message text */
 }
 
 .ctdl-msg-header-info {
@@ -143,6 +167,10 @@ html,body,h1,h2,h3,h4,h5 {
        border-color: black;
 }
 
+.ctdl-msg-button a {
+       color: black;
+}
+
 .ctdl-msg-button:hover {
        background-color: #123456;
        color: GhostWhite;
@@ -150,6 +178,11 @@ html,body,h1,h2,h3,h4,h5 {
        border-color: #123456;
 }
 
+.ctdl-msg-button a:hover {
+       color: white;
+}
+
+
 .ctdl-msg-button a {
        text-decoration: none;
 }
@@ -230,6 +263,10 @@ blockquote pre {
        margin-right: 1%;
 }
 
+.ctdl-forum-urlmodal {
+       width: 75%;
+}
+
 .ctdl-roomlist-top {
        margin: 1%;
 }

diff --git a/webcit-ng/static/index.html b/webcit-ng/static/index.html
index a2f5b1c87549f5482e9ba88fa5b3f3e44d120474..5315d2cc985bf7852c70f2f8cc6fec6cb76f5885 100644 (file)
--- a/webcit-ng/static/index.html
+++ b/webcit-ng/static/index.html
@@ -25,7 +25,7 @@ MODAL LOADING
        <div class="ctdl-grid-banner-item" id="banner">
                <!-- These items float to the LEFT side of the banner -->
                <ul class="ctdl-banner-buttons" style="float:left">
-                       <li id="ctdl-sidebar-open" onClick="sidebar_open();"><i class="fa fa-bars"></i>Menu</li>
+                       <!-- <li id="ctdl-sidebar-open" onClick="sidebar_open();"><i class="fa fa-bars"></i>Menu</li> -->
                        <li id="ctdl-logo">CITADEL</li>
                        <li id="ctdl_banner_title">---</li>
                </ul>
@@ -47,7 +47,7 @@ MODAL LOADING
                        <li><a href="#"><i class="fa fa-user" onClick="user_profile(current_user);"></i></a>
                        <li><a href="#"<i class="fa fa-cog"></i></a>
                        <li><hr>
-                       <li><button onClick="sidebar_close()" title="close menu"><i class="fa fa-remove fa-fw"></i>  Close Menu</button>
+                       <!-- <li><button onClick="sidebar_close()" title="close menu"><i class="fa fa-remove fa-fw"></i>  Close Menu</button> -->
                        <li><button id="ctdl-sidebar-button-mail" onClick="gotoroom('_MAIL_');"><i class="fa fa-envelope fa-fw"></i>  Mail</button>
                        <li id="ctdl_mail_folder_list" style="display:none"></li>
                        <li><button id="ctdl-sidebar-button-forums" onClick="render_room_list();"><i class="fas fa-comments fa-fw"></i>  Forums</button>

diff --git a/webcit-ng/static/js/login.js b/webcit-ng/static/js/login.js
index 122c7b23302579d3ef40d26efca3dec3c7ac1d25..48950202206508d224daa286b2122a3c23c50a99 100644 (file)
--- a/webcit-ng/static/js/login.js
+++ b/webcit-ng/static/js/login.js
@@ -9,31 +9,25 @@
 // If you want to change the look of the login dialog, this is where to change it.
 function display_login_screen(any_message) {
        document.getElementById("ctdl_big_modal").innerHTML = `
-               <div class="w3-modal-content w3-card-4 w3-animate-zoom" style="max-width:600px">
-       
-                       <div class="w3-center"><br>
-                               <span class="w3-button w3-xlarge w3-transparent w3-display-topright" title="Close Modal">×</span>
-                               <span class="w3-circle w3-margin-top"><i class="fa fa-user"></i></span>
-                       </div>
 
-                       <div class="w3-container">
-                               <div class="w3-section">
-                                       <span class="w3-center w3-red">${any_message}</span>
-                               </div>
-                               <div class="w3-section">
-                                       <label><b>${_("User name:")}</b></label>
-                                       <input class="w3-input w3-border w3-margin-bottom" type="text" id="username" required>
-                                       <label><b>${_("Password:")}</b></label>
-                                       <input class="w3-input w3-border" type="password" id="password" required>
-                                       <button class="w3-button w3-block w3-blue w3-section w3-padding" onClick="javascript:login_button()">${_("Log in")}</button>
-                                       <input class="w3-check w3-margin-top" type="checkbox" checked="checked"> Remember me
-                               </div>
-                       </div>
+               <div class="ctdl-modal-header">
+                               <span><i class="fa fa-user"></i></span>
+                               <span>${any_message}</span>
+               </div>
+
+               <div class="ctdl-modal-main">
+                       <label><b>${_("User name:")}</b></label>
+                       <input type="text" id="username" required>
+                       <br>
+                       <label><b>${_("Password:")}</b></label>
+                       <input type="password" id="password" required>
+                       <br>
+                       <input type="checkbox" checked="checked"> Remember me
+               </div>
 
-                       <div class="w3-container w3-border-top w3-padding-16 w3-light-grey">
-                               <button type="button" class="w3-button w3-red">Cancel</button>
-                               <span class="w3-right w3-padding w3-hide-small">Forgot <a href="#">password?</a></span>
-                       </div>
+               <div class="ctdl-modal-footer">
+                       <button onClick="javascript:login_button()">${_("Log in")}</button>
+                       <button type="button">Cancel</button>
                </div>
        `;
 

diff --git a/webcit-ng/static/js/view_forum.js b/webcit-ng/static/js/view_forum.js
index 783fbc7defeab76eece5992b68ddfbb0edef8b0e..c5f0d61797fbe8be7414953389a3892e2dc89415 100644 (file)
--- a/webcit-ng/static/js/view_forum.js
+++ b/webcit-ng/static/js/view_forum.js
@@ -370,25 +370,22 @@ function open_reply_box(parent_div, is_quoted, references, msgid) {
        + "</div>"                                                      // end content
        + "</div>"                                                      // end wrapper
 
-       + "<div id=\"forum_url_entry_box\" class=\"w3-modal\">"         // begin URL entry modal
-       + "     <div class=\"w3-modal-content w3-animate-top w3-card-4\">"
-       + "             <header class=\"w3-container w3-blue\"> "
-       + "                     <p><span>URL:</span></p>"
-       + "             </header>"
-       + "             <div class=\"w3-container w3-blue\">"
-       + "                     <input id=\"forum_txtFormatUrl\" placeholder=\"http://\" style=\"width:100%\">"
-       + "             </div>"
-       + "             <footer class=\"w3-container w3-blue\">"
-       + "                     <p><span class=\"ctdl-msg-button\"><a href=\"javascript:forum_close_urlbox(true);\">"
-       + "                             <i class=\"fa fa-check\" style=\"color:green\"></i> "
-       +                               _("Save")
-       +                       "</a></span>"
-       + "                     <span class=\"ctdl-msg-button\"><a href=\"javascript:forum_close_urlbox(false);\">"
-       + "                             <i class=\"fa fa-trash\" style=\"color:red\"></i> "
-       +                               _("Cancel")
-       +                       "</a></span></p>"
-       + "             </footer>"
-       + "             </div>"
+       + "<div id=\"forum_url_entry_box\" class=\"ctdl-modal ctdl-forum-urlmodal\">"           // begin URL entry modal
+       + "     <div class=\"ctdl-modal-header\">" 
+       + "             <p>URL:</p>"
+       + "     </div>"
+       + "     <div class=\"ctdl-modal-main\">"
+       + "             <input id=\"ctdl-forum-urlbox\" placeholder=\"http://\" style=\"width:100%\">"
+       + "     </div>"
+       + "     <div class=\"ctdl-modal-footer\">"
+       + "             <p><span class=\"ctdl-msg-button\"><a href=\"javascript:forum_close_urlbox(true);\">"
+       + "                     <i class=\"fa fa-check\" style=\"color:green\"></i> "
+       +                       _("Save")
+       +               "</a></span>"
+       + "             <span class=\"ctdl-msg-button\"><a href=\"javascript:forum_close_urlbox(false);\">"
+       + "                     <i class=\"fa fa-trash\" style=\"color:red\"></i> "
+       +                       _("Cancel")
+       +               "</a></span></p>"
        + "     </div>"
        + "     <input id=\"forum_selection_start\" style=\"display:none\"></input>"    // hidden fields
        + "     <input id=\"forum_selection_end\" style=\"display:none\"></input>"      // to store selection range
@@ -496,13 +493,13 @@ function forum_close_urlbox(do_save) {
                var start_replace = document.getElementById("forum_selection_start").value;     // use saved selection range
                var end_replace = document.getElementById("forum_selection_end").value;
                new_text = tag.innerHTML.substring(0, start_replace)
-                       + "<a href=\"" + document.getElementById("forum_txtFormatUrl").value + "\">"
+                       + "<a href=\"" + document.getElementById("ctdl-forum-urlbox").value + "\">"
                        + tag.innerHTML.substring(start_replace, end_replace)
                        + "</a>"
                        + tag.innerHTML.substring(end_replace);
                tag.innerHTML = new_text;
        }
-       document.getElementById("forum_txtFormatUrl").value = "";                               // clear url box for next time
+       document.getElementById("ctdl-forum-urlbox").value = "";                                // clear url box for next time
        document.getElementById("forum_url_entry_box").style.display = "none";
 }