From b6b0e25503f768f831b800a6d2760b2ccbfab727 Mon Sep 17 00:00:00 2001 From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> Date: Tue, 20 Sep 2022 19:45:46 -0400 Subject: updated homepage view --- src/client/views/DashboardView.scss | 85 ++++++++++++++++++++++++++++++++++--- 1 file changed, 79 insertions(+), 6 deletions(-) (limited to 'src/client/views/DashboardView.scss') diff --git a/src/client/views/DashboardView.scss b/src/client/views/DashboardView.scss index 3db23b86f..b8a6f6c05 100644 --- a/src/client/views/DashboardView.scss +++ b/src/client/views/DashboardView.scss @@ -1,3 +1,6 @@ +@import "./global/globalCssVariables"; + + .dashboard-view { padding: 50px; display: flex; @@ -7,8 +10,10 @@ .left-menu { display: flex; + justify-content: flex-start; flex-direction: column; - width: 300px; + width: 250px; + min-width: 250px; } .all-dashboards { @@ -20,7 +25,8 @@ } .text-button { - padding: 10px 0; + cursor: pointer; + padding: 3px 0; &:hover { font-weight: 500; } @@ -30,17 +36,46 @@ } } +.new-dashboard-button { + font-weight: 600; + padding-bottom: 10px; +} + +.dashboard-container-new { + border-radius: 10px; + width: 250px; + height: 200px; + font-size: 120px; + font-weight: 100; + text-align: center; + border: solid 2px $light-gray; + margin: 0 0px 30px 30px; + cursor: pointer; + color: $light-gray; + display: flex; + display: flex; + justify-content: center; + align-items: center; + + &:hover { + color: $light-blue; + border: solid 2px $light-blue; + } +} + .dashboard-container { border-radius: 10px; + cursor: pointer; width: 250px; - border: solid .5px grey; + height: 200px; + outline: solid 2px $light-gray; display: flex; flex-direction: column; - margin: 0 30px 30px 30px; + margin: 0 0px 30px 30px; overflow: hidden; - &:hover { - border: solid 1.5px grey; + &:hover{ + outline: solid 2px $light-blue; } .title { @@ -58,9 +93,47 @@ flex-direction: row; justify-content: space-between; align-items: center; + padding: 0px 10px; } .more { z-index: 100; } +} + +.new-dashboard { + color: $dark-gray; + display: flex; + width: 100%; + height: 100%; + flex-direction: column; + justify-content: space-between; + + .header { + font-size: 1.5em; + font-weight: 600; + } + + .title-input, + .color-picker { + display: flex; + flex-direction: row; + justify-content: flex-start; + align-items: center; + font-weight: 500; + gap: 5px; + z-index: 5; + + .input { + border-radius: 10px; + padding: 5px 10px; + } + } + + .button-bar { + display: flex; + gap: 5px; + flex-direction: row; + justify-content: flex-end; + } } \ No newline at end of file -- cgit v1.2.3-70-g09d2