diff --git a/public/themes/luna-amber/theme.css b/public/themes/luna-amber/theme.css
index 81b518c17..56b14f0d5 100644
--- a/public/themes/luna-amber/theme.css
+++ b/public/themes/luna-amber/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.375375rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.32175rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.749875rem 0.875rem;
+  padding: 0.64275rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.07125rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.64275rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.07125rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 0.71375rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 0.71375rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 0.857rem 1rem;
diff --git a/public/themes/luna-green/theme.css b/public/themes/luna-green/theme.css
index 9149dcf4f..c7f9b4fdd 100644
--- a/public/themes/luna-green/theme.css
+++ b/public/themes/luna-green/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.375375rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.32175rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.749875rem 0.875rem;
+  padding: 0.64275rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.07125rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.64275rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.07125rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 0.71375rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 0.71375rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 0.857rem 1rem;
diff --git a/public/themes/luna-pink/theme.css b/public/themes/luna-pink/theme.css
index 4c3647b05..8ce3b0461 100644
--- a/public/themes/luna-pink/theme.css
+++ b/public/themes/luna-pink/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.375375rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.32175rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.749875rem 0.875rem;
+  padding: 0.64275rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.07125rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.64275rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.07125rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 0.71375rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 0.71375rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 0.857rem 1rem;
diff --git a/public/themes/nova-colored/theme.css b/public/themes/nova-colored/theme.css
index 08a5cdb7a..f8c42b8cd 100644
--- a/public/themes/nova-colored/theme.css
+++ b/public/themes/nova-colored/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.375375rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.32175rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.749875rem 0.875rem;
+  padding: 0.64275rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.07125rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.64275rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.07125rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 0.71375rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 0.71375rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 0.857rem 1rem;
diff --git a/public/themes/nova-dark/theme.css b/public/themes/nova-dark/theme.css
index f218fc140..a996b859f 100644
--- a/public/themes/nova-dark/theme.css
+++ b/public/themes/nova-dark/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.375375rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.32175rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.749875rem 0.875rem;
+  padding: 0.64275rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.07125rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.64275rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.07125rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 0.71375rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 0.71375rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 0.857rem 1rem;
diff --git a/public/themes/nova-light/theme.css b/public/themes/nova-light/theme.css
index 324e96a20..fd40ece78 100644
--- a/public/themes/nova-light/theme.css
+++ b/public/themes/nova-light/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.375375rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.32175rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.749875rem 0.875rem;
+  padding: 0.64275rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.07125rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.64275rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.07125rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 0.71375rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 0.71375rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 0.857rem 1rem;
diff --git a/public/themes/nova-vue/theme.css b/public/themes/nova-vue/theme.css
index da6e5e235..5cfb38dcc 100644
--- a/public/themes/nova-vue/theme.css
+++ b/public/themes/nova-vue/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.375375rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.32175rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.749875rem 0.875rem;
+  padding: 0.64275rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.07125rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.64275rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.07125rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 0.71375rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 0.71375rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 0.857rem 1rem;
diff --git a/public/themes/rhea/theme.css b/public/themes/rhea/theme.css
index 3212abbca..34ea0b17e 100644
--- a/public/themes/rhea/theme.css
+++ b/public/themes/rhea/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.375375rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.32175rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.375375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.32175rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.749875rem 0.875rem;
+  padding: 0.64275rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.499625rem 0.749875rem;
+  padding: 0.42825rem 0.64275rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.499625rem 0.875rem;
+  padding: 0.42825rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.07125rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.64275rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.42825rem 0.64275rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.42825rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.07125rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 0.71375rem 1.07125rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 0.71375rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 0.71375rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 0.857rem 1rem;
diff --git a/public/themes/saga-blue/theme.css b/public/themes/saga-blue/theme.css
index 78d450eb5..0d169ffe6 100644
--- a/public/themes/saga-blue/theme.css
+++ b/public/themes/saga-blue/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/saga-cyan/theme.css b/public/themes/saga-cyan/theme.css
index 2f1495a90..e38dd274a 100644
--- a/public/themes/saga-cyan/theme.css
+++ b/public/themes/saga-cyan/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/saga-deeppurple/theme.css b/public/themes/saga-deeppurple/theme.css
index d272c0b21..0950c723a 100644
--- a/public/themes/saga-deeppurple/theme.css
+++ b/public/themes/saga-deeppurple/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/saga-green/theme.css b/public/themes/saga-green/theme.css
index 602393085..4a8e8146f 100644
--- a/public/themes/saga-green/theme.css
+++ b/public/themes/saga-green/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/saga-indigo/theme.css b/public/themes/saga-indigo/theme.css
index 23d0703bd..f5eaebd38 100644
--- a/public/themes/saga-indigo/theme.css
+++ b/public/themes/saga-indigo/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/saga-orange/theme.css b/public/themes/saga-orange/theme.css
index c207a6fd0..d6e3b9124 100644
--- a/public/themes/saga-orange/theme.css
+++ b/public/themes/saga-orange/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/saga-purple/theme.css b/public/themes/saga-purple/theme.css
index fd9487a30..03bf4e428 100644
--- a/public/themes/saga-purple/theme.css
+++ b/public/themes/saga-purple/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/saga-teal/theme.css b/public/themes/saga-teal/theme.css
index ae0d0f8fd..321701ed2 100644
--- a/public/themes/saga-teal/theme.css
+++ b/public/themes/saga-teal/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/vela-blue/theme.css b/public/themes/vela-blue/theme.css
index 7adb47c82..4bc3d2679 100644
--- a/public/themes/vela-blue/theme.css
+++ b/public/themes/vela-blue/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/vela-cyan/theme.css b/public/themes/vela-cyan/theme.css
index 5de2fbaab..82a0dc005 100644
--- a/public/themes/vela-cyan/theme.css
+++ b/public/themes/vela-cyan/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/vela-deeppurple/theme.css b/public/themes/vela-deeppurple/theme.css
index e5d1eb2b7..6e16be623 100644
--- a/public/themes/vela-deeppurple/theme.css
+++ b/public/themes/vela-deeppurple/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/vela-green/theme.css b/public/themes/vela-green/theme.css
index c74150603..5b78b89ea 100644
--- a/public/themes/vela-green/theme.css
+++ b/public/themes/vela-green/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/vela-indigo/theme.css b/public/themes/vela-indigo/theme.css
index a6df21cf7..386c968c6 100644
--- a/public/themes/vela-indigo/theme.css
+++ b/public/themes/vela-indigo/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/vela-orange/theme.css b/public/themes/vela-orange/theme.css
index f994aa3bb..06c766ede 100644
--- a/public/themes/vela-orange/theme.css
+++ b/public/themes/vela-orange/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/vela-purple/theme.css b/public/themes/vela-purple/theme.css
index 6d951609a..bb8e4edad 100644
--- a/public/themes/vela-purple/theme.css
+++ b/public/themes/vela-purple/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/public/themes/vela-teal/theme.css b/public/themes/vela-teal/theme.css
index b71e41df0..4d8a21cca 100644
--- a/public/themes/vela-teal/theme.css
+++ b/public/themes/vela-teal/theme.css
@@ -654,8 +654,8 @@
   border-width: 1px;
 }
 .p-inputtext.p-inputtext-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.4375rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.375rem;
 }
 .p-inputtext.p-inputtext-lg {
   font-size: 1.25rem;
@@ -1093,11 +1093,11 @@
   border-radius: 50%;
 }
 .p-button.p-button-sm {
-  font-size: 0.875rem;
-  padding: 0.4375rem 0.875rem;
+  font-size: 0.75rem;
+  padding: 0.375rem 0.75rem;
 }
 .p-button.p-button-sm .p-button-icon {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
 }
 .p-button.p-button-lg {
   font-size: 1.25rem;
@@ -1410,19 +1410,19 @@
   font-size: 2rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-header {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-thead > tr > th {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-sm .p-datatable-footer {
-  padding: 0.875rem 0.875rem;
+  padding: 0.75rem 0.75rem;
 }
 .p-datatable.p-datatable-lg .p-datatable-header {
   padding: 1.25rem 1.25rem;
@@ -1989,6 +1989,36 @@
 .p-treetable .p-treetable-loading-icon {
   font-size: 2rem;
 }
+.p-treetable.p-treetable-sm .p-treetable-header {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-thead > tr > th {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tbody > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-sm .p-treetable-footer {
+  padding: 0.75rem 0.75rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-header {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-thead > tr > th {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tbody > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td {
+  padding: 1.25rem 1.25rem;
+}
+.p-treetable.p-treetable-lg .p-treetable-footer {
+  padding: 1.25rem 1.25rem;
+}
 
 .p-accordion .p-accordion-header a {
   padding: 1rem;
diff --git a/src/router.js b/src/router.js
index 87eb51786..cbd7d5eff 100755
--- a/src/router.js
+++ b/src/router.js
@@ -210,6 +210,11 @@ export default new Router({
 			path: '/datatable/colgroup',
 			name: 'datatablecolgroup',
 			component: () => import('./views/datatable/DataTableColGroupDemo.vue')
+        },
+        {
+			path: '/datatable/size',
+			name: 'datatablesize',
+			component: () => import('./views/datatable/DataTableSizeDemo.vue')
 		},
         {
 			path: '/datatable/colresize',
@@ -565,6 +570,11 @@ export default new Router({
 			name: 'treetabletemplating',
 			component: () => import('./views/treetable/TreeTableTemplatingDemo.vue')
         },
+        {
+			path: '/treetable/size',
+			name: 'treetablesize',
+			component: () => import('./views/treetable/TreeTableSizeDemo.vue')
+        },
         {
 			path: '/treetable/paginator',
 			name: 'treetablepaginator',
diff --git a/src/views/button/ButtonDoc.vue b/src/views/button/ButtonDoc.vue
index d324a0019..12063e563 100755
--- a/src/views/button/ButtonDoc.vue
+++ b/src/views/button/ButtonDoc.vue
@@ -159,6 +159,14 @@ import Button from 'primevue/button';
                             <tr>
                                 <td>p-button-text</td>
                                 <td>Label element of the button</td>
+                            </tr>
+                            <tr>
+                                <td>p-button-sm</td>
+                                <td>Smaller button element</td>
+                            </tr>
+                            <tr>
+                                <td>p-button-lg</td>
+                                <td>Larger button element</td>
                             </tr>
 						</tbody>
 					</table>
diff --git a/src/views/datatable/DataTableDoc.vue b/src/views/datatable/DataTableDoc.vue
index 137aeaa52..87ac9d103 100755
--- a/src/views/datatable/DataTableDoc.vue
+++ b/src/views/datatable/DataTableDoc.vue
@@ -336,6 +336,44 @@ export default {
     &lt;/template&gt;
 &lt;/DataTable&gt;
 </template>
+</CodeHighlight>
+
+                <h3>Sizes</h3>
+                <p>In addition to the regular table, a smal and a large version are available with different paddings. For a table
+                with smaller paddings use <i>p-datatable-sm</i> class and for a larger one use <i>p-datatable-lg</i>.</p>
+
+<CodeHighlight>
+<template v-pre>
+&lt;DataTable :value="cars" class="p-datatable-sm"&gt;
+    &lt;template #header&gt;
+        Small Table
+    &lt;/template&gt;
+    &lt;Column field="vin" header="Vin"&gt;&lt;/Column&gt;
+    &lt;Column field="year" header="Year"&gt;&lt;/Column&gt;
+    &lt;Column field="brand" header="Brand"&gt;&lt;/Column&gt;
+    &lt;Column field="color" header="Color"&gt;&lt;/Column&gt;
+&lt;/DataTable&gt;
+
+&lt;DataTable :value="cars"&gt;
+    &lt;template #header&gt;
+        Normal Table
+    &lt;/template&gt;
+    &lt;Column field="vin" header="Vin"&gt;&lt;/Column&gt;
+    &lt;Column field="year" header="Year"&gt;&lt;/Column&gt;
+    &lt;Column field="brand" header="Brand"&gt;&lt;/Column&gt;
+    &lt;Column field="color" header="Color"&gt;&lt;/Column&gt;
+&lt;/DataTable&gt;
+
+&lt;DataTable :value="cars" class="p-datatable-lg"&gt;
+    &lt;template #header&gt;
+        Large Table
+    &lt;/template&gt;
+    &lt;Column field="vin" header="Vin"&gt;&lt;/Column&gt;
+    &lt;Column field="year" header="Year"&gt;&lt;/Column&gt;
+    &lt;Column field="brand" header="Brand"&gt;&lt;/Column&gt;
+    &lt;Column field="color" header="Color"&gt;&lt;/Column&gt;
+&lt;/DataTable&gt;
+</template>
 </CodeHighlight>
 
                 <h3>Column Grouping</h3>
diff --git a/src/views/datatable/DataTableSizeDemo.vue b/src/views/datatable/DataTableSizeDemo.vue
new file mode 100644
index 000000000..8c4da2195
--- /dev/null
+++ b/src/views/datatable/DataTableSizeDemo.vue
@@ -0,0 +1,126 @@
+<template>
+	<div>
+        <DataTableSubMenu />
+
+		<div class="content-section introduction">
+			<div class="feature-intro">
+				<h1>DataTable - Size</h1>
+				<p>In addition to a regular table, a smaller and a larger alternatives available.</p>
+			</div>
+		</div>
+
+		<div class="content-section implementation">
+			<DataTable :value="cars" class="p-datatable-sm" style="margin-bottom: 2rem">
+                <template #header>
+                    Small Table
+                </template>
+                <Column field="vin" header="Vin"></Column>
+                <Column field="year" header="Year"></Column>
+                <Column field="brand" header="Brand"></Column>
+                <Column field="color" header="Color"></Column>
+            </DataTable>
+
+            <DataTable :value="cars" style="margin-bottom: 2rem">
+                <template #header>
+                    Normal Table
+                </template>
+                <Column field="vin" header="Vin"></Column>
+                <Column field="year" header="Year"></Column>
+                <Column field="brand" header="Brand"></Column>
+                <Column field="color" header="Color"></Column>
+            </DataTable>
+
+            <DataTable :value="cars" class="p-datatable-lg">
+                <template #header>
+                    Large Table
+                </template>
+                <Column field="vin" header="Vin"></Column>
+                <Column field="year" header="Year"></Column>
+                <Column field="brand" header="Brand"></Column>
+                <Column field="color" header="Color"></Column>
+            </DataTable>
+		</div>
+
+        <div class="content-section documentation">
+            <TabView>
+                <TabPanel header="Source">
+<CodeHighlight>
+<template v-pre>
+&lt;DataTable :value="cars" class="p-datatable-sm" style="margin-bottom: 2rem"&gt;
+    &lt;template #header&gt;
+        Small Table
+    &lt;/template&gt;
+    &lt;Column field="vin" header="Vin"&gt;&lt;/Column&gt;
+    &lt;Column field="year" header="Year"&gt;&lt;/Column&gt;
+    &lt;Column field="brand" header="Brand"&gt;&lt;/Column&gt;
+    &lt;Column field="color" header="Color"&gt;&lt;/Column&gt;
+&lt;/DataTable&gt;
+
+&lt;DataTable :value="cars" style="margin-bottom: 2rem"&gt;
+    &lt;template #header&gt;
+        Normal Table
+    &lt;/template&gt;
+    &lt;Column field="vin" header="Vin"&gt;&lt;/Column&gt;
+    &lt;Column field="year" header="Year"&gt;&lt;/Column&gt;
+    &lt;Column field="brand" header="Brand"&gt;&lt;/Column&gt;
+    &lt;Column field="color" header="Color"&gt;&lt;/Column&gt;
+&lt;/DataTable&gt;
+
+&lt;DataTable :value="cars" class="p-datatable-lg"&gt;
+    &lt;template #header&gt;
+        Large Table
+    &lt;/template&gt;
+    &lt;Column field="vin" header="Vin"&gt;&lt;/Column&gt;
+    &lt;Column field="year" header="Year"&gt;&lt;/Column&gt;
+    &lt;Column field="brand" header="Brand"&gt;&lt;/Column&gt;
+    &lt;Column field="color" header="Color"&gt;&lt;/Column&gt;
+&lt;/DataTable&gt;
+</template>
+</CodeHighlight>
+
+<CodeHighlight lang="javascript">
+import CarService from '../../service/CarService';
+
+export default {
+    data() {
+        return {
+            cars: null
+        }
+    },
+    carService: null,
+    created() {
+        this.carService = new CarService();
+    },
+    mounted() {
+        this.carService.getCarsSmall().then(data => this.cars = data);
+    }
+}
+</CodeHighlight>
+                </TabPanel>
+            </TabView>
+        </div>
+	</div>
+</template>
+
+<script>
+import CarService from '../../service/CarService';
+import DataTableSubMenu from './DataTableSubMenu';
+
+export default {
+    data() {
+        return {
+            cars: null
+        }
+    },
+    carService: null,
+    created() {
+        this.carService = new CarService();
+    },
+    mounted() {
+        this.carService.getCarsSmall().then(data => this.cars = data);
+    },
+    components: {
+        'DataTableSubMenu': DataTableSubMenu
+    }
+}
+</script>
\ No newline at end of file
diff --git a/src/views/datatable/DataTableSubMenu.vue b/src/views/datatable/DataTableSubMenu.vue
index 1e1ea558b..eff7fd7bc 100755
--- a/src/views/datatable/DataTableSubMenu.vue
+++ b/src/views/datatable/DataTableSubMenu.vue
@@ -5,6 +5,7 @@
             <li><router-link to="/datatable/basic">Basic</router-link></li>
             <li><router-link to="/datatable/dynamiccolumns">Dynamic</router-link></li>
             <li><router-link to="/datatable/templating">Templating</router-link></li>
+            <li><router-link to="/datatable/size">Size</router-link></li>
             <li><router-link to="/datatable/colgroup">ColGroup</router-link></li>
             <li><router-link to="/datatable/paginator">Paginator</router-link></li>
             <li><router-link to="/datatable/sort">Sort</router-link></li>
diff --git a/src/views/inputtext/InputTextDoc.vue b/src/views/inputtext/InputTextDoc.vue
index adcacffa0..156f5d796 100755
--- a/src/views/inputtext/InputTextDoc.vue
+++ b/src/views/inputtext/InputTextDoc.vue
@@ -57,16 +57,24 @@ import InputText from 'primevue/inputtext';
 				<div class="doc-tablewrapper">
 					<table class="doc-table">
 						<thead>
-						<tr>
-							<th>Name</th>
-							<th>Element</th>
-						</tr>
+                            <tr>
+                                <th>Name</th>
+                                <th>Element</th>
+                            </tr>
 						</thead>
 						<tbody>
-						<tr>
-							<td>p-inputtext</td>
-							<td>Input element</td>
-						</tr>
+                            <tr>
+                                <td>p-inputtext</td>
+                                <td>Input element</td>
+                            </tr>
+                            <tr>
+                                <td>p-inputtext-sm</td>
+                                <td>Smaller input element</td>
+                            </tr>
+                            <tr>
+                                <td>p-inputtext-lg</td>
+                                <td>Larger input element</td>
+                            </tr>
 						</tbody>
 					</table>
 				</div>
diff --git a/src/views/treetable/TreeTableDoc.vue b/src/views/treetable/TreeTableDoc.vue
index 9a7dc78b1..f39f2cd42 100755
--- a/src/views/treetable/TreeTableDoc.vue
+++ b/src/views/treetable/TreeTableDoc.vue
@@ -736,6 +736,41 @@ export default {
     &lt;/template&gt;
 &lt;/TreeTable&gt;
 </template>
+</CodeHighlight>
+
+                <h3>Sizes</h3>
+                <p>In addition to the regular table, a smal and a large version are available with different paddings. For a table
+                with smaller paddings use <i>p-treetable-sm</i> class and for a larger one use <i>p-treetable-lg</i>.</p>
+
+<CodeHighlight>
+<template v-pre>
+&lt;TreeTable :value="nodes" class="p-treetable-sm"&gt;
+    &lt;template #header&gt;
+        Small Table
+    &lt;/template&gt;
+    &lt;Column field="name" header="Name" :expander="true"&gt;&lt;/Column&gt;
+    &lt;Column field="size" header="Size"&gt;&lt;/Column&gt;
+    &lt;Column field="type" header="Type"&gt;&lt;/Column&gt;
+&lt;/TreeTable&gt;
+
+&lt;TreeTable :value="nodes"&gt;
+    &lt;template #header&gt;
+        Small Table
+    &lt;/template&gt;
+    &lt;Column field="name" header="Name" :expander="true"&gt;&lt;/Column&gt;
+    &lt;Column field="size" header="Size"&gt;&lt;/Column&gt;
+    &lt;Column field="type" header="Type"&gt;&lt;/Column&gt;
+&lt;/TreeTable&gt;
+
+&lt;TreeTable :value="nodes" class="p-treetable-lg"&gt;
+    &lt;template #header&gt;
+        Small Table
+    &lt;/template&gt;
+    &lt;Column field="name" header="Name" :expander="true"&gt;&lt;/Column&gt;
+    &lt;Column field="size" header="Size"&gt;&lt;/Column&gt;
+    &lt;Column field="type" header="Type"&gt;&lt;/Column&gt;
+&lt;/TreeTable&gt;
+</template>
 </CodeHighlight>
 
                 <h3>Pagination</h3>
diff --git a/src/views/treetable/TreeTableSizeDemo.vue b/src/views/treetable/TreeTableSizeDemo.vue
new file mode 100644
index 000000000..4e281e48c
--- /dev/null
+++ b/src/views/treetable/TreeTableSizeDemo.vue
@@ -0,0 +1,120 @@
+<template>
+    <div>
+        <TreeTableSubMenu />
+
+        <div class="content-section introduction">
+            <div class="feature-intro">
+                <h1>TreeTable - Size</h1>
+                <p>In addition to a regular table, a smaller and a larger alternatives available.</p>
+            </div>
+        </div>
+
+        <div class="content-section implementation">
+            <TreeTable :value="nodes" class="p-treetable-sm" style="margin-bottom: 2rem">
+                <template #header>
+                    Small Table
+                </template>
+                <Column field="name" header="Name" :expander="true"></Column>
+                <Column field="size" header="Size"></Column>
+                <Column field="type" header="Type"></Column>
+            </TreeTable>
+
+            <TreeTable :value="nodes" style="margin-bottom: 2rem">
+                <template #header>
+                    Small Table
+                </template>
+                <Column field="name" header="Name" :expander="true"></Column>
+                <Column field="size" header="Size"></Column>
+                <Column field="type" header="Type"></Column>
+            </TreeTable>
+
+            <TreeTable :value="nodes" class="p-treetable-lg" >
+                <template #header>
+                    Small Table
+                </template>
+                <Column field="name" header="Name" :expander="true"></Column>
+                <Column field="size" header="Size"></Column>
+                <Column field="type" header="Type"></Column>
+            </TreeTable>
+        </div>
+
+        <div class="content-section documentation">
+            <TabView>
+                <TabPanel header="Source">
+<CodeHighlight>
+<template v-pre>
+&lt;TreeTable :value="nodes" class="p-treetable-sm" style="margin-bottom: 2rem"&gt;
+    &lt;template #header&gt;
+        Small Table
+    &lt;/template&gt;
+    &lt;Column field="name" header="Name" :expander="true"&gt;&lt;/Column&gt;
+    &lt;Column field="size" header="Size"&gt;&lt;/Column&gt;
+    &lt;Column field="type" header="Type"&gt;&lt;/Column&gt;
+&lt;/TreeTable&gt;
+
+&lt;TreeTable :value="nodes" style="margin-bottom: 2rem"&gt;
+    &lt;template #header&gt;
+        Small Table
+    &lt;/template&gt;
+    &lt;Column field="name" header="Name" :expander="true"&gt;&lt;/Column&gt;
+    &lt;Column field="size" header="Size"&gt;&lt;/Column&gt;
+    &lt;Column field="type" header="Type"&gt;&lt;/Column&gt;
+&lt;/TreeTable&gt;
+
+&lt;TreeTable :value="nodes" class="p-treetable-lg"&gt;
+    &lt;template #header&gt;
+        Small Table
+    &lt;/template&gt;
+    &lt;Column field="name" header="Name" :expander="true"&gt;&lt;/Column&gt;
+    &lt;Column field="size" header="Size"&gt;&lt;/Column&gt;
+    &lt;Column field="type" header="Type"&gt;&lt;/Column&gt;
+&lt;/TreeTable&gt;
+</template>
+</CodeHighlight>
+
+<CodeHighlight lang="javascript">
+import NodeService from '../../service/NodeService';
+
+export default {
+    data() {
+        return {
+            nodes: null,
+        }
+    },
+    nodeService: null,
+    created() {
+        this.nodeService = new NodeService();
+    },
+    mounted() {
+        this.nodeService.getTreeTableNodes().then(data => this.nodes = data);
+    }
+}
+</CodeHighlight>
+                </TabPanel>
+            </TabView>
+        </div>
+    </div>
+</template>
+
+<script>
+import NodeService from '../../service/NodeService';
+import TreeTableSubMenu from './TreeTableSubMenu';
+
+export default {
+    data() {
+        return {
+            nodes: null,
+        }
+    },
+    nodeService: null,
+    created() {
+        this.nodeService = new NodeService();
+    },
+    mounted() {
+        this.nodeService.getTreeTableNodes().then(data => this.nodes = data);
+    },
+    components: {
+        'TreeTableSubMenu': TreeTableSubMenu
+    }
+}
+</script>
\ No newline at end of file
diff --git a/src/views/treetable/TreeTableSubMenu.vue b/src/views/treetable/TreeTableSubMenu.vue
index 7f371ff2b..366c14efb 100755
--- a/src/views/treetable/TreeTableSubMenu.vue
+++ b/src/views/treetable/TreeTableSubMenu.vue
@@ -3,6 +3,7 @@
         <ul>
             <li><router-link to="/treetable">Documentation</router-link></li>
             <li><router-link to="/treetable/templating">Templating</router-link></li>
+            <li><router-link to="/treetable/size">Size</router-link></li>
             <li><router-link to="/treetable/paginator">Paginator</router-link></li>
             <li><router-link to="/treetable/sort">Sort</router-link></li>
             <li><router-link to="/treetable/filter">Filter</router-link></li>