Description
Revisions and Commits
Related Objects
- Mentioned In
- 2023 week 49 RC
Wikimania Hackathon 2023 Singapore
Wikimania Hackathon 2023 Singapore
Z5: Phorge (flame)
Next Up
rP7cffe557ac24: Fix hovercard background color when using Dark Mode
D25402: Fix hovercard background color when using Dark Mode
rP17befe9bca5b: Fix source code viewer background color when using Dark Mode in Diffusion
D25396: Fix source code viewer background color when using Dark Mode in Diffusion
D25384: Fix icon background color when using Dark Mode - Mentioned Here
- D25402: Fix hovercard background color when using Dark Mode
D25396: Fix source code viewer background color when using Dark Mode in Diffusion
D25393: Fix answer background color when using Dark Mode in Ponder
D25384: Fix icon background color when using Dark Mode
Event Timeline
Nice
Please put all the screenshots in the description with related checkboxes like
- Fix this:
IMAGE
- Fix that:
IMAGE
So that it's somehow possible to track changes here
Do you want to try to work on this?
If not, maybe in a couple of weeks I can find some spare time
I'll see if I could get to it. Pretty new to this project, so if you could point some fingers to where I can find the dark mode stuff, it would be greatly appreciated. :)
Not quite as bad (it's at least semi-readable) but still fails accessibility guidelines: F281242
I noticed that, when you pick the "Dark Mode" theme, the CSS class phui-theme-blindigo is added to the documents.
The usage seems in this file:
$ grep -R 'phui-theme-blindigo' --include="*.css" webroot/rsrc/css/application/base/phui-theme.css
https://we.phorge.it/source/phorge/browse/master/webroot/rsrc/css/application/base/phui-theme.css
At the moment it just contains 6 CSS rules so I see a wide margin of contribution!
Keep us updated if you make attempts
To be honest you can just try to use the Firefox console and patch the stylesheet on the fly, and then share your rules here (with a description for each rule please). Kind of:
/* Dark Mode: wow bar was unreadable, now darker */ .phui-theme-blindigo .phabricator-main-menu-wow { background: 123; }
etc.
Here is pretty complete list of dark mode fails from the creator himself: https://secure.phabricator.com/T13540
(And I've added the images in the task description for real - just as a better reference)
The evidence that there are unfinished areas in dark mode is in its option, the option reads: Dark Mode (Expirimental). Users may opt into this 'expirimental' dark mode without realizing that there are unreadable areas until they go depper in the sea.
"experimental" means "not really working yet"... When it's fully usable, the "Experimental" label can be removed.
Yeah but I think the "Normal" priority is better than "Low" since we are hackers hating white screens and so that is quite important ihih
Does somebody want to work on this? Maybe in the next week-end I can try to hammer some CSS rules, thanks to the provided feedback :)
Also, I apologize for not completing this, hadn't had much spare time until recently. I will work on this soon.
Yeah bob, feel free to add your nice screenshots in the Task description for more visibility. You are a good minion!
In workboard, when a maniphest's is drag and dropped, available triggers information windows is broken.
Concerning the dashbord's big pannel :
We can imagine several options as illustrated below :
- Option 1 : Keep a gradient that looks like more/less what is currently implemented
--- a/webroot/rsrc/css/phui/object-item/phui-oi-list-view.css +++ b/webroot/rsrc/css/phui/object-item/phui-oi-list-view.css @@ -723,7 +723,11 @@ ul.phui-oi-list-view .phui-oi-selectable .phui-oi-tail { text-align: center; padding: 8px 0; - background: linear-gradient({$lightbluebackground}, #fff 66%, #fff); + background: linear-gradient({$lightbluebackground}, transparent 66%, transparent); }
- Option 2 : Invert the gradient
--- a/webroot/rsrc/css/phui/object-item/phui-oi-list-view.css +++ b/webroot/rsrc/css/phui/object-item/phui-oi-list-view.css @@ -723,7 +723,11 @@ ul.phui-oi-list-view .phui-oi-selectable .phui-oi-tail { text-align: center; padding: 8px 0; - background: linear-gradient({$lightbluebackground}, #fff 66%, #fff); + background: linear-gradient(transparent, {$lightbluebackground}); }
- Option 3 : Remove the gradient
--- a/webroot/rsrc/css/phui/object-item/phui-oi-list-view.css +++ b/webroot/rsrc/css/phui/object-item/phui-oi-list-view.css @@ -723,7 +723,11 @@ ul.phui-oi-list-view .phui-oi-selectable .phui-oi-tail { text-align: center; padding: 8px 0; - background: linear-gradient({$lightbluebackground}, #fff 66%, #fff); }
IMHO, this gradient is not bringing anything there in term of UX since the button is clearly visible whatever the case. That's why so I would vote for option 3 but what's your opinion about that ?
Because there are more and more referenced issues and, because some of them may need further discussion in order to find the best solution, IMHO it may be a good idea to create a sub task for each issue reported isn't it ?