From 8890bd7655afaf5a93004af4dcdb67634c483557 Mon Sep 17 00:00:00 2001
From: cagataycivici <cagatay.civici@gmail.com>
Date: Thu, 30 Apr 2020 11:25:56 +0300
Subject: [PATCH] Demo update

---
 src/views/datatable/DataTableFilterDemo.vue     |  9 +++++----
 src/views/datatable/DataTableTemplatingDemo.vue | 14 +++++++++++---
 2 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/src/views/datatable/DataTableFilterDemo.vue b/src/views/datatable/DataTableFilterDemo.vue
index 6bf54ad23..defcfd6c2 100755
--- a/src/views/datatable/DataTableFilterDemo.vue
+++ b/src/views/datatable/DataTableFilterDemo.vue
@@ -194,10 +194,11 @@ export default {
     text-align: left;
 }
 
-.p-multiselect {
-    width: 100%;
-}
-
+.p-filter-column {
+    .p-multiselect, .p-dropdown, .p-inputtext {
+        width: 100%;
+    }
+} 
 .p-dropdown-car-option {
     img {
         vertical-align: middle;
diff --git a/src/views/datatable/DataTableTemplatingDemo.vue b/src/views/datatable/DataTableTemplatingDemo.vue
index 11a2125c4..9bc7d5fdd 100755
--- a/src/views/datatable/DataTableTemplatingDemo.vue
+++ b/src/views/datatable/DataTableTemplatingDemo.vue
@@ -12,9 +12,9 @@
 		<div class="content-section implementation">
 			<DataTable :value="cars">
                 <template #header>
-                    <div style="line-height:1.87em" class="clearfix">
-                        <Button icon="pi pi-refresh" style="float: left"/>
+                    <div class="table-header">
                         List of Cars
+                        <Button icon="pi pi-refresh" />
                     </div>
                 </template>
                 <Column field="vin" header="Vin"></Column>
@@ -122,4 +122,12 @@ export default {
         'DataTableSubMenu': DataTableSubMenu
     }
 }
-</script>
\ No newline at end of file
+</script>
+
+<style lang="scss" scoped>
+.table-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+</style>
\ No newline at end of file