Updates to plan view to support floating panels.

Author: logicsec

packages/theme/styles/common.scss

@@ -130,7 +130,6 @@
 .antiPanel-navigator,
 .antiPanel-component {
   display: flex;
-  height: 100%;
   min-height: 0;
 
   &.header { background-color: var(--theme-comp-header-color); }

packages/theme/styles/components.scss

@@ -18,9 +18,9 @@
   display: flex;
   flex-direction: column;
   flex-grow: 1;
-  height: 100%;
   min-height: 0;
   min-width: 0;
+  margin: var(--spacing-2);
   border: 1px solid var(--theme-divider-color); // var(--global-surface-02-BorderColor);
   border-radius: var(--small-focus-BorderRadius);
   padding: var(--spacing-2);

plugins/time-resources/src/components/PlanView.svelte

@@ -86,10 +86,10 @@
 
 {#if $deviceInfo.navigator.visible}
   <ToDosNavigator bind:mode bind:tag bind:currentDate />
-  <Separator name={'time'} float={$deviceInfo.navigator.float} index={0} color={'var(--theme-divider-color)'} />
+  <Separator name={'time'} float={$deviceInfo.navigator.float} index={0} separatorSize={0} />
 {/if}
 <div
-  class="flex-col w-full clear-mins mobile-wrapper"
+  class="antiPanel-PlanView flex-col clear-mins"
   class:left-divider={!$deviceInfo.navigator.visible}
   bind:this={mainPanel}
 >
@@ -105,3 +105,16 @@
     on:dragDrop={drop}
   />
 {/if}
+
+<style lang="scss">
+  .antiPanel-PlanView {
+    display: flex;
+    flex-direction: column;
+    flex-grow: 1;
+    background-color: var(--theme-workbench-color);
+    margin: var(--spacing-2) 0 var(--spacing-2) var(--spacing-2);
+    border: 1px solid var(--theme-divider-color);
+    border-radius: var(--small-focus-BorderRadius);
+    min-width: 320px;
+  }
+</style>