MDL-66893 mod_forum: update navigation bar in grader UI
[moodle.git] / theme / boost / scss / moodle / modules.scss
index ca5c6db..7d99de2 100644 (file)
@@ -431,6 +431,7 @@ $grading-icon-button-size: 36px !default;
 $grading-search-button-padding-left: calc(#{map-get($spacers, 2)} + 8px) !default;
 $grading-search-input-padding-left: calc(#{map-get($spacers, 2)} + #{map-get($spacers, 2)} + #{$grading-icon-button-size - ($input-border-width * 2)}) !default; /* stylelint-disable-line max-line-length */
 $grading-search-input-padding-right: calc(#{map-get($spacers, 2)} + #{$grading-icon-button-size}) !default;
+$grading-nav-bar-active-drawer-button-bottom: calc(#{map-get($spacers, 2) * -1} - 1px) !default;
 
 @keyframes expandSearchButton {
     from {
@@ -477,6 +478,11 @@ $grading-search-input-padding-right: calc(#{map-get($spacers, 2)} + #{$grading-i
 }
 
 .path-mod-forum .unified-grader {
+    .navbar {
+        max-height: none;
+        z-index: 1;
+    }
+
     .grader-grading-panel {
         position: absolute;
         top: 0;
@@ -684,6 +690,26 @@ $grading-search-input-padding-right: calc(#{map-get($spacers, 2)} + #{$grading-i
     .grader-grading-panel.hidden + .grader-module-content {
         margin-right: 0;
     }
+
+    .drawer-button {
+        position: relative;
+
+        &.active::after {
+            content: "";
+            position: absolute;
+            bottom: $grading-nav-bar-active-drawer-button-bottom;
+            left: 0;
+            width: 100%;
+            height: 3px;
+            background-color: map-get($theme-colors, 'primary');
+        }
+
+        .icon {
+            font-size: 20px;
+            height: 20px;
+            width: 20px;
+        }
+    }
 }
 
 @include media-breakpoint-down(xs) {