diff --git a/static/css/main.css b/static/css/main.css index 02b43ad..ed26640 100644 --- a/static/css/main.css +++ b/static/css/main.css @@ -32,27 +32,44 @@ a:hover { /* text-decoration: underline; */ } +input[type=file], +input[type=text] { + border: 1px solid silver; + border-radius: 8px; + margin: 0px; + padding: 4px; + display: inline-block; +} + #main { text-align: center; } +.be-gui-link , +.be-gui-button, +.be-gui-link-no-text, +.be-gui-button-no-text { + background: #905da1; +} +.be-gui-link-no-text { + width: 40px; + height: 40px; +} + .be-gui-button-no-text { width: 44px; height: 44px; - padding: 2px; - border-radius: 22px; - background: #473951; - border: none; - color: white; +} + +.be-gui-link-no-text img, +.be-gui-button-no-text img { + width: 32px; } .be-gui-link-no-text, -.be-section-entry .be-gui-button-no-text { - width: 44px; - height: 44px; - padding: 2px; +.be-gui-button-no-text { + padding: 4px; border-radius: 8px; - background: #905da1; border: none; color: white; display: flex; @@ -61,26 +78,39 @@ a:hover { margin: 4px; } -.be-section-entry .be-gui-button-no-text { - padding: 24px; -} - -.be-gui-link-no-text img, -.be-section-entry .be-gui-button-no-text img { - width: 36px; -} - +.be-gui-link, .be-gui-button { - max-width: 100px; + padding: 0px; + width: 100%; height: 36px; padding: 8px 12px; - border-radius: 6px; - background: #473951; border: none; + max-width: 600px; color: white; display: flex; + justify-content: flex-start; align-items: center; - font-size: 18px; + border-radius: 6px; + max-width: initial; + text-decoration: none; +} + +.be-gui-link:hover , +.be-gui-button:hover, +.be-gui-link-no-text:hover, +.be-gui-button-no-text:hover { + background: #473951; +} + +.be-gui-link img, +.be-gui-button img { + width: 34px; + padding: 5px; + margin-right: 12px; +} + +.be-section-entry .be-gui-button-no-text { + padding: 24px; } .be-gui-button p { @@ -115,7 +145,7 @@ a:hover { align-items: center; font-size: 18px; margin: 0px 4px; - padding: 0px 12px; + padding: 6px 12px; border-radius: 6px; } @@ -169,8 +199,27 @@ a:hover { .be-site-side-menu div { display: flex; flex-direction: column; - padding: 12px 0px; - margin: 0px 12px; + padding: 0px; + margin: 12px; +} + +.be-site-side-menu .be-gui-link, +.be-site-side-menu .be-gui-button { + padding: 8px; + margin: 0px; + width: auto; + background: #473951; +} + +.be-site-side-menu .be-gui-button { + padding: 28px 8px; + width: 276px; + font-size: 16px; +} + +.be-site-side-menu .be-gui-link:hover, +.be-site-side-menu .be-gui-button:hover { + background: #905da1;; } .be-main { @@ -182,34 +231,6 @@ a:hover { margin: 0px auto; } -.be-gui-link, -.be-gui-button { - padding: 0px; - width: 100%; - max-width: 600px; - color: white; - display: flex; - justify-content: flex-start; - align-items: center; - border-radius: 6px; - max-width: initial; - text-decoration: none; -} - -.be-gui-link:hover , -.be-gui-button:hover, -.be-site-header button:hover { - background: #905da1; -} - -.be-gui-link img, -.be-gui-button img { - width: 34px; - padding: 5px; - margin-right: 12px; -} - - .be-dashboard-header { display: flex; flex-direction: column; @@ -315,6 +336,76 @@ a:hover { margin: 6px 0px; } +.be-dashboard-section-quicklist { + display: flex; + flex-direction: row; + flex-wrap: wrap; +} + +.be-dashboard-section-quicklist .be-gui-link { + max-width: 110px; + margin: 4px; +} + +.be-dashboard-section-quicklist .be-gui-link img { + margin-right: 0px; +} + +.be-storage-section { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} + +.be-storage-section-upload { + display: flex; + flex-direction: row; + align-items: center; + margin-bottom: 12px; +} + +.be-storage-section-upload form { + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + width: 100%; +} + +.be-storage-section-upload form [type=file] { + padding: 10px 12px; +} + +.be-storage-entry { + width: 100%; + display: flex; + flex-direction: row; + align-items: center; +} + +.be-storage-entry .file-thumbnail { + max-width: 50px; + max-height: 50px; + width: 100%; +} + +.be-storage-rename { + display: flex; + flex-direction: row; + align-items: center; + width: 100%; +} + +.be-storage-rename input[type=text] { + width: 100%; + height: 30px; +} + +/* .be-storage-rename .be-gui-button-no-text { */ +/* width: 58px; */ +/* } */ + .fe-site-header { display: flex; flex-direction: row;