fixed layout issues

amd/src/studyplan-editor-components.js

@@ -1922,11 +1922,11 @@ export default {
                         </span>
                         <span class='control editable'>
                             <t-studyplan-associate
-                                v-model="value"><i class='fa fa-users'></i> {{text.associations}}</t-studyplan-associate>
+                                v-model="value"><i class='fa fa-users'></i>&nbsp;{{text.associations}}</t-studyplan-associate>
                         </span>
                         <span class='control editable'>
                             <t-studyplan-edit v-model="value" @moved="movedStudyplan"
-                                ><i class='fa fa-gear'></i> {{text.edit}}</t-studyplan-edit>
+                                ><i class='fa fa-gear'></i>&nbsp;{{text.edit}}</t-studyplan-edit>
                         </span>
                         <span class='control deletable'>
                             <a v-if='value.pages.length == 0' href='#' @click.prevent='deletePlan(value)'

css/devstyles.css

@@ -228,7 +228,7 @@ body.path-local-treestudyplan .editmode-switch-form > * {
 }
 .path-local-treestudyplan .t-studyplan-controlbox,
 .features-treestudyplan .t-studyplan-controlbox {
-    height: 30px;
+    min-height: 30px;
     display: flex;
     justify-content: space-between;
     max-width: 80em;
@@ -238,6 +238,10 @@ body.path-local-treestudyplan .editmode-switch-form > * {
     margin-left: 10px;
     margin-right: 5px;
 }
+.path-local-treestudyplan .t-studyplan-controlbox .control a,
+.features-treestudyplan .t-studyplan-controlbox .control a {
+    white-space: nowrap;
+}
 .path-local-treestudyplan .t-studyline-drag,
 .features-treestudyplan .t-studyline-drag {
     display: inline;
@@ -2036,6 +2040,7 @@ body.path-local-treestudyplan .editmode-switch-form > * {
     flex-direction: row;
     justify-content: flex-start;
     overflow: hidden;
+    height: 100vh; /* full view height, needed for scroll to work properly in separate panels */
 }
 #p-sidebar-wrapper #p-sidebar-contentwrapper {
     flex: 1 1 auto;
@@ -2077,6 +2082,7 @@ body.path-local-treestudyplan .editmode-switch-form > * {
 }
 #p-sidebar-wrapper .p-sidebar .t-toolbox-tabs {
     flex: 1; /* Make sure it grows to fill the space */
+    height: 1rem; /* Flex:1 will make it grow, but it needs a set height in some cases for scroll to work */
 }
 #p-sidebar-wrapper .p-easeinout-enter {
     display: flex;

scss/psidebar.scss

@@ -3,6 +3,7 @@
     flex-direction: row;
     justify-content: flex-start;
     overflow: hidden;
+    height: 100vh; /* full view height, needed for scroll to work properly in separate panels */
 
     #p-sidebar-contentwrapper {
         flex: 1 1 auto;
@@ -48,6 +49,7 @@
 
         .t-toolbox-tabs {
             flex: 1; /* Make sure it grows to fill the space */
+            height: 1rem; /* Flex:1 will make it grow, but it needs a set height in some cases for scroll to work */
         }
     }
 

scss/studyplan.scss

@@ -126,7 +126,7 @@
     }
 
     .t-studyplan-controlbox {
-        height: 30px;
+        min-height: 30px;
         display: flex;
         justify-content: space-between;
         max-width: 80em;
@@ -136,6 +136,10 @@
 
         margin-left: 10px;
         margin-right: 5px;
+
+        a {
+            white-space: nowrap;
+        }
     }
 
     .t-studyline-drag {

styles.css

@@ -228,7 +228,7 @@ body.path-local-treestudyplan .editmode-switch-form > * {
 }
 .path-local-treestudyplan .t-studyplan-controlbox,
 .features-treestudyplan .t-studyplan-controlbox {
-    height: 30px;
+    min-height: 30px;
     display: flex;
     justify-content: space-between;
     max-width: 80em;
@@ -238,6 +238,10 @@ body.path-local-treestudyplan .editmode-switch-form > * {
     margin-left: 10px;
     margin-right: 5px;
 }
+.path-local-treestudyplan .t-studyplan-controlbox .control a,
+.features-treestudyplan .t-studyplan-controlbox .control a {
+    white-space: nowrap;
+}
 .path-local-treestudyplan .t-studyline-drag,
 .features-treestudyplan .t-studyline-drag {
     display: inline;
@@ -2036,6 +2040,7 @@ body.path-local-treestudyplan .editmode-switch-form > * {
     flex-direction: row;
     justify-content: flex-start;
     overflow: hidden;
+    height: 100vh; /* full view height, needed for scroll to work properly in separate panels */
 }
 #p-sidebar-wrapper #p-sidebar-contentwrapper {
     flex: 1 1 auto;
@@ -2077,6 +2082,7 @@ body.path-local-treestudyplan .editmode-switch-form > * {
 }
 #p-sidebar-wrapper .p-sidebar .t-toolbox-tabs {
     flex: 1; /* Make sure it grows to fill the space */
+    height: 1rem; /* Flex:1 will make it grow, but it needs a set height in some cases for scroll to work */
 }
 #p-sidebar-wrapper .p-easeinout-enter {
     display: flex;