From c7713d3dd1283f158004b50df961042dfecdb64a Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Mon, 20 Nov 2023 10:41:12 +0300
Subject: [PATCH] Fixed #4845 - Sidebar: header templating updates

---
 components/lib/sidebar/BaseSidebar.vue          |  4 ++++
 components/lib/sidebar/Sidebar.d.ts             | 14 ++++++++++++--
 components/lib/sidebar/Sidebar.vue              |  6 +++---
 components/lib/sidebar/style/SidebarStyle.js    |  4 ++--
 public/themes/arya-blue/theme.css               |  4 ++++
 public/themes/arya-green/theme.css              |  4 ++++
 public/themes/arya-orange/theme.css             |  4 ++++
 public/themes/arya-purple/theme.css             |  4 ++++
 public/themes/bootstrap4-dark-blue/theme.css    |  4 ++++
 public/themes/bootstrap4-dark-purple/theme.css  |  4 ++++
 public/themes/bootstrap4-light-blue/theme.css   |  4 ++++
 public/themes/bootstrap4-light-purple/theme.css |  4 ++++
 public/themes/fluent-light/theme.css            |  4 ++++
 public/themes/lara-dark-amber/theme.css         |  4 ++++
 public/themes/lara-dark-blue/theme.css          |  4 ++++
 public/themes/lara-dark-cyan/theme.css          |  4 ++++
 public/themes/lara-dark-indigo/theme.css        |  4 ++++
 public/themes/lara-dark-pink/theme.css          |  4 ++++
 public/themes/lara-dark-purple/theme.css        |  4 ++++
 public/themes/lara-dark-teal/theme.css          |  4 ++++
 public/themes/lara-dark-turquoise/theme.css     |  4 ++++
 public/themes/lara-light-amber/theme.css        |  4 ++++
 public/themes/lara-light-blue/theme.css         |  4 ++++
 public/themes/lara-light-cyan/theme.css         |  4 ++++
 public/themes/lara-light-indigo/theme.css       |  4 ++++
 public/themes/lara-light-pink/theme.css         |  4 ++++
 public/themes/lara-light-purple/theme.css       |  4 ++++
 public/themes/lara-light-teal/theme.css         |  4 ++++
 public/themes/lara-light-turquoise/theme.css    |  4 ++++
 public/themes/luna-amber/theme.css              |  4 ++++
 public/themes/luna-blue/theme.css               |  4 ++++
 public/themes/luna-green/theme.css              |  4 ++++
 public/themes/luna-pink/theme.css               |  4 ++++
 public/themes/md-dark-deeppurple/theme.css      |  4 ++++
 public/themes/md-dark-indigo/theme.css          |  4 ++++
 public/themes/md-light-deeppurple/theme.css     |  4 ++++
 public/themes/md-light-indigo/theme.css         |  4 ++++
 public/themes/mdc-dark-deeppurple/theme.css     |  4 ++++
 public/themes/mdc-dark-indigo/theme.css         |  4 ++++
 public/themes/mdc-light-deeppurple/theme.css    |  4 ++++
 public/themes/mdc-light-indigo/theme.css        |  4 ++++
 public/themes/mira/theme.css                    |  4 ++++
 public/themes/nano/theme.css                    |  4 ++++
 public/themes/nova-accent/theme.css             |  4 ++++
 public/themes/nova-alt/theme.css                |  4 ++++
 public/themes/nova-vue/theme.css                |  4 ++++
 public/themes/nova/theme.css                    |  4 ++++
 public/themes/rhea/theme.css                    |  4 ++++
 public/themes/saga-blue/theme.css               |  4 ++++
 public/themes/saga-green/theme.css              |  4 ++++
 public/themes/saga-orange/theme.css             |  4 ++++
 public/themes/saga-purple/theme.css             |  4 ++++
 public/themes/soho-dark/theme.css               |  4 ++++
 public/themes/soho-light/theme.css              |  4 ++++
 public/themes/tailwind-light/theme.css          |  4 ++++
 public/themes/vela-blue/theme.css               |  4 ++++
 public/themes/vela-green/theme.css              |  4 ++++
 public/themes/vela-orange/theme.css             |  4 ++++
 public/themes/vela-purple/theme.css             |  4 ++++
 public/themes/viva-dark/theme.css               |  4 ++++
 public/themes/viva-light/theme.css              |  4 ++++
 61 files changed, 249 insertions(+), 7 deletions(-)

