mirror of
https://github.com/zen-browser/theme-store.git
synced 2025-07-07 17:05:31 +02:00
feat: Add support for color themes in theme creation
This commit modifies the theme creation process to include support for color themes. It adds a new checkbox field in the theme creation form to indicate whether the theme is a color theme. If the checkbox is selected, the CSS styles for the theme should be provided as a JSON object with the color values. Additionally, the `create-theme.yml` workflow file is updated to include the `THEME_IS_COLOR_THEME` environment variable when building the theme. The `rebuild-themes.py` script is also updated to generate a `chrome.css` file for color themes based on the provided color values in a `colors.json` file. Fixes #69
This commit is contained in:
parent
6aa221874d
commit
01040237ed
4 changed files with 57 additions and 4 deletions
16
.github/ISSUE_TEMPLATE/create-theme.yml
vendored
16
.github/ISSUE_TEMPLATE/create-theme.yml
vendored
|
@ -33,17 +33,29 @@ body:
|
|||
placeholder: https://...
|
||||
validations:
|
||||
required: true
|
||||
- type: checkbox
|
||||
id: is-color-theme
|
||||
attributes:
|
||||
label: Is Color Theme
|
||||
description: Check this box if the theme is a color theme.
|
||||
- type: textarea
|
||||
id: styles
|
||||
attributes:
|
||||
label: Theme Styles
|
||||
render: css
|
||||
description: The CSS styles for the theme.
|
||||
description: The CSS styles for the theme. If the theme is a color theme, the styles should be a JSON object with the color values.
|
||||
placeholder: |
|
||||
body {
|
||||
background-color: white;
|
||||
color: black;
|
||||
}
|
||||
|
||||
or
|
||||
|
||||
{
|
||||
"primaryColor": "#000000",
|
||||
...
|
||||
}
|
||||
validations:
|
||||
required: true
|
||||
- type: textarea
|
||||
|
@ -59,7 +71,7 @@ body:
|
|||
attributes:
|
||||
render: json
|
||||
label: Preferences
|
||||
description: The preferences for the theme in JSON format. Leave empty if there are no preferences.
|
||||
description: The preferences for the theme in JSON format. Leave empty if there are no preferences. This is not used for color themes.
|
||||
placeholder: |
|
||||
{
|
||||
"uc.my-preference.enable-this": "Enable this feature for the theme",
|
||||
|
|
2
.github/workflows/create-theme.yml
vendored
2
.github/workflows/create-theme.yml
vendored
|
@ -38,6 +38,7 @@ jobs:
|
|||
echo "THEME_HOMEPAGE=${{ fromJson(steps.issue-parser.outputs.jsonString)['homepage'] }}" >> $GITHUB_ENV
|
||||
echo "THEME_IMAGE=${{ fromJson(steps.issue-parser.outputs.jsonString)['image'] }}" >> $GITHUB_ENV
|
||||
echo "THEME_AUTHOR=${{ github.event.issue.user.login }}" >> $GITHUB_ENV
|
||||
echo "THEME_IS_COLOR_THEME=${{ fromJson(steps.issue-parser.outputs.jsonString)['is-color-theme'] }}" >> $GITHUB_ENV
|
||||
|
||||
- name: Write styles to file
|
||||
uses: "DamianReeves/write-file-action@master"
|
||||
|
@ -70,6 +71,7 @@ jobs:
|
|||
--description "${{ env.THEME_DESCRIPTION }}" \
|
||||
--author "${{ env.THEME_AUTHOR }}" \
|
||||
--image "${{ env.THEME_IMAGE }}" \
|
||||
--is-color-theme "${{ env.THEME_IS_COLOR_THEME }}" \
|
||||
--homepage "${{ env.THEME_HOMEPAGE }}" 2> error.log
|
||||
|
||||
- name: Export creation output
|
||||
|
|
|
@ -5,6 +5,32 @@ import json
|
|||
THEMES_FOLDER = './themes'
|
||||
THEMES_DATA_FILE = './themes.json'
|
||||
|
||||
def get_color_css_variable(color):
|
||||
if color == "primaryColor":
|
||||
return '--zen-colors-primary'
|
||||
if color == "secondaryColor":
|
||||
return '--zen-colors-secondary'
|
||||
if color == "tertiaryColor":
|
||||
return '--zen-colors-tertiary'
|
||||
if color == "colorsBorder":
|
||||
return '--zen-colors-border'
|
||||
print(f"Unknown color: {color}")
|
||||
exit(1)
|
||||
|
||||
def write_colors(colors_file, output_file):
|
||||
with open(colors_file, 'r') as f:
|
||||
colors = json.load(f)
|
||||
with open(output_file, 'w') as f:
|
||||
f.write('/* This is a color theme. */\n')
|
||||
f.write(':root {\n')
|
||||
for color in colors:
|
||||
if color == "isDarkMode":
|
||||
continue
|
||||
f.write(f' {get_color_css_variable(color)}: {colors[color]};\n')
|
||||
if colors["isDarkMode"]:
|
||||
f.write(' color-scheme: dark !important;\n')
|
||||
f.write('}\n')
|
||||
|
||||
def main():
|
||||
with open(THEMES_DATA_FILE, 'w') as f:
|
||||
json.dump({}, f, indent=4)
|
||||
|
@ -22,6 +48,10 @@ def main():
|
|||
themes_data[theme] = theme_data
|
||||
with open(THEMES_DATA_FILE, 'w') as f:
|
||||
json.dump(themes_data, f, indent=4)
|
||||
theme_colors_file = os.path.join(theme_folder, 'colors.json')
|
||||
if os.path.exists(theme_colors_file):
|
||||
theme_colors_output = os.path.join(theme_folder, 'chrome.css')
|
||||
write_colors(theme_colors_file, theme_colors_output)
|
||||
print(f"Rebuilt theme: {theme}")
|
||||
print("Rebuilt all themes!")
|
||||
|
||||
|
|
|
@ -8,6 +8,7 @@ import requests
|
|||
import urllib.parse
|
||||
|
||||
STYLES_FILE = "chrome.css"
|
||||
COLORS_FILE = "colors.json"
|
||||
README_FILE = "readme.md"
|
||||
IMAGE_FILE = "image.png"
|
||||
PREFERENCES_FILE = "preferences.json"
|
||||
|
@ -22,11 +23,17 @@ def create_theme_id():
|
|||
def get_static_asset(theme_id, asset):
|
||||
return f"https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/{theme_id}/{asset}"
|
||||
|
||||
def get_styles():
|
||||
def get_styles(is_color_theme, theme_id):
|
||||
with open(TEMPLATE_STYLES_FILE, 'r') as f:
|
||||
content = f.read()
|
||||
content = content[len("```css"):]
|
||||
content = content[:-len("```")]
|
||||
|
||||
# we actually have a JSON file here that needs to be generated
|
||||
if is_color_theme:
|
||||
with open(f"themes/{theme_id}/{COLORS_FILE}", 'w') as f:
|
||||
json.dump(json.loads(content), f, indent=4)
|
||||
return "/* This is a color theme. */"
|
||||
return content
|
||||
|
||||
def get_readme():
|
||||
|
@ -123,6 +130,7 @@ def main():
|
|||
parser.add_argument('--homepage', type=str, help='The homepage of the theme.')
|
||||
parser.add_argument('--author', type=str, help='The author of the theme.')
|
||||
parser.add_argument('--image', type=str, help='The image of the theme.')
|
||||
parser.add_argument('--is-color-theme', action='store_true', help='Whether the theme is a color theme.')
|
||||
args = parser.parse_args()
|
||||
|
||||
name = args.name
|
||||
|
@ -130,6 +138,7 @@ def main():
|
|||
homepage = args.homepage
|
||||
author = args.author
|
||||
image = args.image
|
||||
is_color_theme = args.is_color_theme == True
|
||||
|
||||
validate_name(name)
|
||||
validate_description(description)
|
||||
|
@ -162,7 +171,7 @@ Just joking, you can do whatever you want. You're the boss.
|
|||
os.makedirs(f"themes/{theme_id}")
|
||||
|
||||
with open(f"themes/{theme_id}/{STYLES_FILE}", 'w') as f:
|
||||
f.write(get_styles())
|
||||
f.write(get_styles(is_color_theme, theme_id))
|
||||
|
||||
with open(f"themes/{theme_id}/{README_FILE}", 'w') as f:
|
||||
f.write(get_readme())
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue