diff --git a/static/css/main.css b/static/css/main.css index fd2cd6c..02b43ad 100644 --- a/static/css/main.css +++ b/static/css/main.css @@ -46,6 +46,30 @@ a:hover { color: white; } +.be-gui-link-no-text, +.be-section-entry .be-gui-button-no-text { + width: 44px; + height: 44px; + padding: 2px; + border-radius: 8px; + background: #905da1; + border: none; + color: white; + display: flex; + align-items: center; + justify-content: center; + 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-button { max-width: 100px; height: 36px; @@ -115,7 +139,6 @@ a:hover { .be-user-info span { font-weight: normal; - color: silver; } .be-site-side-menu { @@ -150,10 +173,20 @@ a:hover { margin: 0px 12px; } -.be-site-side-menu .be-gui-link, -.be-site-side-menu .be-gui-button { +.be-main { + max-width: 880px; + width: 100%; + display: flex; + justify-content: center; + flex-direction: column; + margin: 0px auto; +} + +.be-gui-link, +.be-gui-button { padding: 0px; width: 100%; + max-width: 600px; color: white; display: flex; justify-content: flex-start; @@ -163,19 +196,125 @@ a:hover { text-decoration: none; } -.be-site-side-menu .be-gui-link:hover , -.be-site-side-menu .be-gui-button:hover, +.be-gui-link:hover , +.be-gui-button:hover, .be-site-header button:hover { background: #905da1; } -.be-site-side-menu .be-gui-link img, -.be-site-side-menu .be-gui-button img { +.be-gui-link img, +.be-gui-button img { width: 34px; padding: 5px; margin-right: 12px; } + +.be-dashboard-header { + display: flex; + flex-direction: column; + align-items: start; + justify-content: space-between; + padding: 0px; + margin: 0px; +} + +.be-dashboard-header .profile-cat { + height: 75px; +} + +.be-dashboard-header div { + display: flex; + flex-direction: row; + justify-content: flex-start; + margin: 0px; +} + +.be-dashboard-header .be-gui-link, +.be-dashboard-section .be-gui-link { + background: #905da1; + /* margin-right: 12px; */ +} + +.be-dashboard-header .be-gui-link:hover, +.be-dashboard-section .be-gui-link:hover{ + background: #473951; +} + +.be-dashboard-section { + display: flex; + flex-direction: column; + margin: 0px; + padding: 0px; +} + +.be-dashboard-section form input[type=file] { + border: 1px solid silver; + border-radius: 8px; + margin: 4px 4px 4px 0px; + padding: 12px; + display: inline-block; +} + +.be-dashboard-section h2 { + margin: 20px 0px 20px 0px; + padding: 0px; +} + +.be-section-controls { + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + margin-bottom: 20px; +} + +.be-section-controls .be-gui-link { + max-width: 175px; +} + +.be-section-entries { + display: flex; + flex-direction: column; + border-top: 1px solid black; +} + +.be-section-entry { + display: flex; + flex-direction: row; + justify-content: space-between; + border-bottom: 1px solid black; +} + +.be-section-entry form { + display: flex; + flex-direction: row; + justify-content: space-between; + margin: 0px; +} + +.be-section-entry p { + max-width: 800px; + white-space: nowrap; + overflow-x: clip; + text-overflow: ellipsis; + /* font-weight: bold; */ + +} + +.be-section-entry:hover { + background: #fff6d2; +} + +.be-entry-controls { + display: flex; + flex-direction: row; +} + +.be-dashboard-section-list .be-gui-link { + margin: 6px 0px; +} + .fe-site-header { display: flex; flex-direction: row; @@ -191,7 +330,7 @@ a:hover { } #fe-main { - + margin: 8px; } /* big landscape tablets, laptops, and desktops */