Adding Zen Browser matugen template

[johngalt]

With Zen browser no longer working correctly with Pywalfox, I decided to use matugen to create a userChrome.css file to theme the browser. I used matugen color properties as well as dank16 ones for profile colors. Upon my testing on several themes with both dark/light variants, it does appear to look decent.

The tricky part with utilizing this for the end user will be automatically placing the generated userChrome.css file in the correct location. Similarly to Firefox, the file is stored in the profile folder (which has a random hash in the name), so it can't really be done globally. For example, when doing this with my own matugen template, I did the following:

[templates.zen]
input_path = '/home/johngalt/.config/matugen/themes/dankzen.css'
output_path = '/home/johngalt/.zen/htqcmbyj.Default Profile/chrome/userChrome.css'

The default profile name is random, so we can't just assume this location for all users like we would other themes. For this PR, I opted to place the generated file in the ~/.cache/dms/ folder. My thought was that if someone wanted to utilize the DMS theme for Zen, they could then create a symbolic link from this file to their Zen profile folder: dank-zenbrowser.css -> userChrome.css.

If this is too cumbersome or seems too involved to add, that's fine. Just figured I'd offer it up since I spent some time making the template.

[johngalt]

I think this PR is ready for review. Since I opened the draft, I have tweaked the CSS file for more appropriate use of the color palette from different themes. I also removed several CSS elements that don't appear to be used by Zen anymore. The theming ability of Zen has drifted considerably from how its handled in Firefox (which is why pywalfox no longer works). I have drafted some documentation that could be included in the Application Theming section of the docs page as well:

Zen Browser

In more recent updates, Zen Browser has changed the way theming is handled. You can no longer use Pywalfox or Firefox extensions to control most elements of the browser theme. The browser theme is controlled mostly through CSS elements in the userChrome.css file located within the uses profile directory. This file does not exist by default.

When you have Zen installed, DMS will dynamically generate a theme file for you to use. Because the Zen profile directory contains a random hash, we cannot place the file in your profile directory. Instead it is generated within the DankMaterialShell config directory (~/.config/DankMaterialShell/zen.css). You can then link this file to where it belongs in your Zen configuration directory (/.zen/<random-hash>.<profile name>/chrome/userChrome.css). Note: the /chrome/ folder may not exist by default and may need to be created. Here is an example command on how to link the file:

# Find default profile directory
export PROFILE_DIR=$(find ~/.zen -maxdepth 1 -type d -name "*.Default Profile" | head -n 1)
mkdir -p $PROFILE_DIR/chrome
ln -sf ~/.config/DankMaterialShell/zen.css "$PROFILE_DIR/chrome/userChrome.css"

Note: live reloading of the file on theme change doesn't work and requires a browser restart.

[LoayGhreeb]

Is zen the correct binary name? I'm using zen-browser-bin and I have it zen-browser.

Suggested change

	appendConfig(opts, cfgFile, "zen", "zenbrowser.toml")
	appendConfig(opts, cfgFile, "zen-browser", "zenbrowser.toml")

[johngalt]

Hmm didn't realize that the AUR zen had a different binary name. In my install on NixOS I had it compiled out to zen. I'll have to see if we can match either binary names.