contao-manager
contao-manager copied to clipboard
contao
Darkmode
Multi-Step-Process
To be honest, this would be a multi-step process as most elements of the Contao Manager and package-list have to be touched.
We are talking about changing at least 14 files in the contao/package-list repository and at least 44 files in the contao/contao-manager repository.
I wouldn't feel comfortable to even remotely throw a PR that size at aschempp, unless slowly introducing custom properties within steps, then just adding the color-modes later on.
It shouldn't be just dark-mode but color-modes for A11Y
Imho a way too big change for just a dark-mode. If it's already such a big change, then going for multiple color modes should be the goal.
That also would raise the question if you'd build upon a known framework like bootstrap as many people could help (which already supports mult-color-modes Support and not just one extra dark-mode)
What I am thinking about is color-modes like:
- High contrast (Light/Dark) for bad eyes or a very bright environment
- Color modes for color blindness (Pro-, deuter- and tritanopia)
Where to start?
Either way, this should need to happen in contao/package-list first as the manager is dependent on the styles in there:
https://github.com/contao/package-list/tree/main/src/assets/styles so maybe opening an Issue about introducing custom-properties (that do not break any style) would be better.
Kinda 'annoying' to test
I don't see this happen soon unless there is:
- a good way to test every view and widget without having to click through everything
- enough time to review every style within the changed files (surely just talking about
Who would help and how do you want to review this?
I aso don't know what aschempp would think about this as he'll be the only reviewer here + others would have to know about the custom CSS + it would be easier having an online staging-environment that updates so stuff could get reviewed easily even by others.
I think you're kinda mixing two things here. There's adding a dark mode, like we did in the back end. And there's rewriting the complete Vue app, which would be fun but kinda out of my time scope.
Technically, there's no reason the extension list must be based on the same code as the Manager (or vice versa). It was just quicker and simpler to implement for me. But I'm not sure if anyone wants to create a new mockup for the extension list?
The contao-manager is extending the configuration and styles from the package-list and the package list is part of the manager so this shouldn't be removed imho.
It's not mixing up two things but it's true that rewriting the application that was worked on the past 7 years isn't something that should be done right now.
The package-list is the small part in this, it's the manager that needs to adapt.
I'd suggest to start a PR changing the main styles within the package-list to use custom properties, wdyt @aschempp ? Everything will stay the same, we should go with the multi-step process and implement the invisible changes.
If people like @christianbarkowsky wanna contribute as well and throw in some dark-mode design ideas (colors only) they'd still have some time.
For color modes, it would just affect every background, color, border and box-shadow (I already checked all of the CSS)
would be fun but kinda out of my time scope
That's why I wanna keep it in small PRs and have a plan to not change many files at once.
And the message about using a known framework is about the people wishing for features but not having any clue about the unknown, maybe they'd be able to contribute as well or companies dedicating one of their developers for such a nieche feature that most Devs don't use ;)
The manager is just an UI for people that can't use the command line or don't have shell access.
I would prefer a PR that adds both the light mode (current) properties and the dark mode as well. That shouldn't be too large?
Would just be a lot of files that will be changed (at least 44 that I've found) due to styling the components within the files themselves: https://github.com/contao/contao-manager/blob/360b6e5c1bad050929f1fb47c50d5c9fd6eed3bc/src/components/fragments/BootCheck.vue#L38
Removing the dependency of the styles from the package-list should be part of this as well. If you think that's not too much for you to review, then adding both in one "huge" PR should be possible.
I mixed it up, I meant the contao-manager but that won't need to happen as the package-list will be the first to receive dark-mode ;)