Move gantt chart view to a card

src/components/tasks/gantt-component.vue

@@ -1,5 +1,5 @@
 <template>
-	<div class="gantt-chart box">
+	<div class="gantt-chart">
 		<div class="filter-container">
 			<div class="items">
 				<x-button

src/styles/components/gantt.scss

@@ -6,8 +6,8 @@ $gantt-vertical-border-color: $grey-100;
 }
 
 .gantt-chart {
-  padding: 5px 0;
   overflow-x: auto;
+  border-top: 1px solid $grey-200;
 
   .dates {
     display: flex;
@@ -195,10 +195,6 @@ $gantt-vertical-border-color: $grey-100;
       font-size: .68rem;
     }
   }
-
-  .filter-container {
-    margin-top: -136px;
-  }
 }
 
 .gantt-options {

src/styles/components/list.scss

@@ -144,7 +144,7 @@
 
 .link-share-container .gantt-chart-container .filter-container,
 .gantt-chart-container .filter-container {
-  margin-top: -136px;
+  margin-top: calc(-138px - 2rem);
 }
 
 .link-share-container .list-view .filter-container {

src/views/list/views/Gantt.vue

@@ -1,6 +1,7 @@
 <template>
 	<div class="gantt-chart-container">
-		<div class="gantt-options">
+		<card :padding="false" class="has-overflow">
+		<div class="gantt-options p-4">
 			<fancycheckbox class="is-block" v-model="showTaskswithoutDates">
 				Show tasks which don't have dates set
 			</fancycheckbox>
@@ -56,6 +57,7 @@
 			<router-view/>
 		</transition>
 
+		</card>
 	</div>
 </template>