From a112da780f876a0f0f75ac0bdc0f94d7c784a6d2 Mon Sep 17 00:00:00 2001
From: cagataycivici <cagatay.civici@gmail.com>
Date: Thu, 23 Jul 2020 11:27:00 +0300
Subject: [PATCH] Fixed #403 Fixed #404 Fixed #405

---
 public/themes/arya-blue/theme.css               | 9 +++++----
 public/themes/arya-green/theme.css              | 9 +++++----
 public/themes/arya-orange/theme.css             | 9 +++++----
 public/themes/arya-purple/theme.css             | 9 +++++----
 public/themes/bootstrap4-dark-blue/theme.css    | 5 +++--
 public/themes/bootstrap4-dark-purple/theme.css  | 5 +++--
 public/themes/bootstrap4-light-blue/theme.css   | 5 +++--
 public/themes/bootstrap4-light-purple/theme.css | 5 +++--
 public/themes/luna-amber/theme.css              | 5 +++--
 public/themes/luna-blue/theme.css               | 5 +++--
 public/themes/luna-green/theme.css              | 5 +++--
 public/themes/luna-pink/theme.css               | 5 +++--
 public/themes/md-dark-deeppurple/theme.css      | 5 +++--
 public/themes/md-dark-indigo/theme.css          | 5 +++--
 public/themes/md-light-deeppurple/theme.css     | 5 +++--
 public/themes/md-light-indigo/theme.css         | 5 +++--
 public/themes/mdc-dark-deeppurple/theme.css     | 5 +++--
 public/themes/mdc-dark-indigo/theme.css         | 5 +++--
 public/themes/mdc-light-deeppurple/theme.css    | 5 +++--
 public/themes/mdc-light-indigo/theme.css        | 5 +++--
 public/themes/nova-accent/theme.css             | 5 +++--
 public/themes/nova-alt/theme.css                | 5 +++--
 public/themes/nova-vue/theme.css                | 5 +++--
 public/themes/nova/theme.css                    | 5 +++--
 public/themes/rhea/theme.css                    | 5 +++--
 public/themes/saga-blue/theme.css               | 9 +++++----
 public/themes/saga-green/theme.css              | 9 +++++----
 public/themes/saga-orange/theme.css             | 9 +++++----
 public/themes/saga-purple/theme.css             | 9 +++++----
 public/themes/vela-blue/theme.css               | 9 +++++----
 public/themes/vela-green/theme.css              | 9 +++++----
 public/themes/vela-orange/theme.css             | 9 +++++----
 public/themes/vela-purple/theme.css             | 9 +++++----
 src/components/dataview/DataView.vue            | 6 +++++-
 src/components/orderlist/OrderList.vue          | 2 +-
 src/components/picklist/PickList.vue            | 4 ++--
 36 files changed, 131 insertions(+), 94 deletions(-)

