diff --git a/frontend/src/components/organisms/BottomBar/style.scss b/frontend/src/components/organisms/BottomBar/style.scss index 5fca88fdc94659b02dbce2134d5afe7c7951285c..dbd10841a65c2cfedddd764625ab533cf2fa9918 100644 --- a/frontend/src/components/organisms/BottomBar/style.scss +++ b/frontend/src/components/organisms/BottomBar/style.scss @@ -13,17 +13,18 @@ .block { height: 100%; width: 100%; - } - - .btn:active, .btn.active { + } + + .btn:active, + .btn.active { border: 0; - background-color:#000 !important; + background-color: #000 !important; color: #fff; } .bottom-bar-buttons .btn { - border: 0; - box-shadow: none !important; + border: 0; + box-shadow: none !important; outline: 0 !important; border-radius: 0px; width: 25%; @@ -35,8 +36,6 @@ justify-content: center; } - - .btn:focus { border: 0; box-shadow: 0 0 0 0px; @@ -44,6 +43,7 @@ .bottom-bar-buttons .btn:hover { border: 0px; + background-color: #ced4da; } } @@ -52,5 +52,3 @@ display: none; } } - -//style="background-color:white; border-width:0px; color:black; display:flex; align-items:center; justify-content:center;" diff --git a/frontend/src/components/organisms/LeftBar/style.scss b/frontend/src/components/organisms/LeftBar/style.scss index 2fc82a12c074d354dbe7543e46d5b64216df19a3..76faac7eac101736a32aac3d8ce9106f9a24c3e1 100644 --- a/frontend/src/components/organisms/LeftBar/style.scss +++ b/frontend/src/components/organisms/LeftBar/style.scss @@ -8,16 +8,16 @@ } #sidebar-wrapper { - z-index: 1000; position: fixed; left: 250px; width: 0; - height: 100%; margin-left: -250px; + height: 100%; + margin-bottom: 61px; overflow-y: auto; background: #fff; - background: #FFFFFF; - box-shadow: 0 2px 10px 0 rgba(0,0,0,0.10); + background: #ffffff; + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1); -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; @@ -31,9 +31,12 @@ .exam-outline-button-a { margin-bottom: 10px; border-radius: 8px; + font-weight: 500; } -#sidebar-wrapper .btn-primary:not(:disabled):not(.disabled).active,#sidebar-wrapper .btn-primary:not(:disabled):not(.disabled):active,#sidebar-wrapper .show > .btn-primary.dropdown-toggle { +#sidebar-wrapper .btn-primary:not(:disabled):not(.disabled).active, +#sidebar-wrapper .btn-primary:not(:disabled):not(.disabled):active, +#sidebar-wrapper .show > .btn-primary.dropdown-toggle { color: #fff; background-color: #000; border-radius: 5px; @@ -44,7 +47,7 @@ #sidebar-wrapper .btn-primary { color: #000; - background: #F6F8FA; + background: #f6f8fa; font-size: 17px; color: #000000; letter-spacing: 0; @@ -54,11 +57,19 @@ text-align: left; } -#sidebar-wrapper .btn-group-vertical > .btn-group:not(:last-child) > .btn,#sidebar-wrapper .btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle) { +#sidebar-wrapper .btn-group-vertical > .btn-group:not(:last-child) > .btn, +#sidebar-wrapper + .btn-group-vertical + > .btn:not(:last-child):not(.dropdown-toggle) { border-radius: 5px; } -#sidebar-wrapper .btn-group-vertical > .btn-group:not(:first-child) >#sidebar-wrapper .btn, .btn-group-vertical > .btn:not(:first-child) { +#sidebar-wrapper + .btn-group-vertical + > .btn-group:not(:first-child) + > #sidebar-wrapper + .btn, +.btn-group-vertical > .btn:not(:first-child) { border-top-left-radius: 5px; border-top-right-radius: 5px; } @@ -77,17 +88,20 @@ width: 250px; } -@media (max-width: 768px) { +@media (max-width: 992px) { .sidebar-status { margin-top: 30px; margin-left: 16px; margin-right: 16px; margin-bottom: 0px; font-size: 16px; + font-weight: 500; + font-family: "IBM Plex Sans"; color: #000000; letter-spacing: 0; - position: absolute; - width: max-content; + position: absolute; + width: max-content; + text-transform: uppercase; } .exam-outline-heading { @@ -97,8 +111,8 @@ margin-top: 64px; margin-left: 16px; margin-right: 16px; - position: absolute; - width: max-content; + position: absolute; + width: max-content; margin-bottom: 0px; } @@ -110,16 +124,16 @@ } } -@media (min-width:768px) { - #wrapper { +@media (min-width: 992px) { + #wrapper { padding-left: 250px; - } - + } + #sidebar-wrapper { width: 250px; - } - - .sidebar-status { + } + + .sidebar-status { margin-top: 30px; margin-left: 32px; margin-right: 32px; @@ -127,29 +141,29 @@ font-size: 16px; color: #000000; letter-spacing: 0; - position: absolute; - width: max-content; - } - - .exam-outline-heading { + position: absolute; + width: max-content; + } + + .exam-outline-heading { font-size: 24px; color: #000000; text-align: left; margin-top: 64px; margin-left: 32px; margin-right: 32px; - position: absolute; - width: max-content; + position: absolute; + width: max-content; margin-bottom: 0px; - } - + } + #exam-outline-button-group { margin-top: 102px; margin-left: 32px; margin-right: 32px; width: 186px; - } - + } + #wrapper.toggled { padding-left: 0; } @@ -157,4 +171,4 @@ #wrapper.toggled #sidebar-wrapper { width: 0; } -} \ No newline at end of file +}