Make the font sizes less cartoonish at extreme viewport sizes

[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 1ffb787b1426e6f1896fee526c8ab1f3665d28f5..0470c8b26915659a24af220f59cbc4efe28050a4 100644 (file)
--- a/webcit-ng/static/css/webcit.css
+++ b/webcit-ng/static/css/webcit.css
@@ -87,7 +87,8 @@
        display: block;
        background-color: DarkSlateGrey;
        color: White;
-       font-size: 1.7vh;
+       /* font-size: 1.7vh; */
+       font-size: calc(50% + 0.6vw);
        border: none;
        padding: 1vh;
 }
@@ -153,7 +154,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 +173,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 */
@@ -637,6 +638,23 @@ blockquote pre {
        overflow: hidden;
 }
 
+.ctdl-upload {
+       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: 1em;
+       background-color: GhostWhite;
+}
+
+.ctdl-upload.highlight {
+       border-color: Blue;
+}
+
 .ctdl-compose-attachments-title {
        padding: 1em;
        background: Gainsboro;
@@ -648,8 +666,9 @@ blockquote pre {
        align-content: start
 }
 
-.ctdl_dfhtu {                                  /* "Drop Files Here To Upload" text */
+.ctdl-upload-form {
        text-align: center;
+       margin-bottom: 10px;
 }
 
 .ctdl-login-screen-grid-container {