diff --git a/public/themes/arya-blue/theme.css b/public/themes/arya-blue/theme.css
index b687b17ea..ca04b7850 100644
--- a/public/themes/arya-blue/theme.css
+++ b/public/themes/arya-blue/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: rgba(255, 255, 255, 0.6);
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #383838;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #383838;
@@ -2850,13 +2851,13 @@
 .p-dialog .p-dialog-content {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
-  padding: 0 1.5rem;
+  padding: 0 1.5rem 2rem 1.5rem;
 }
 .p-dialog .p-dialog-footer {
   border-top: 0 none;
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
-  padding: 1.5rem;
+  padding: 0 1.5rem 1.5rem 1.5rem;
   text-align: right;
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
diff --git a/public/themes/arya-green/theme.css b/public/themes/arya-green/theme.css
index 9a506127e..4c08a505b 100644
--- a/public/themes/arya-green/theme.css
+++ b/public/themes/arya-green/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: rgba(255, 255, 255, 0.6);
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #383838;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #383838;
@@ -2850,13 +2851,13 @@
 .p-dialog .p-dialog-content {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
-  padding: 0 1.5rem;
+  padding: 0 1.5rem 2rem 1.5rem;
 }
 .p-dialog .p-dialog-footer {
   border-top: 0 none;
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
-  padding: 1.5rem;
+  padding: 0 1.5rem 1.5rem 1.5rem;
   text-align: right;
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
diff --git a/public/themes/arya-orange/theme.css b/public/themes/arya-orange/theme.css
index ff3191a11..c05731686 100644
--- a/public/themes/arya-orange/theme.css
+++ b/public/themes/arya-orange/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: rgba(255, 255, 255, 0.6);
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #383838;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #383838;
@@ -2850,13 +2851,13 @@
 .p-dialog .p-dialog-content {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
-  padding: 0 1.5rem;
+  padding: 0 1.5rem 2rem 1.5rem;
 }
 .p-dialog .p-dialog-footer {
   border-top: 0 none;
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
-  padding: 1.5rem;
+  padding: 0 1.5rem 1.5rem 1.5rem;
   text-align: right;
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
diff --git a/public/themes/arya-purple/theme.css b/public/themes/arya-purple/theme.css
index 9eb840500..578dac611 100644
--- a/public/themes/arya-purple/theme.css
+++ b/public/themes/arya-purple/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: rgba(255, 255, 255, 0.6);
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #383838;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #383838;
@@ -2850,13 +2851,13 @@
 .p-dialog .p-dialog-content {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
-  padding: 0 1.5rem;
+  padding: 0 1.5rem 2rem 1.5rem;
 }
 .p-dialog .p-dialog-footer {
   border-top: 0 none;
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
-  padding: 1.5rem;
+  padding: 0 1.5rem 1.5rem 1.5rem;
   text-align: right;
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
diff --git a/public/themes/bootstrap4-dark-blue/theme.css b/public/themes/bootstrap4-dark-blue/theme.css
index 8a38f1d36..2a4a63770 100644
--- a/public/themes/bootstrap4-dark-blue/theme.css
+++ b/public/themes/bootstrap4-dark-blue/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: rgba(255, 255, 255, 0.6);
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #2a323d;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #3f4b5b;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #2a323d;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #3f4b5b;
diff --git a/public/themes/bootstrap4-dark-purple/theme.css b/public/themes/bootstrap4-dark-purple/theme.css
index d42f3de8c..918e8d6d5 100644
--- a/public/themes/bootstrap4-dark-purple/theme.css
+++ b/public/themes/bootstrap4-dark-purple/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: rgba(255, 255, 255, 0.6);
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #2a323d;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #3f4b5b;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #2a323d;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #3f4b5b;
diff --git a/public/themes/bootstrap4-light-blue/theme.css b/public/themes/bootstrap4-light-blue/theme.css
index e37c4f918..82461911c 100644
--- a/public/themes/bootstrap4-light-blue/theme.css
+++ b/public/themes/bootstrap4-light-blue/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #6c757d;
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: rgba(0, 0, 0, 0.03);
   color: #212529;
   border: 1px solid #dee2e6;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: rgba(0, 0, 0, 0.03);
   color: #212529;
   border: 1px solid #dee2e6;
diff --git a/public/themes/bootstrap4-light-purple/theme.css b/public/themes/bootstrap4-light-purple/theme.css
index b00e66a02..9afa74182 100644
--- a/public/themes/bootstrap4-light-purple/theme.css
+++ b/public/themes/bootstrap4-light-purple/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #6c757d;
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: rgba(0, 0, 0, 0.03);
   color: #212529;
   border: 1px solid #dee2e6;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: rgba(0, 0, 0, 0.03);
   color: #212529;
   border: 1px solid #dee2e6;
diff --git a/public/themes/luna-amber/theme.css b/public/themes/luna-amber/theme.css
index 26348c89a..5eec7bc2b 100644
--- a/public/themes/luna-amber/theme.css
+++ b/public/themes/luna-amber/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #8888;
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #191919;
   color: #dedede;
   border: 1px solid #191919;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #191919;
   color: #dedede;
   border: 1px solid #191919;
diff --git a/public/themes/luna-blue/theme.css b/public/themes/luna-blue/theme.css
index b0ca1807d..85e2de40c 100644
--- a/public/themes/luna-blue/theme.css
+++ b/public/themes/luna-blue/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #8888;
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #191919;
   color: #dedede;
   border: 1px solid #191919;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #191919;
   color: #dedede;
   border: 1px solid #191919;
diff --git a/public/themes/luna-green/theme.css b/public/themes/luna-green/theme.css
index c17fb3e52..b190c3745 100644
--- a/public/themes/luna-green/theme.css
+++ b/public/themes/luna-green/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #8888;
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #191919;
   color: #dedede;
   border: 1px solid #191919;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #191919;
   color: #dedede;
   border: 1px solid #191919;
diff --git a/public/themes/luna-pink/theme.css b/public/themes/luna-pink/theme.css
index c5feb072a..33fdeb61e 100644
--- a/public/themes/luna-pink/theme.css
+++ b/public/themes/luna-pink/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #8888;
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #191919;
   color: #dedede;
   border: 1px solid #191919;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #191919;
   color: #dedede;
   border: 1px solid #191919;
diff --git a/public/themes/md-dark-deeppurple/theme.css b/public/themes/md-dark-deeppurple/theme.css
index e3fcb44b1..4359bb369 100644
--- a/public/themes/md-dark-deeppurple/theme.css
+++ b/public/themes/md-dark-deeppurple/theme.css
@@ -949,6 +949,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2.5rem;
   height: 2.5rem;
   color: rgba(255, 255, 255, 0.6);
@@ -2066,7 +2067,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid rgba(255, 255, 255, 0.12);
@@ -2241,7 +2242,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid rgba(255, 255, 255, 0.12);
diff --git a/public/themes/md-dark-indigo/theme.css b/public/themes/md-dark-indigo/theme.css
index 6b5ebc8e6..7ca791d65 100644
--- a/public/themes/md-dark-indigo/theme.css
+++ b/public/themes/md-dark-indigo/theme.css
@@ -949,6 +949,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2.5rem;
   height: 2.5rem;
   color: rgba(255, 255, 255, 0.6);
@@ -2066,7 +2067,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid rgba(255, 255, 255, 0.12);
@@ -2241,7 +2242,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid rgba(255, 255, 255, 0.12);
diff --git a/public/themes/md-light-deeppurple/theme.css b/public/themes/md-light-deeppurple/theme.css
index e7266bf6f..46152bce0 100644
--- a/public/themes/md-light-deeppurple/theme.css
+++ b/public/themes/md-light-deeppurple/theme.css
@@ -949,6 +949,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2.5rem;
   height: 2.5rem;
   color: rgba(0, 0, 0, 0.6);
@@ -2066,7 +2067,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #ffffff;
   color: #000001;
   border: 1px solid #e0e0e0;
@@ -2241,7 +2242,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #ffffff;
   color: #000001;
   border: 1px solid #e0e0e0;
diff --git a/public/themes/md-light-indigo/theme.css b/public/themes/md-light-indigo/theme.css
index e498eb9fc..ca4135c26 100644
--- a/public/themes/md-light-indigo/theme.css
+++ b/public/themes/md-light-indigo/theme.css
@@ -949,6 +949,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2.5rem;
   height: 2.5rem;
   color: rgba(0, 0, 0, 0.6);
@@ -2066,7 +2067,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #ffffff;
   color: #000001;
   border: 1px solid #e0e0e0;
@@ -2241,7 +2242,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #ffffff;
   color: #000001;
   border: 1px solid #e0e0e0;
diff --git a/public/themes/mdc-dark-deeppurple/theme.css b/public/themes/mdc-dark-deeppurple/theme.css
index 7044ec178..e8a45f27d 100644
--- a/public/themes/mdc-dark-deeppurple/theme.css
+++ b/public/themes/mdc-dark-deeppurple/theme.css
@@ -949,6 +949,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: rgba(255, 255, 255, 0.6);
@@ -2066,7 +2067,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid rgba(255, 255, 255, 0.12);
@@ -2241,7 +2242,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid rgba(255, 255, 255, 0.12);
diff --git a/public/themes/mdc-dark-indigo/theme.css b/public/themes/mdc-dark-indigo/theme.css
index f0046bce6..fb3f78daa 100644
--- a/public/themes/mdc-dark-indigo/theme.css
+++ b/public/themes/mdc-dark-indigo/theme.css
@@ -949,6 +949,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: rgba(255, 255, 255, 0.6);
@@ -2066,7 +2067,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid rgba(255, 255, 255, 0.12);
@@ -2241,7 +2242,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #1e1e1e;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid rgba(255, 255, 255, 0.12);
diff --git a/public/themes/mdc-light-deeppurple/theme.css b/public/themes/mdc-light-deeppurple/theme.css
index 14c735a0f..49288423b 100644
--- a/public/themes/mdc-light-deeppurple/theme.css
+++ b/public/themes/mdc-light-deeppurple/theme.css
@@ -949,6 +949,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: rgba(0, 0, 0, 0.6);
@@ -2066,7 +2067,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #ffffff;
   color: #000001;
   border: 1px solid #e0e0e0;
@@ -2241,7 +2242,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #ffffff;
   color: #000001;
   border: 1px solid #e0e0e0;
diff --git a/public/themes/mdc-light-indigo/theme.css b/public/themes/mdc-light-indigo/theme.css
index e63cfa711..36accb261 100644
--- a/public/themes/mdc-light-indigo/theme.css
+++ b/public/themes/mdc-light-indigo/theme.css
@@ -949,6 +949,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: rgba(0, 0, 0, 0.6);
@@ -2066,7 +2067,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #ffffff;
   color: #000001;
   border: 1px solid #e0e0e0;
@@ -2241,7 +2242,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #ffffff;
   color: #000001;
   border: 1px solid #e0e0e0;
diff --git a/public/themes/nova-accent/theme.css b/public/themes/nova-accent/theme.css
index fce9f44c5..f83f5ed1b 100644
--- a/public/themes/nova-accent/theme.css
+++ b/public/themes/nova-accent/theme.css
@@ -925,6 +925,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #a6a6a6;
@@ -2042,7 +2043,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #007ad9;
   color: #ffffff;
   border: 1px solid #007ad9;
@@ -2217,7 +2218,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #007ad9;
   color: #ffffff;
   border: 1px solid #007ad9;
diff --git a/public/themes/nova-alt/theme.css b/public/themes/nova-alt/theme.css
index 83e99505d..68f2d2633 100644
--- a/public/themes/nova-alt/theme.css
+++ b/public/themes/nova-alt/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #a6a6a6;
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #333333;
   color: #ffffff;
   border: 1px solid #333333;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #333333;
   color: #ffffff;
   border: 1px solid #333333;
diff --git a/public/themes/nova-vue/theme.css b/public/themes/nova-vue/theme.css
index 9801abff3..ac9b3cab1 100644
--- a/public/themes/nova-vue/theme.css
+++ b/public/themes/nova-vue/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #a6a6a6;
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #f4f4f4;
   color: #333333;
   border: 1px solid #c8c8c8;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #f4f4f4;
   color: #333333;
   border: 1px solid #c8c8c8;
diff --git a/public/themes/nova/theme.css b/public/themes/nova/theme.css
index 8d2e31324..cd235b3d7 100644
--- a/public/themes/nova/theme.css
+++ b/public/themes/nova/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #a6a6a6;
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #f4f4f4;
   color: #333333;
   border: 1px solid #c8c8c8;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #f4f4f4;
   color: #333333;
   border: 1px solid #c8c8c8;
diff --git a/public/themes/rhea/theme.css b/public/themes/rhea/theme.css
index 294bb71c2..367de6306 100644
--- a/public/themes/rhea/theme.css
+++ b/public/themes/rhea/theme.css
@@ -925,6 +925,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #a6a6a6;
@@ -2042,7 +2043,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #7B95A3;
   color: #ffffff;
   border: 1px solid #7B95A3;
@@ -2217,7 +2218,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #7B95A3;
   color: #ffffff;
   border: 1px solid #7B95A3;
diff --git a/public/themes/saga-blue/theme.css b/public/themes/saga-blue/theme.css
index 48cbf228a..c4d3a9c44 100644
--- a/public/themes/saga-blue/theme.css
+++ b/public/themes/saga-blue/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #6c757d;
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #f8f9fa;
   color: #495057;
   border: 1px solid #dee2e6;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #f8f9fa;
   color: #495057;
   border: 1px solid #dee2e6;
@@ -2850,13 +2851,13 @@
 .p-dialog .p-dialog-content {
   background: #ffffff;
   color: #495057;
-  padding: 0 1.5rem;
+  padding: 0 1.5rem 2rem 1.5rem;
 }
 .p-dialog .p-dialog-footer {
   border-top: 0 none;
   background: #ffffff;
   color: #495057;
-  padding: 1.5rem;
+  padding: 0 1.5rem 1.5rem 1.5rem;
   text-align: right;
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
diff --git a/public/themes/saga-green/theme.css b/public/themes/saga-green/theme.css
index bf0a8d34d..f5a57caef 100644
--- a/public/themes/saga-green/theme.css
+++ b/public/themes/saga-green/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #6c757d;
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #f8f9fa;
   color: #495057;
   border: 1px solid #dee2e6;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #f8f9fa;
   color: #495057;
   border: 1px solid #dee2e6;
@@ -2850,13 +2851,13 @@
 .p-dialog .p-dialog-content {
   background: #ffffff;
   color: #495057;
-  padding: 0 1.5rem;
+  padding: 0 1.5rem 2rem 1.5rem;
 }
 .p-dialog .p-dialog-footer {
   border-top: 0 none;
   background: #ffffff;
   color: #495057;
-  padding: 1.5rem;
+  padding: 0 1.5rem 1.5rem 1.5rem;
   text-align: right;
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
diff --git a/public/themes/saga-orange/theme.css b/public/themes/saga-orange/theme.css
index 975457569..6139e8458 100644
--- a/public/themes/saga-orange/theme.css
+++ b/public/themes/saga-orange/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #6c757d;
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #f8f9fa;
   color: #495057;
   border: 1px solid #dee2e6;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #f8f9fa;
   color: #495057;
   border: 1px solid #dee2e6;
@@ -2850,13 +2851,13 @@
 .p-dialog .p-dialog-content {
   background: #ffffff;
   color: #495057;
-  padding: 0 1.5rem;
+  padding: 0 1.5rem 2rem 1.5rem;
 }
 .p-dialog .p-dialog-footer {
   border-top: 0 none;
   background: #ffffff;
   color: #495057;
-  padding: 1.5rem;
+  padding: 0 1.5rem 1.5rem 1.5rem;
   text-align: right;
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
diff --git a/public/themes/saga-purple/theme.css b/public/themes/saga-purple/theme.css
index 1e1186e82..dddba6281 100644
--- a/public/themes/saga-purple/theme.css
+++ b/public/themes/saga-purple/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: #6c757d;
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #f8f9fa;
   color: #495057;
   border: 1px solid #dee2e6;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #f8f9fa;
   color: #495057;
   border: 1px solid #dee2e6;
@@ -2850,13 +2851,13 @@
 .p-dialog .p-dialog-content {
   background: #ffffff;
   color: #495057;
-  padding: 0 1.5rem;
+  padding: 0 1.5rem 2rem 1.5rem;
 }
 .p-dialog .p-dialog-footer {
   border-top: 0 none;
   background: #ffffff;
   color: #495057;
-  padding: 1.5rem;
+  padding: 0 1.5rem 1.5rem 1.5rem;
   text-align: right;
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
diff --git a/public/themes/vela-blue/theme.css b/public/themes/vela-blue/theme.css
index 7aa697d57..1033bb135 100644
--- a/public/themes/vela-blue/theme.css
+++ b/public/themes/vela-blue/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: rgba(255, 255, 255, 0.6);
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #304562;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #304562;
@@ -2850,13 +2851,13 @@
 .p-dialog .p-dialog-content {
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
-  padding: 0 1.5rem;
+  padding: 0 1.5rem 2rem 1.5rem;
 }
 .p-dialog .p-dialog-footer {
   border-top: 0 none;
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
-  padding: 1.5rem;
+  padding: 0 1.5rem 1.5rem 1.5rem;
   text-align: right;
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
diff --git a/public/themes/vela-green/theme.css b/public/themes/vela-green/theme.css
index 894557f3a..466b77d93 100644
--- a/public/themes/vela-green/theme.css
+++ b/public/themes/vela-green/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: rgba(255, 255, 255, 0.6);
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #304562;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #304562;
@@ -2850,13 +2851,13 @@
 .p-dialog .p-dialog-content {
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
-  padding: 0 1.5rem;
+  padding: 0 1.5rem 2rem 1.5rem;
 }
 .p-dialog .p-dialog-footer {
   border-top: 0 none;
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
-  padding: 1.5rem;
+  padding: 0 1.5rem 1.5rem 1.5rem;
   text-align: right;
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
diff --git a/public/themes/vela-orange/theme.css b/public/themes/vela-orange/theme.css
index 3fd3992f0..3b42ada05 100644
--- a/public/themes/vela-orange/theme.css
+++ b/public/themes/vela-orange/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: rgba(255, 255, 255, 0.6);
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #304562;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #304562;
@@ -2850,13 +2851,13 @@
 .p-dialog .p-dialog-content {
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
-  padding: 0 1.5rem;
+  padding: 0 1.5rem 2rem 1.5rem;
 }
 .p-dialog .p-dialog-footer {
   border-top: 0 none;
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
-  padding: 1.5rem;
+  padding: 0 1.5rem 1.5rem 1.5rem;
   text-align: right;
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
diff --git a/public/themes/vela-purple/theme.css b/public/themes/vela-purple/theme.css
index 9df15e57e..fbe3a2977 100644
--- a/public/themes/vela-purple/theme.css
+++ b/public/themes/vela-purple/theme.css
@@ -929,6 +929,7 @@
   margin-right: 0.5rem;
 }
 .p-multiselect-panel .p-multiselect-header .p-multiselect-close {
+  margin-left: 0.5rem;
   width: 2rem;
   height: 2rem;
   color: rgba(255, 255, 255, 0.6);
@@ -2054,7 +2055,7 @@
 .p-orderlist .p-orderlist-controls .p-button {
   margin-bottom: 0.5rem;
 }
-.p-orderlist .p-orderlist-caption {
+.p-orderlist .p-orderlist-header {
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #304562;
@@ -2229,7 +2230,7 @@
 .p-picklist .p-picklist-buttons .p-button {
   margin-bottom: 0.5rem;
 }
-.p-picklist .p-picklist-caption {
+.p-picklist .p-picklist-header {
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
   border: 1px solid #304562;
@@ -2850,13 +2851,13 @@
 .p-dialog .p-dialog-content {
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
-  padding: 0 1.5rem;
+  padding: 0 1.5rem 2rem 1.5rem;
 }
 .p-dialog .p-dialog-footer {
   border-top: 0 none;
   background: #1f2d40;
   color: rgba(255, 255, 255, 0.87);
-  padding: 1.5rem;
+  padding: 0 1.5rem 1.5rem 1.5rem;
   text-align: right;
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
diff --git a/src/components/dataview/DataView.vue b/src/components/dataview/DataView.vue
index 5290b556d..b46af34d0 100755
--- a/src/components/dataview/DataView.vue
+++ b/src/components/dataview/DataView.vue
@@ -18,7 +18,11 @@
 					<slot v-if="$scopedSlots.list && layout === 'list'" name="list" :data="item" :index="index"></slot>
 					<slot v-if="$scopedSlots.grid && layout === 'grid'" name="grid" :data="item" :index="index"></slot>
 				</template>
-				<div v-if="empty" class="p-col-12 p-dataview-emptymessage"><slot name="empty"></slot></div>
+				<div v-if="empty" class="p-col">
+                    <div class="p-dataview-emptymessage">
+                        <slot name="empty"></slot>
+                    </div>
+			    </div>
 			</div>
 		</div>
 		<DVPaginator v-if="paginatorBottom" :rows="d_rows" :first="d_first" :totalRecords="getTotalRecords" :pageLinkSize="pageLinkSize" :template="paginatorTemplate" :rowsPerPageOptions="rowsPerPageOptions"
diff --git a/src/components/orderlist/OrderList.vue b/src/components/orderlist/OrderList.vue
index 69f767bd1..017701900 100755
--- a/src/components/orderlist/OrderList.vue
+++ b/src/components/orderlist/OrderList.vue
@@ -7,7 +7,7 @@
             <OLButton type="button" icon="pi pi-angle-double-down" @click="moveBottom"></OLButton>
         </div>
         <div class="p-orderlist-list-container">
-            <div class="p-orderlist-caption" v-if="$slots.header">
+            <div class="p-orderlist-header" v-if="$slots.header">
                 <slot name="header"></slot>
             </div>
             <transition-group ref="list" name="p-orderlist-flip" tag="ul" class="p-orderlist-list" :style="listStyle" role="listbox" aria-multiselectable="multiple">
diff --git a/src/components/picklist/PickList.vue b/src/components/picklist/PickList.vue
index 5a499b73e..2ac89a397 100755
--- a/src/components/picklist/PickList.vue
+++ b/src/components/picklist/PickList.vue
@@ -7,7 +7,7 @@
             <PLButton type="button" icon="pi pi-angle-double-down" @click="moveBottom($event, 0)"></PLButton>
         </div>
         <div class="p-picklist-list-wrapper p-picklist-source-wrapper">
-            <div class="p-picklist-caption" v-if="$slots.sourceHeader">
+            <div class="p-picklist-header" v-if="$slots.sourceHeader">
                 <slot name="sourceHeader"></slot>
             </div>
             <transition-group ref="sourceList" name="p-picklist-flip" tag="ul" class="p-picklist-list p-picklist-source" :style="listStyle" role="listbox" aria-multiselectable="multiple">
@@ -26,7 +26,7 @@
             <PLButton type="button" icon="pi pi-angle-double-left" @click="moveAllToSource"></PLButton>
         </div>
         <div class="p-picklist-list-wrapper p-picklist-target-wrapper">
-            <div class="p-picklist-caption" v-if="$slots.targetHeader">
+            <div class="p-picklist-header" v-if="$slots.targetHeader">
                 <slot name="targetHeader"></slot>
             </div>
             <transition-group ref="targetList" name="p-picklist-flip" tag="ul" class="p-picklist-list p-picklist-target" :style="listStyle" role="listbox" aria-multiselectable="multiple">