Merge pull request #289 from mitre-attack/feature/#181-layer-upgrade-…

…ui-update Feature/#181 layer upgrade UI update
mitre-attack · May 17, 2021 · ba49817 · ba49817
2 parents 20d01a4 + e77c625
commit ba49817
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 28 deletions.
diff --git a/nav-app/src/app/app.component.html b/nav-app/src/app/app.component.html
@@ -1,9 +1,2 @@
-<mat-drawer-container>
-    <mat-drawer-content>
-        <tabs></tabs>
-        <span style="font-size: 7pt">MITRE ATT&CK&reg; Navigator v{{nav_version}}</span>
-    </mat-drawer-content>
-    <mat-drawer mode="side" position="end" #sidebar [opened]="sidebarOpened">
-        <sidebar></sidebar>
-    </mat-drawer>
-</mat-drawer-container>
+<tabs></tabs>
+<span style="font-size: 7pt">MITRE ATT&CK&reg; Navigator v{{nav_version}}</span>
diff --git a/nav-app/src/app/app.component.ts b/nav-app/src/app/app.component.ts
@@ -13,7 +13,6 @@ export class AppComponent {
     @ViewChild(TabsComponent) tabsComponent;
 
     nav_version: string = globals.nav_version;
-    public get sidebarOpened() { return this.dataService.sidebarOpened; }
 
     @HostListener('window:beforeunload', ['$event'])
     promptNavAway($event) {

diff --git a/nav-app/src/app/datatable/data-table.component.html b/nav-app/src/app/datatable/data-table.component.html
@@ -525,26 +525,34 @@
  88  888  88    8oooo88    888      888  88o    888     88 888
 o88o  8  o88o o88o  o888o o888o    o888o  88o8 o888o o88o  o888o
                                                                  -->
-
-<div class="matrices" oncontextmenu="return false">
-        <div class="spinner" *ngIf="!dataService.getDomain(viewModel.domainID).dataLoaded">
-            <mat-progress-spinner mode="indeterminate"></mat-progress-spinner>
-        </div>
-        <div class="matrices-columns">
-            <div class="matrix-column" *ngFor="let matrix of dataService.getDomain(viewModel.domainID).matrices">
-                <div *ngIf="dataService.getDomain(viewModel.domainID).matrices.length > 1" class="matrix-name">{{matrix.name}}</div>
-                <div *ngIf="viewModel.layout.layout == 'side'">
-                    <matrix-side [matrix]="matrix" [viewModel]="viewModel" (selectionChanged)="onTechniqueSelect()"></matrix-side>
-                </div>
-                <div *ngIf="viewModel.layout.layout == 'flat'">
-                    <matrix-flat [matrix]="matrix" [viewModel]="viewModel" (selectionChanged)="onTechniqueSelect()"></matrix-flat>
+<div class="matrices">
+    <mat-drawer-container autosize>
+        <mat-drawer-content>
+            <div oncontextmenu="return false">
+                <div class="spinner" *ngIf="!dataService.getDomain(viewModel.domainID).dataLoaded">
+                    <mat-progress-spinner mode="indeterminate"></mat-progress-spinner>
                 </div>
-                <div *ngIf="viewModel.layout.layout == 'mini'">
-                    <matrix-mini [matrix]="matrix" [viewModel]="viewModel" (selectionChanged)="onTechniqueSelect()"></matrix-mini>
+                <div class="matrices-columns">
+                    <div class="matrix-column" *ngFor="let matrix of dataService.getDomain(viewModel.domainID).matrices">
+                        <div *ngIf="dataService.getDomain(viewModel.domainID).matrices.length > 1" class="matrix-name">{{matrix.name}}</div>
+                        <div *ngIf="viewModel.layout.layout == 'side'">
+                            <matrix-side [matrix]="matrix" [viewModel]="viewModel" (selectionChanged)="onTechniqueSelect()"></matrix-side>
+                        </div>
+                        <div *ngIf="viewModel.layout.layout == 'flat'">
+                            <matrix-flat [matrix]="matrix" [viewModel]="viewModel" (selectionChanged)="onTechniqueSelect()"></matrix-flat>
+                        </div>
+                        <div *ngIf="viewModel.layout.layout == 'mini'">
+                            <matrix-mini [matrix]="matrix" [viewModel]="viewModel" (selectionChanged)="onTechniqueSelect()"></matrix-mini>
+                        </div>
+                    </div>
                 </div>
             </div>
-        </div>
-    </div>
+        </mat-drawer-content>
+        <mat-drawer mode="side" position="end" #sidebar [opened]="sidebarOpened">
+            <sidebar></sidebar>
+        </mat-drawer>
+    </mat-drawer-container>
+</div>
 
 
 <!--

diff --git a/nav-app/src/app/datatable/data-table.component.scss b/nav-app/src/app/datatable/data-table.component.scss
@@ -472,4 +472,3 @@ $panel-light: lighten($panel-dark, 8%);
         }
     }
 }
-
diff --git a/nav-app/src/app/datatable/data-table.component.ts b/nav-app/src/app/datatable/data-table.component.ts
@@ -37,6 +37,8 @@ export class DataTableComponent implements AfterViewInit {
 
     currentDropdown: string = ""; //current dropdown menu
 
+    public get sidebarOpened() { return this.dataService.sidebarOpened; }
+
 
     //////////////////////////////////////////////////////////
     // Stringifies the current view model into a json string//