[create-theme]: Custom Statusbar

[Archer7x]

Name

Custom Statusbar

Description

This Mod allows you to adjust the rounding, margin, border thickness and any color of the statusbar.

Homepage

https://github.com/Archer7x/Zen-Themes/tree/main/CustomStatusbar

Image

https://github.com/Archer7x/Zen-Themes/blob/main/CustomStatusbar/image.png?raw=true

Type

• JSON Color Theme

Theme Styles

#statuspanel {
  margin: var(--theme-customstatusbar-margin) !important;
}

#statuspanel-label {
  border-radius: var(--theme-customstatusbar-radius) !important;
  padding: 2px 10px !important;
  border: var(--theme-customstatusbar-border_thickness) solid var(--theme-customstatusbar-color_border) !important;
  background: var(--theme-customstatusbar-color_background) !important;
  color: var(--theme-customstatusbar-text_color) !important; /* Text color */
}

Readme

# Usage example
  - You can customize the margin: "8px"
  - You can customize the edgerounding: "100px"
  - You can customize the border-thickness "1px"
  - You can customize the text, boder and background color: "#0e03ad"

## Custom colors
You can use HEX: "#0e03ad"

If you want transparency use rgba: "rgba(138, 8, 203, 0.5)"

You can even use a color gradiant [tool](https://cssgradient.io/) like this: "linear-gradient(45deg, rgba(7,27,120,1) 0%, rgba(125,15,200,1) 100%)"

You can also use your theme colors: "var(--zen-colors-border)"

Do not enter >""< just inside >#0e03ad<

## Settings (checkbox in Zens Mod settings):
  - Set the margin (default "8px")
  - Set the edgerounding (default "100px")
  - Set the border-thickness (default "1px")
  - Set the text-color (default "var(--lwt-text-color)")
  - Set the border-color (default "var(--zen-colors-border)")
  - Set the background-color (default "var(--zen-colors-tertiary)")

Preferences

[
    {
        "property": "theme.customstatusbar.radius",
        "label": "Round the corners. (default: 1000px)",
        "type": "string",
        "defaultValue": "1000px",
        "placeholder": "1000px",
        "disabledOn": []
    },
    {
        "property": "theme.customstatusbar.margin",
        "label": "Set the margin. (default: 8px)",
        "type": "string",
        "defaultValue": "8px",
        "placeholder": "8px",
        "disabledOn": []
    },
    {
        "property": "theme.customstatusbar.border_thickness",
        "label": "Set the thickness of the border. '2px'",
        "type": "string",
        "defaultValue": "2px",
        "placeholder": "2px",
        "disabledOn": []
    },
    {
        "property": "theme.customstatusbar.color_border",
        "label": "Set the border color. '#0e03ad' or 'var(--zen-colors-border)'",
        "type": "string",
        "defaultValue": "var(--zen-colors-border)",
        "placeholder": "var(--zen-colors-border)",
        "disabledOn": []
    },
    {
        "property": "theme.customstatusbar.color_background",
        "label": "Set the background color. '#a403ad' or 'var(--zen-colors-tertiary)'",
        "type": "string",
        "defaultValue": "var(--zen-colors-tertiary)",
        "placeholder": "var(--zen-colors-tertiary)",
        "disabledOn": []
    },
    {
        "property": "theme.customstatusbar.text_color",
        "label": "Set the text color. '#a403ad' or 'var(--lwt-text-color)'",
        "type": "string",
        "defaultValue": "var(--lwt-text-color)",
        "placeholder": "var(--lwt-text-color)",
        "disabledOn": []
    }
]

[github-actions]

Thank you for your contribution! 🎉

Your theme has been successfully submitted. The maintainers will review it and get back to you soon.

Here are some details about your submission:

• Your theme has been requested into this PR.
• It has been created into the create-theme-801 branch.

If you have any questions or need help, feel free to ask in the comments below or in the PR.