chore: Update Zen Browser preferences and styles for vertical tabs layout

src/browser/components/preferences/zen-settings.js

@@ -73,5 +73,15 @@ Preferences.addAll([
     id: "zen.workspaces.enabled",
     type: "bool",
     default: true,
+  },
+  {
+    id: "zen.view.sidebar-expanded.show-button",
+    type: "bool",
+    default: true,
+  },
+  {
+    id: "zen.view.sidebar-expanded",
+    type: "bool",
+    default: true,
   }
 ]);

src/browser/components/preferences/zenLooksAndFeel.inc.xhtml

@@ -42,4 +42,23 @@
             preference="zen.sidebar.enabled"/>
 </groupbox>
 
+<hbox id="zenVerticalTabsCategory"
+      class="subcategory"
+      hidden="true"
+      data-category="paneZenLooks">
+<html:h1 data-l10n-id="zen-vertical-tabs-title"/>
+</hbox>
+
+<groupbox id="zenVerticalTabsGroup" data-category="paneZenLooks" hidden="true" class="highlighting-group">
+      <label><html:h2 data-l10n-id="zen-vertical-tabs-header"/></label>
+      <description class="description-deemphasized" data-l10n-id="zen-vertical-tabs-description" />
+
+      <checkbox id="zenLooksAndFeelShowTabExpandButton"
+            data-l10n-id="zen-vertical-tabs-show-expand-button"
+            preference="zen.view.sidebar-expanded.show-button"/>
+      <checkbox id="zenLooksAndFeelExpandTabsByDefault"
+            data-l10n-id="zen-vertical-tabs-expand-tabs-by-default"
+            preference="zen.view.sidebar-expanded"/>
+</groupbox>
+
 </html:template>