style: redesign task list

thoth-tech · Nov 9, 2023 · a642851 · a642851
1 parent 383fdcf
commit a642851
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 12 deletions.
diff --git a/src/app/units/states/tasks/tasks-viewer/tasks-viewer.component.html b/src/app/units/states/tasks/tasks-viewer/tasks-viewer.component.html
@@ -1,23 +1,21 @@
 <!-- Wide Window Display -->
 <div fxLayout="column" fxFill fxHide fxShow.gt-sm>
-  <div fxLayout="row" fxLayoutAlign="center stretch" fxFill>
+  <div fxLayoutAlign="center stretch" fxFill>
     <!-- Panel 1 -->
-    <div #tasklistpanel id="tasklistpanel" class="vertical-panel">
+    <div #tasklistpanel id="tasklistpanel" class="vertical-panel min-w-12">
       <f-unit-task-list [unitTasks]="taskDefs"></f-unit-task-list>
     </div>
 
     <div class="vertical-spacer"></div>
 
     <!-- Panel 2 -->
-    <div fxFlex class="vertical-panel">
-      <f-task-sheet-view [taskDef]="selectedTaskDef"> </f-task-sheet-view>
-    </div>
-
-    <div class="vertical-spacer"></div>
-
-    <!-- Panel 3 -->
-    <div #taskdetailspanel class="vertical-panel" id="taskdetailspanel">
-      <f-task-details-view [taskDef]="selectedTaskDef" [unit]="unit"></f-task-details-view>
+    <div class="vertical-panel w-full h-full">
+      <div class="flex flex-col h-full">
+        <div class="shrink">
+          <f-task-details-view [taskDef]="selectedTaskDef" [unit]="unit"></f-task-details-view>
+        </div>
+        <f-task-sheet-view class="h-full" [taskDef]="selectedTaskDef"> </f-task-sheet-view>
+      </div>
     </div>
   </div>
 </div>

diff --git a/src/app/units/states/tasks/tasks-viewer/tasks-viewer.component.scss b/src/app/units/states/tasks/tasks-viewer/tasks-viewer.component.scss
@@ -3,7 +3,7 @@
   background-color: white;
   padding: 8px;
   min-width: 60px;
-  width: 350px;
+  width: 450px;
   height: 100%;
 
   &.mobile {