diff --git a/components/lib/sidebar/BaseSidebar.vue b/components/lib/sidebar/BaseSidebar.vue
index 46dcd8805..f8acee993 100644
--- a/components/lib/sidebar/BaseSidebar.vue
+++ b/components/lib/sidebar/BaseSidebar.vue
@@ -14,6 +14,10 @@ export default {
             type: String,
             default: 'left'
         },
+        header: {
+            type: null,
+            default: null
+        },
         baseZIndex: {
             type: Number,
             default: 0
diff --git a/components/lib/sidebar/Sidebar.d.ts b/components/lib/sidebar/Sidebar.d.ts
index 98205d6de..03ff072de 100755
--- a/components/lib/sidebar/Sidebar.d.ts
+++ b/components/lib/sidebar/Sidebar.d.ts
@@ -54,7 +54,7 @@ export interface SidebarPassThroughOptions {
     /**
      * Used to pass attributes to the header content's DOM element.
      */
-    headerContent?: SidebarPassThroughOptionType;
+    title?: SidebarPassThroughOptionType;
     /**
      * Used to pass attributes to the close button's DOM element.
      */
@@ -114,6 +114,10 @@ export interface SidebarProps {
      * @defaultValue left
      */
     position?: 'left' | 'right' | 'top' | 'bottom' | 'full' | undefined;
+    /**
+     * Title content of the dialog.
+     */
+    header?: string | undefined;
     /**
      * Base zIndex value to use in layering.
      * @defaultValue 0
@@ -176,8 +180,14 @@ export interface SidebarSlots {
     default(): VNode[];
     /**
      * Custom header template.
+     *  @param {Object} scope - header slot's params.
      */
-    header(): VNode[];
+    header(scope: {
+        /**
+         * Style class of the header title
+         */
+        class: any;
+    }): VNode[];
     /**
      * Custom close icon template.
      * @param {Object} scope - close icon slot's params.
diff --git a/components/lib/sidebar/Sidebar.vue b/components/lib/sidebar/Sidebar.vue
index 7d0a27e9d..6653a5e18 100755
--- a/components/lib/sidebar/Sidebar.vue
+++ b/components/lib/sidebar/Sidebar.vue
@@ -6,9 +6,9 @@
                     <slot v-if="$slots.container" name="container" :onClose="hide" :closeCallback="hide"></slot>
                     <template v-else>
                         <div :ref="headerContainerRef" :class="cx('header')" v-bind="ptm('header')">
-                            <div v-if="$slots.header" :class="cx('headerContent')" v-bind="ptm('headerContent')">
-                                <slot name="header"></slot>
-                            </div>
+                            <slot name="header" :class="cx('title')">
+                                <div v-if="header" :class="cx('title')" v-bind="ptm('title')">{{ header }}</div>
+                            </slot>
                             <button v-if="showCloseIcon" :ref="closeButtonRef" v-ripple type="button" :class="cx('closeButton')" :aria-label="closeAriaLabel" @click="hide" v-bind="ptm('closeButton')" data-pc-group-section="iconcontainer">
                                 <slot name="closeicon" :class="cx('closeIcon')">
                                     <component :is="closeIcon ? 'span' : 'TimesIcon'" :class="[cx('closeIcon'), closeIcon]" v-bind="ptm('closeIcon')"></component>
diff --git a/components/lib/sidebar/style/SidebarStyle.js b/components/lib/sidebar/style/SidebarStyle.js
index 79a6e3d3b..2560593d9 100644
--- a/components/lib/sidebar/style/SidebarStyle.js
+++ b/components/lib/sidebar/style/SidebarStyle.js
@@ -34,7 +34,7 @@ const css = `
     .p-sidebar-header {
         display: flex;
         align-items: center;
-        justify-content: flex-end;
+        justify-content: space-between;
         flex-shrink: 0;
     }
 
@@ -191,7 +191,7 @@ const classes = {
         }
     ],
     header: 'p-sidebar-header',
-    headerContent: 'p-sidebar-header-content',
+    title: 'p-sidebar-header-content',
     closeButton: 'p-sidebar-close p-sidebar-icon p-link',
     closeIcon: 'p-sidebar-close-icon',
     content: 'p-sidebar-content'
diff --git a/public/themes/arya-blue/theme.css b/public/themes/arya-blue/theme.css
index 68c1a3e2c..548cbdaba 100644
--- a/public/themes/arya-blue/theme.css
+++ b/public/themes/arya-blue/theme.css
@@ -4030,6 +4030,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/arya-green/theme.css b/public/themes/arya-green/theme.css
index d57066ee1..19568bdb4 100644
--- a/public/themes/arya-green/theme.css
+++ b/public/themes/arya-green/theme.css
@@ -4030,6 +4030,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/arya-orange/theme.css b/public/themes/arya-orange/theme.css
index 3acfca522..5e36becfc 100644
--- a/public/themes/arya-orange/theme.css
+++ b/public/themes/arya-orange/theme.css
@@ -4030,6 +4030,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/arya-purple/theme.css b/public/themes/arya-purple/theme.css
index 56f812d39..b29a50759 100644
--- a/public/themes/arya-purple/theme.css
+++ b/public/themes/arya-purple/theme.css
@@ -4030,6 +4030,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/bootstrap4-dark-blue/theme.css b/public/themes/bootstrap4-dark-blue/theme.css
index 3bb41db51..7cd8c9b1a 100644
--- a/public/themes/bootstrap4-dark-blue/theme.css
+++ b/public/themes/bootstrap4-dark-blue/theme.css
@@ -4042,6 +4042,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/bootstrap4-dark-purple/theme.css b/public/themes/bootstrap4-dark-purple/theme.css
index 4adc5b685..8a360a9ef 100644
--- a/public/themes/bootstrap4-dark-purple/theme.css
+++ b/public/themes/bootstrap4-dark-purple/theme.css
@@ -4042,6 +4042,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/bootstrap4-light-blue/theme.css b/public/themes/bootstrap4-light-blue/theme.css
index 433298bc3..7e5125716 100644
--- a/public/themes/bootstrap4-light-blue/theme.css
+++ b/public/themes/bootstrap4-light-blue/theme.css
@@ -4042,6 +4042,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/bootstrap4-light-purple/theme.css b/public/themes/bootstrap4-light-purple/theme.css
index 06faf90b4..9cea84eef 100644
--- a/public/themes/bootstrap4-light-purple/theme.css
+++ b/public/themes/bootstrap4-light-purple/theme.css
@@ -4042,6 +4042,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/fluent-light/theme.css b/public/themes/fluent-light/theme.css
index e9e1e14e2..a34362d0d 100644
--- a/public/themes/fluent-light/theme.css
+++ b/public/themes/fluent-light/theme.css
@@ -4005,6 +4005,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.5rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-dark-amber/theme.css b/public/themes/lara-dark-amber/theme.css
index 157abf184..64835b00e 100644
--- a/public/themes/lara-dark-amber/theme.css
+++ b/public/themes/lara-dark-amber/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-dark-blue/theme.css b/public/themes/lara-dark-blue/theme.css
index 3457c8f0b..98e02a637 100644
--- a/public/themes/lara-dark-blue/theme.css
+++ b/public/themes/lara-dark-blue/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-dark-cyan/theme.css b/public/themes/lara-dark-cyan/theme.css
index 4e814ed79..6dd23baea 100644
--- a/public/themes/lara-dark-cyan/theme.css
+++ b/public/themes/lara-dark-cyan/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-dark-indigo/theme.css b/public/themes/lara-dark-indigo/theme.css
index cdecd9780..59b5e7d75 100644
--- a/public/themes/lara-dark-indigo/theme.css
+++ b/public/themes/lara-dark-indigo/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-dark-pink/theme.css b/public/themes/lara-dark-pink/theme.css
index 37771ae44..b49fa9848 100644
--- a/public/themes/lara-dark-pink/theme.css
+++ b/public/themes/lara-dark-pink/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-dark-purple/theme.css b/public/themes/lara-dark-purple/theme.css
index 624bd2a9e..6c32e66cc 100644
--- a/public/themes/lara-dark-purple/theme.css
+++ b/public/themes/lara-dark-purple/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-dark-teal/theme.css b/public/themes/lara-dark-teal/theme.css
index caf2ef73f..11eee2e7f 100644
--- a/public/themes/lara-dark-teal/theme.css
+++ b/public/themes/lara-dark-teal/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-dark-turquoise/theme.css b/public/themes/lara-dark-turquoise/theme.css
index e721432a5..64d69a835 100644
--- a/public/themes/lara-dark-turquoise/theme.css
+++ b/public/themes/lara-dark-turquoise/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-light-amber/theme.css b/public/themes/lara-light-amber/theme.css
index 1face423e..c8acd3390 100644
--- a/public/themes/lara-light-amber/theme.css
+++ b/public/themes/lara-light-amber/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-light-blue/theme.css b/public/themes/lara-light-blue/theme.css
index 21da7ef75..5eb72c788 100644
--- a/public/themes/lara-light-blue/theme.css
+++ b/public/themes/lara-light-blue/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-light-cyan/theme.css b/public/themes/lara-light-cyan/theme.css
index 930400394..f4a988a6e 100644
--- a/public/themes/lara-light-cyan/theme.css
+++ b/public/themes/lara-light-cyan/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-light-indigo/theme.css b/public/themes/lara-light-indigo/theme.css
index 83179d581..48370c954 100644
--- a/public/themes/lara-light-indigo/theme.css
+++ b/public/themes/lara-light-indigo/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-light-pink/theme.css b/public/themes/lara-light-pink/theme.css
index 166b4cb7f..11e05a01e 100644
--- a/public/themes/lara-light-pink/theme.css
+++ b/public/themes/lara-light-pink/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-light-purple/theme.css b/public/themes/lara-light-purple/theme.css
index d2f6e9856..179f7963d 100644
--- a/public/themes/lara-light-purple/theme.css
+++ b/public/themes/lara-light-purple/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-light-teal/theme.css b/public/themes/lara-light-teal/theme.css
index 1167dbc6c..0d6d982c2 100644
--- a/public/themes/lara-light-teal/theme.css
+++ b/public/themes/lara-light-teal/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/lara-light-turquoise/theme.css b/public/themes/lara-light-turquoise/theme.css
index 06ae8e630..321c32ce9 100644
--- a/public/themes/lara-light-turquoise/theme.css
+++ b/public/themes/lara-light-turquoise/theme.css
@@ -4024,6 +4024,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/luna-amber/theme.css b/public/themes/luna-amber/theme.css
index 1de0a8b44..ec1c24a28 100644
--- a/public/themes/luna-amber/theme.css
+++ b/public/themes/luna-amber/theme.css
@@ -4017,6 +4017,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 0.857rem 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/luna-blue/theme.css b/public/themes/luna-blue/theme.css
index 3ca18eabb..b4cfefc0c 100644
--- a/public/themes/luna-blue/theme.css
+++ b/public/themes/luna-blue/theme.css
@@ -4017,6 +4017,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 0.857rem 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/luna-green/theme.css b/public/themes/luna-green/theme.css
index 59a529103..b7308b65e 100644
--- a/public/themes/luna-green/theme.css
+++ b/public/themes/luna-green/theme.css
@@ -4017,6 +4017,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 0.857rem 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/luna-pink/theme.css b/public/themes/luna-pink/theme.css
index 5e6103a31..8480a302b 100644
--- a/public/themes/luna-pink/theme.css
+++ b/public/themes/luna-pink/theme.css
@@ -4017,6 +4017,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 0.857rem 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/md-dark-deeppurple/theme.css b/public/themes/md-dark-deeppurple/theme.css
index 62a1f424f..0503966d6 100644
--- a/public/themes/md-dark-deeppurple/theme.css
+++ b/public/themes/md-dark-deeppurple/theme.css
@@ -4054,6 +4054,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 500;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2.5rem;
diff --git a/public/themes/md-dark-indigo/theme.css b/public/themes/md-dark-indigo/theme.css
index d13f5a2b8..a7f6a8d85 100644
--- a/public/themes/md-dark-indigo/theme.css
+++ b/public/themes/md-dark-indigo/theme.css
@@ -4054,6 +4054,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 500;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2.5rem;
diff --git a/public/themes/md-light-deeppurple/theme.css b/public/themes/md-light-deeppurple/theme.css
index b09e144d4..e69129eed 100644
--- a/public/themes/md-light-deeppurple/theme.css
+++ b/public/themes/md-light-deeppurple/theme.css
@@ -4054,6 +4054,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 500;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2.5rem;
diff --git a/public/themes/md-light-indigo/theme.css b/public/themes/md-light-indigo/theme.css
index ca37d4be5..c3f6beae2 100644
--- a/public/themes/md-light-indigo/theme.css
+++ b/public/themes/md-light-indigo/theme.css
@@ -4054,6 +4054,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 500;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2.5rem;
diff --git a/public/themes/mdc-dark-deeppurple/theme.css b/public/themes/mdc-dark-deeppurple/theme.css
index eb9ffebc9..374385caa 100644
--- a/public/themes/mdc-dark-deeppurple/theme.css
+++ b/public/themes/mdc-dark-deeppurple/theme.css
@@ -4054,6 +4054,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 0.75rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 500;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/mdc-dark-indigo/theme.css b/public/themes/mdc-dark-indigo/theme.css
index 2c1f3fc9d..dc062e705 100644
--- a/public/themes/mdc-dark-indigo/theme.css
+++ b/public/themes/mdc-dark-indigo/theme.css
@@ -4054,6 +4054,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 0.75rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 500;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/mdc-light-deeppurple/theme.css b/public/themes/mdc-light-deeppurple/theme.css
index c8509b8fb..55cf1e72c 100644
--- a/public/themes/mdc-light-deeppurple/theme.css
+++ b/public/themes/mdc-light-deeppurple/theme.css
@@ -4054,6 +4054,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 0.75rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 500;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/mdc-light-indigo/theme.css b/public/themes/mdc-light-indigo/theme.css
index 789d52308..cb98724c8 100644
--- a/public/themes/mdc-light-indigo/theme.css
+++ b/public/themes/mdc-light-indigo/theme.css
@@ -4054,6 +4054,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 0.75rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 500;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/mira/theme.css b/public/themes/mira/theme.css
index 07d9cefec..db870df66 100644
--- a/public/themes/mira/theme.css
+++ b/public/themes/mira/theme.css
@@ -4058,6 +4058,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/nano/theme.css b/public/themes/nano/theme.css
index 4643e2062..99e6a4d9c 100644
--- a/public/themes/nano/theme.css
+++ b/public/themes/nano/theme.css
@@ -4030,6 +4030,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 0.75rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 1rem;
diff --git a/public/themes/nova-accent/theme.css b/public/themes/nova-accent/theme.css
index 1175709ae..7f4509fa6 100644
--- a/public/themes/nova-accent/theme.css
+++ b/public/themes/nova-accent/theme.css
@@ -4005,6 +4005,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 0.857rem 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/nova-alt/theme.css b/public/themes/nova-alt/theme.css
index abba75bad..d56cb5691 100644
--- a/public/themes/nova-alt/theme.css
+++ b/public/themes/nova-alt/theme.css
@@ -4017,6 +4017,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 0.857rem 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/nova-vue/theme.css b/public/themes/nova-vue/theme.css
index bfb4fcbe3..d60e3e66e 100644
--- a/public/themes/nova-vue/theme.css
+++ b/public/themes/nova-vue/theme.css
@@ -4017,6 +4017,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 0.857rem 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/nova/theme.css b/public/themes/nova/theme.css
index 3246c7ccd..ff550f8d3 100644
--- a/public/themes/nova/theme.css
+++ b/public/themes/nova/theme.css
@@ -4017,6 +4017,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 0.857rem 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/rhea/theme.css b/public/themes/rhea/theme.css
index 07c8d2734..6662ac49f 100644
--- a/public/themes/rhea/theme.css
+++ b/public/themes/rhea/theme.css
@@ -4005,6 +4005,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 0.857rem 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/saga-blue/theme.css b/public/themes/saga-blue/theme.css
index 7ceca0865..d34eaa018 100644
--- a/public/themes/saga-blue/theme.css
+++ b/public/themes/saga-blue/theme.css
@@ -4030,6 +4030,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/saga-green/theme.css b/public/themes/saga-green/theme.css
index d22c85931..a54e4c82f 100644
--- a/public/themes/saga-green/theme.css
+++ b/public/themes/saga-green/theme.css
@@ -4030,6 +4030,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/saga-orange/theme.css b/public/themes/saga-orange/theme.css
index a5d3c0b15..0a949b065 100644
--- a/public/themes/saga-orange/theme.css
+++ b/public/themes/saga-orange/theme.css
@@ -4030,6 +4030,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/saga-purple/theme.css b/public/themes/saga-purple/theme.css
index da36f1919..fee768023 100644
--- a/public/themes/saga-purple/theme.css
+++ b/public/themes/saga-purple/theme.css
@@ -4030,6 +4030,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/soho-dark/theme.css b/public/themes/soho-dark/theme.css
index b6c7f2ff7..125b9239f 100644
--- a/public/themes/soho-dark/theme.css
+++ b/public/themes/soho-dark/theme.css
@@ -4029,6 +4029,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/soho-light/theme.css b/public/themes/soho-light/theme.css
index d9a645897..60cd8f0bc 100644
--- a/public/themes/soho-light/theme.css
+++ b/public/themes/soho-light/theme.css
@@ -4029,6 +4029,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 700;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/tailwind-light/theme.css b/public/themes/tailwind-light/theme.css
index d649799fa..757fd5a67 100644
--- a/public/themes/tailwind-light/theme.css
+++ b/public/themes/tailwind-light/theme.css
@@ -4065,6 +4065,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1.25rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.5rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/vela-blue/theme.css b/public/themes/vela-blue/theme.css
index a1d2f95aa..ac3c98bd7 100644
--- a/public/themes/vela-blue/theme.css
+++ b/public/themes/vela-blue/theme.css
@@ -4030,6 +4030,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/vela-green/theme.css b/public/themes/vela-green/theme.css
index 6fe61402f..99ab3b235 100644
--- a/public/themes/vela-green/theme.css
+++ b/public/themes/vela-green/theme.css
@@ -4030,6 +4030,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/vela-orange/theme.css b/public/themes/vela-orange/theme.css
index 32ea1cd83..a561f9686 100644
--- a/public/themes/vela-orange/theme.css
+++ b/public/themes/vela-orange/theme.css
@@ -4030,6 +4030,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/vela-purple/theme.css b/public/themes/vela-purple/theme.css
index d4cd3868e..9a9937ab9 100644
--- a/public/themes/vela-purple/theme.css
+++ b/public/themes/vela-purple/theme.css
@@ -4030,6 +4030,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/viva-dark/theme.css b/public/themes/viva-dark/theme.css
index f2748a6d1..adb880d3f 100644
--- a/public/themes/viva-dark/theme.css
+++ b/public/themes/viva-dark/theme.css
@@ -4062,6 +4062,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;
diff --git a/public/themes/viva-light/theme.css b/public/themes/viva-light/theme.css
index 22a847059..9f57deb04 100644
--- a/public/themes/viva-light/theme.css
+++ b/public/themes/viva-light/theme.css
@@ -4062,6 +4062,10 @@
   .p-sidebar .p-sidebar-header {
     padding: 1rem;
   }
+  .p-sidebar .p-sidebar-header .p-sidebar-header-content {
+    font-weight: 600;
+    font-size: 1.25rem;
+  }
   .p-sidebar .p-sidebar-header .p-sidebar-close,
 .p-sidebar .p-sidebar-header .p-sidebar-icon {
     width: 2rem;