Add ZenGradientGenerator to zen-assets.jar and zen-styles

This commit adds the ZenGradientGenerator module to the zen-assets.jar and zen-styles directories. The ZenGradientGenerator is responsible for generating gradients used in the Zen theme. This addition will enhance the visual appearance of the theme.

src/browser/components/preferences/zen-preferences-links.xhtml

@@ -3,5 +3,9 @@
   rel="stylesheet"
   href="chrome://browser/skin/preferences/zen-preferences.css"
 />
+<link
+  rel="stylesheet"
+  href="chrome://browser/content/zen-styles/zen-gradient-generator.css"
+/>
 <script src="chrome://browser/content/zenThemeModifier.js"/>
 <link rel="localization" href="browser/preferences/zen-preferences.ftl"/>

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

@@ -444,6 +444,7 @@ var gZenLooksAndFeel = {
     var onPreferColorSchemeChange = this.onPreferColorSchemeChange.bind(this);
     window.matchMedia('(prefers-color-scheme: dark)').addListener(onPreferColorSchemeChange);
     this.onPreferColorSchemeChange();
+    this.themePicker = new ZenThemePicker(document.getElementById('zenLooksAndFeelGradientPickerParent'));
     window.addEventListener('unload', () => {
       window.matchMedia('(prefers-color-scheme: dark)').removeListener(onPreferColorSchemeChange);
     });

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

@@ -1,4 +1,5 @@
 <script src="chrome://browser/content/zen-components/ZenThemeBuilder.mjs" defer=""/>
+<script src="chrome://browser/content/zen-components/ZenGradientGenerator.mjs" defer=""/>
 <script src="chrome://browser/content/preferences/zen-settings.js"/>
 <html:template id="template-paneZenLooks">
 <hbox id="zenLooksCategory"
@@ -23,6 +24,8 @@
             preference="zen.theme.toolbar-themed"/>
       </box>
 
+      <hbox id="zenLooksAndFeelGradientPickerParent"></hbox>
+
       <html:div id="ZenDarkThemeStyles">
             <html:h2 data-l10n-id="zen-dark-theme-styles-header"/>
             <description class="description-deemphasized" data-l10n-id="zen-dark-theme-styles-description" />