update

.app/astro/src/components/sidebar.astro

@@ -21,7 +21,7 @@ const AllTabs = await Astro.glob('../../../../content/tabs/*')
         </div>
     </div>
     <div class:list={['sidebar-tabs', 'sidebar-layout-' + sidebar.tabPositions]}>
-        {tabs.customOrder ?
+        {sidebar.customOrder ?
             null
         :
             AllTabs.map((tab) =>
@@ -34,6 +34,7 @@ const AllTabs = await Astro.glob('../../../../content/tabs/*')
     </div>
 </sidebar>
 
+<!-- Sidebar Tab Configuration, see "configuration.ts"  -->
 <style define:vars={{ tabFontSize, tabVerticalPadding }}>
     tab {
         font-size: var(--tabFontSize);
@@ -42,6 +43,7 @@ const AllTabs = await Astro.glob('../../../../content/tabs/*')
     }
 </style>
 
+<!-- Function for Sidebar Toggle -->
 <script is:raw>
     function CompactTheSideBar() {
         document.querySelector('sidebar').setAttribute('class', 'sidebar-size-compact')

configuration.ts

@@ -1,6 +1,7 @@
 ///////////////////////
 //     Metadata      //
 ///////////////////////
+// Doc: INSERT_DOC_LINK_HERE
 export const info = {
     // Basics
     name: 'App Name Here',
@@ -21,6 +22,7 @@ export const info = {
 ////////////////////////////////
 //     App Configuration      //
 ////////////////////////////////
+// Doc: INSERT_DOC_LINK_HERE
 export const config = {
     // Notifications
     notificationType: "Native", // "Custom" "Native"
@@ -42,21 +44,27 @@ export const window = {
 //////////////////////
 //     Sidebar      //
 //////////////////////
-export const tabs = {
-    customOrder: false,
-}
+// Doc: INSERT_DOC_LINK_HERE
+// Use this if you want to use a custom order of tabs
+export const tabs = {}
 
 ////////////////////
 //     Theme      //
 ////////////////////
+// Doc: INSERT_DOC_LINK_HERE
 export const sidebar = {
-    headerFontSize: "14px",
-    tabFontSize: "16px",
-    tabVerticalPadding: "12px",
     tabPositions: "normal", // "normal" "centered"
     size: "normal", // "normal" "compact"
+
+    // Sidebar Header
+    headerFontSize: "14px",
     enableBells: false,
     enableToggle: true,
+
+    // Tabs
+    customOrder: false,
+    tabFontSize: "16px",
+    tabVerticalPadding: "12px",
 }
 
 export const splash = {
@@ -67,6 +75,7 @@ export const splash = {
 ///////////////////////////////
 //     Electron Builder      //
 ///////////////////////////////
+// Doc: INSERT_DOC_LINK_HERE
 export const update = {
     channel: "latest", // Branch: "latest" "beta" "alpha"
     url: '' // Point to url where build files will be stored on your server.

content/tabs/second-tab.astro

@@ -0,0 +1,4 @@
+---
+export const name = 'Second Tab'
+export const icon = '2'
+---

content/tabs/third-tab.astro

@@ -0,0 +1,4 @@
+---
+export const name = 'Third Tab'
+export const icon = '3'
+---