Closes #7936

- Swimlane style refinements.
- New theme constants for swimlane colors.
- Time Strip label column buttons aligned right.

src/styles/_constants-darkmatter.scss

@@ -523,6 +523,8 @@ $colorInProgressFgEm: $colorTimeRealtimeFg;
 $colorGanttSelectedBorder: rgba(#fff, 0.3);
 $colorEventLine: $colorBodyFg;
 $colorEventLineExtended: rgba($colorEventLine, 0.3);
+$colorTimeStripDraftBg: rgba(#a57748, 0.2);
+$colorTimeStripLabelBg: rgba($colorBodyFg, 0.15);
 $eventLineW: 1px;
 
 // Tree

src/styles/_constants-espresso.scss

@@ -488,6 +488,8 @@ $colorInProgressFgEm: $colorTimeRealtimeFg;
 $colorGanttSelectedBorder: rgba(#fff, 0.3);
 $colorEventLine: $colorBodyFg;
 $colorEventLineExtended: rgba($colorEventLine, 0.3);
+$colorTimeStripDraftBg: rgba(#a57748, 0.2);
+$colorTimeStripLabelBg: rgba($colorBodyFg, 0.15);
 $eventLineW: 1px;
 
 // Tree

src/styles/_constants-maelstrom.scss

@@ -504,6 +504,8 @@ $colorInProgressFgEm: $colorTimeRealtimeFg;
 $colorGanttSelectedBorder: rgba(#fff, 0.3);
 $colorEventLine: $colorBodyFg;
 $colorEventLineExtended: rgba($colorEventLine, 0.3);
+$colorTimeStripDraftBg: rgba(#a57748, 0.2);
+$colorTimeStripLabelBg: rgba($colorBodyFg, 0.15);
 $eventLineW: 1px;
 
 // Tree

src/styles/_constants-snow.scss

@@ -487,6 +487,8 @@ $colorInProgressFgEm: $colorCurrentFgEm;
 $colorGanttSelectedBorder: #fff;
 $colorEventLine: $colorBodyFg;
 $colorEventLineExtended: rgba($colorEventLine, 0.3);
+$colorTimeStripDraftBg: rgba(#a57748, 0.2);
+$colorTimeStripLabelBg: rgba($colorBodyFg, 0.15);
 $eventLineW: 1px;
 
 // Tree

src/ui/components/swim-lane/SwimLane.vue

@@ -45,6 +45,7 @@
       <div class="c-object-label__name">
         <slot name="label"></slot>
       </div>
+      <div class="c-swimlane__lane-label-button-h">
         <button
           v-if="!hideButton"
           class="c-button"
@@ -54,6 +55,7 @@
           @click="pressOnButton"
         />
       </div>
+    </div>
     <div
       class="c-swimlane__lane-object"
       :style="{ 'min-height': minHeight }"

src/ui/components/swim-lane/swimlane.scss

@@ -28,17 +28,13 @@
   width: 100%;
 
   &.is-status--draft {
-    background: rgba($colorAlert, 0.2);
+    background: $colorTimeStripDraftBg;
   }
 
-  [class*='__lane-label'] {
+  &__lane-label {
-    background: rgba($colorBodyFg, 0.2);
+    background: $colorTimeStripLabelBg;
     color: $colorBodyFg;
-    padding: $interiorMarginSm;
+    padding: $interiorMarginSm $interiorMargin;
-  }
-
-  [class*='--span-cols'] {
-    grid-column: span 2;
   }
 
   &__lane-object {
@@ -52,6 +48,16 @@
     @include smallerControlButtons;
   }
 
+  &__lane-label-button-h {
+    // Holds swimlane button(s)
+    flex: 1 1 auto;
+    text-align: right;
+  }
+
+  .--span-cols {
+    grid-column: span 2;
+  }
+
   // Yet more brittle special case selecting...
   .is-object-type-plan,
   .is-object-type-gantt-chart {