Fixes the expansion panel layout

client/src/app/shared/components/sort-filter-bar/filter-menu/filter-menu.component.html

@@ -1,4 +1,4 @@
-<div class="filter-menu">
+<div class="filter-menu-content-wrapper">
     <mat-accordion (keyup)="checkKeyEvent($event)">
         <mat-expansion-panel *ngFor="let filter of service.filterDefinitions">
             <mat-expansion-panel-header *ngIf="filter.options && filter.options.length">

client/src/app/shared/components/sort-filter-bar/filter-menu/filter-menu.component.scss

@@ -1,45 +1,40 @@
-div.indent {
+.filter-menu-content-wrapper {
-    margin-left: 24px;
-}
-
-mat-divider {
-    margin-top: 5px;
-    margin-bottom: 5px;
-}
-
-.filter-menu {
     overflow-y: scroll;
     height: 100%;
-}
 
-.mat-expansion-panel {
+    div.indent {
-    width: 400px;
+        margin-left: 24px;
-    max-width: 95vw;
-}
-
-.filter-count {
-    margin-left: 10px;
-}
-
-.filter-subtitle {
-    margin-top: 5px;
-    margin-bottom: 5px;
-    opacity: 0.9;
-    font-style: italic;
-}
-
-.filter-child {
-    margin-left: 20px;
-}
-
-mat-checkbox {
-    // adds breaks to mat-checkboxes with long labels
-    .mat-checkbox-layout {
-        white-space: normal;
     }
 
-    // rather than center the checkbox, put the checkbox in the first line
+    .mat-expansion-panel {
-    .mat-checkbox-inner-container {
+        width: 400px;
-        margin-top: 3px;
+        max-width: 95vw;
+    }
+
+    .filter-count {
+        margin-left: 10px;
+    }
+
+    .filter-subtitle {
+        margin-top: 5px;
+        margin-bottom: 5px;
+        opacity: 0.9;
+        font-style: italic;
+    }
+
+    .filter-child {
+        margin-left: 20px;
+    }
+
+    mat-checkbox {
+        // adds breaks to mat-checkboxes with long labels
+        .mat-checkbox-layout {
+            white-space: normal;
+        }
+
+        // rather than center the checkbox, put the checkbox in the first line
+        .mat-checkbox-inner-container {
+            margin-top: 3px;
+        }
     }
 }