fixup! fix: dividing line between jobs and vehicles

src/fragments/forms/map-form/components/optimization/Optimization.vue

@@ -27,17 +27,16 @@
         {{ $t('optimization.addFromMap') + $t('optimization.job') }}
       </v-btn>
       <!-- low priority TODO: more elegant solution for this? -->
-      <job-list v-if="mapViewData.hasRoutes()" :jobs="jobs" :jobs-shown="jobsExpanded" :map-view-data="mapViewData"
+      <job-list class="content-list" v-if="mapViewData.hasRoutes()" :jobs="jobs" :jobs-shown="jobsExpanded" :map-view-data="mapViewData"
                 v-show="jobsExpanded"></job-list>
-      <job-list v-else :jobs="jobs" :jobs-shown="jobsExpanded"></job-list>
-      <v-card v-if="!jobsExpanded" @click="jobsExpanded=!jobsExpanded">
+      <job-list class="content-list" v-else :jobs="jobs" :jobs-shown="jobsExpanded"></job-list>
+      <v-card class="content-list" v-if="!jobsExpanded" @click="jobsExpanded=!jobsExpanded">
         <v-card-title>
           <v-icon style="padding: 0 5px 0 7px">work</v-icon>
           <b>{{ $t('optimization.savedJobs') + jobs.length }}</b>
         </v-card-title>
       </v-card>
 
-      <!--TODO: add another thin divider?-->
       <div class="optimization-heading">
         {{ $t('optimization.vehicles') }} (Max: 3)
         <v-tooltip bottom style="float: right">
@@ -56,7 +55,7 @@
           {{ $t('optimization.addFromMap') + $t('optimization.vehicle') }}
         </v-btn>
       </div>
-      <vehicle-list :vehicles="vehicles"></vehicle-list>
+      <vehicle-list class="content-list" :vehicles="vehicles"></vehicle-list>
       <v-layout row class="form-actions-btns">
         <v-tooltip bottom style="float: right">
           <template v-slot:activator="{ on }">

src/fragments/forms/map-form/components/optimization/components/job-list/JobList.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="job-inputs">
-    <v-expansion-panel  class="content-list" :value="jobExtended" :expand="true">
+    <v-expansion-panel  class="no-shadow" :value="jobExtended" :expand="true">
       <v-expansion-panel-content style="background: transparent;" v-for="(j, i) in jobs" :key="i">
         <div v-if="localMapViewData === null || !unassignedIds.includes(j.id)" slot="header" style="padding-bottom: 0;"><v-icon style="padding: 0 5px 0 0">work</v-icon><b>Job {{j.id}} - {{ j.location[0].toPrecision(8) }}, {{ j.location[1].toPrecision(8)}}</b></div>
         <div v-else slot="header" style="padding-bottom: 0"><v-icon style="padding: 0 5px 0 0">work</v-icon><b>Job {{j.id}} - {{ j.location[0].toPrecision(8) }}, {{ j.location[1].toPrecision(8)}}

src/fragments/forms/map-form/components/optimization/components/job-list/job-list.css

@@ -7,8 +7,6 @@
   color: darkgoldenrod
 }
 
-.content-list {
+.no-shadow {
   box-shadow: none;
-  border-bottom: 2px solid #c62828;
-  margin: 0 0 5px 0;
 }

src/fragments/forms/map-form/components/optimization/components/vehicle-list/VehicleList.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="vehicle-inputs">
-    <v-expansion-panel  class="content-list" :value="vehicleExtended" :expand="true">
+    <v-expansion-panel  class="no-shadow" :value="vehicleExtended" :expand="true">
       <v-expansion-panel-content style="background: transparent;" v-for="(v, i) in vehicles" :key="i">
         <div slot="header" style="padding-bottom: 0;"><v-icon :color="vehicleColors(v.id)" style="padding: 0 5px 0 0">{{vehicleIcon(v.profile)}}</v-icon><b>Vehicle {{v.id}} ({{v.profile}})</b></div>
       <v-card-text>

src/fragments/forms/map-form/components/optimization/components/vehicle-list/vehicle-list.css

@@ -1,5 +1,3 @@
-.content-list {
+.no-shadow {
   box-shadow: none;
-  border-bottom: 2px solid #c62828;
-  margin: 0 0 5px 0;
 }

src/fragments/forms/map-form/components/optimization/optimization.css

@@ -46,3 +46,8 @@ ul.vehicle-inputs {
   max-width: 58px;
   margin-left: 0;
 }
+
+.content-list {
+  box-shadow: none;
+  border-bottom: 2px solid #c62828;
+}