Make adding themes easier

[kommunarr]

Make adding themes easier

Pull Request Type

• Other - Code Cleanup

Related issue

#5066 (comment)

Description

Summary: When adding a base theme and/or theme color today, there are many different files and CSS rules you have to modify to do that. This eliminates unnecessary instances of that, alongside adding code comments outlining what each section is. There is some reordering of the base themes & their corresponding primary/secondary colors to match their ordering elsewhere in the codebase, so the diff over-represents the magnitude of the change.

Changes (no behavioral changes):

• Adds code commenting to better explain and delineate themes.css sections
• Moves Invidious and YT logo theme logic to be in themes.css as opposed to the ft-share-button.scss file (most contributors don't think to check here, and for good reason)
• Simplifies destructive color collision logic to check for "Red" or "Purple" in theme color name
• Simplifies rules in 3 cases to reduce manual effort & better clarify purpose
• Moves CSS variable declaration to body rule instead of .app rule to allow for base theme rules lower in the themes.css file to have precedence over the initial declaration
• Makes ft-share-button a CSS file instead of an SCSS file

Fixes:

• Fixes Invidious / YT logo colors for Nordic and Dracula base themes
• Fixes missing destructive theme color overrides

Note:

• Uses CSS nesting in one portion (the dark theme Invidious and YT logo styling). See browser support (relevant for unofficial forks).

Testing

• REG: test destructive colors change properly for red theme color and red+purple theme color cases
• REG: test Invidious / YT logos appear properly on any given light or dark theme on the share button (e.g., on a Channel page)
• (Optional) REG: sanity test a light theme, dark theme, and hot pink theme

Desktop

• OS: OpenSUSE
• OS Version: TW

[kommunarr]

I requested a tentative review, but I do want #4805 and #5066 merged first just to minimize frustration for the authors.

[PikachuEXE]

Maybe re-request review (leave a comment) after those are merged? (I will forget this PR in < 5 minutes

[github-actions]

This pull request has conflicts, please resolve those before we can evaluate the pull request.

[kommunarr]

I'm seeing that the authors of PRs #4293 and #4805 are still working on their changes. I'll give it another couple weeks before I move forward with these changes.

Edit: Giving it another two weeks, as the Gruvbox theme PR is close to done.

[github-actions]

Conflicts have been resolved. A maintainer will review the pull request shortly.

[github-actions]

This pull request has conflicts, please resolve those before we can evaluate the pull request.

[github-actions]

Conflicts have been resolved. A maintainer will review the pull request shortly.

[github-actions]

This PR is stale because it has been open 28 days with no activity. Remove stale label or comment or this will be closed in 14 days.

[github-actions]

This pull request has conflicts, please resolve those before we can evaluate the pull request.

[efb4f5ff-1298-471a-8973-3d47447115dc]

I'm seeing that the authors of PRs #4293 and #4805 are still working on their changes. I'll give it another couple weeks before I move forward with these changes.

Edit: Giving it another two weeks, as the Gruvbox theme PR is close to done.

PR seems to be abandoned as it has been stale for more than a month

6 june was the last commit to it and I requested them to look at some unresolved changes at 15 june

[github-actions]

Conflicts have been resolved. A maintainer will review the pull request shortly.

[efb4f5ff-1298-471a-8973-3d47447115dc]

@PikachuEXE @ChunkyProgrammer 👋

[PikachuEXE]

I skipped hot pink theme test, my eyes hurts