Tuned up the CSS on more banner buttons

[citadel.git] / webcit-ng / static / css / webcit.css

diff --git a/webcit-ng/static/css/webcit.css b/webcit-ng/static/css/webcit.css
index ca1e5422ce1e9e6b6126b599fe42b90a533d78a6..01c168bb162757e6e9a4a3dd5f3e8f19619043aa 100644 (file)
--- a/webcit-ng/static/css/webcit.css
+++ b/webcit-ng/static/css/webcit.css
@@ -87,7 +87,7 @@
        display: block;
        background-color: DarkSlateGrey;
        color: White;
-       font-size: 1.7vh;
+       font-size: calc(50% + 0.6vw);
        border: none;
        padding: 1vh;
 }
@@ -153,7 +153,7 @@ html,body,h1,h2,h3,h4,h5 {
        border: 1px solid GhostWhite;
        background-color: GhostWhite;
        color: Black;
-       font-size: 1.5vh;
+       font-size: calc(50% + 0.7vh);
        border-radius: 5px;
 }
 
@@ -172,7 +172,7 @@ html,body,h1,h2,h3,h4,h5 {
 }
 
 .ctdl-forum-reading-pane {
-       background-color: White;        /* Background behind the message boxes */
+       background-color: White;                /* Background behind the message boxes */
 }
 
 .ctdl-fmsg-wrapper {                           /* message wrapper for forum view */
@@ -223,12 +223,13 @@ html,body,h1,h2,h3,h4,h5 {
        border-width: thin;
        border-color: Black;
        cursor: default;
+       font-size: calc(50% + 0.4vh);
 }
 
 .ctdl-msg-button:hover {
        background-color: #123456;
        color: GhostWhite;
-       transition: .3s;
+       transition: .4s;
        border-color: #123456;
        cursor: default;
 }
@@ -637,47 +638,36 @@ blockquote pre {
        overflow: hidden;
 }
 
-.ctdl-compose-attachments-title {
-       padding: 1em;
-       background: Gainsboro;
-       display: flex;
-       flex-wrap: nowrap;
-       flex-direction: row;
-       justify-content: space-between;
-       align-items: auto;
-       align-content: start
-}
-
 .ctdl-upload {
-       display: none;                          /* set to "block" to make the modal appear */
-       z-index: 8;
-       position: fixed;
-       top: 50%;
-       left: 50%;
-       transform: translate(-50%, -50%);
-       border-style: outset;
-       border-width: 3px;
+       display: none;                          /* set to 'block' to make it appear when needed */
+       width: 95%;
+       height: 95%;
+       border: 2px dashed #ccc;
+       border-radius: 20px;
        border-color: Black;
        justify-content: center;
        align-items: center;
-       padding: 10px;
+       padding: 1em;
        background-color: GhostWhite;
 }
 
-.ctdl-upload-drop-area {                       /* shamelessly swiped from https://www.smashingmagazine.com/2018/01/drag-drop-file-uploader-vanilla-js/ */
-       border: 2px dashed #ccc;
-       border-radius: 20px;
-       width: 480px;
-       font-family: sans-serif;
-       margin: 100px auto;
-       padding: 20px;
+.ctdl-upload.highlight {
+       border-color: Blue;
 }
 
-.ctdl-upload-drop-area.highlight {
-       border-color: purple;
+.ctdl-compose-attachments-title {
+       padding: 1em;
+       background: Gainsboro;
+       display: flex;
+       flex-wrap: nowrap;
+       flex-direction: row;
+       justify-content: space-between;
+       align-items: auto;
+       align-content: start
 }
 
-.my-form {
+.ctdl-upload-form {
+       text-align: center;
        margin-bottom: 10px;
 }