@recaptime-dev's working patches + fork for Phorge, a community fork of Phabricator. (Upstream dev and stable branches are at upstream/main and upstream/stable respectively.) hq.recaptime.dev/wiki/Phorge
phorge phabricator
1
fork

Configure Feed

Select the types of activity you want to include in your feed.

PHUIImageMaskView: Replace checkerboard image with repeating-conic-gradient CSS

Summary:
Note that this is a trade-off between improved Dark Mode and browser compatibility: Such CSS is only supported since Chrome 69/Opera 56 (09/2018), Firefox 83 (11/2020), Safari 12.1 (03/2019), and Edge 79 (01/2020) according to https://caniuse.com/?search=repeating-conic-gradient. Older browsers will display the `{$page.content}` color instead with no checkerboard pattern.

PHUIImageMaskView seems to only be used to create thumbs in a Pholio context, in `PholioTransactionView` and `PholioInlineController`.

See similar rP03e8c8ab0cdb.

Refs T15056

Test Plan:
* Go to http://phorge.localhost/settings/panel/display/ and set `Accessibility` to `Dark Mode (Experimental)`
* Go to http://phorge.localhost/uiexample/view/PHUIImageMaskExample/
* Optionally, check things in Pholio but I am too lazy for that

Reviewers: O1 Blessed Committers, valerio.bozzolan

Reviewed By: O1 Blessed Committers, valerio.bozzolan

Subscribers: tobiaswiese, valerio.bozzolan, Matthew, Cigaryno

Maniphest Tasks: T15056

Differential Revision: https://we.phorge.it/D26425

+7 -3
+2 -2
resources/celerity/map.php
··· 155 155 'rsrc/css/phui/phui-hovercard.css' => '7ffb4e0c', 156 156 'rsrc/css/phui/phui-icon-set-selector.css' => '19e0253b', 157 157 'rsrc/css/phui/phui-icon.css' => '084ac612', 158 - 'rsrc/css/phui/phui-image-mask.css' => '62c7f4d2', 158 + 'rsrc/css/phui/phui-image-mask.css' => 'aaea005e', 159 159 'rsrc/css/phui/phui-info-view.css' => 'a10a909b', 160 160 'rsrc/css/phui/phui-invisible-character-view.css' => 'c694c4a4', 161 161 'rsrc/css/phui/phui-left-right.css' => '68513c34', ··· 803 803 'phui-hovercard-view-css' => '7ffb4e0c', 804 804 'phui-icon-set-selector-css' => '19e0253b', 805 805 'phui-icon-view-css' => '084ac612', 806 - 'phui-image-mask-css' => '62c7f4d2', 806 + 'phui-image-mask-css' => 'aaea005e', 807 807 'phui-info-view-css' => 'a10a909b', 808 808 'phui-inline-comment-view-css' => '066c3341', 809 809 'phui-invisible-character-view-css' => 'c694c4a4',
+5 -1
webroot/rsrc/css/phui/phui-image-mask.css
··· 4 4 5 5 6 6 .phui-image-mask { 7 - background: url('/rsrc/image/checker_lighter.png'); 7 + /* TODO: Remove static image for old browsers some day; see D26155 */ 8 + background: url('/rsrc/image/checker_light.png'); 9 + background: repeating-conic-gradient( 10 + {$lightgreybackground} 0% 25%, 11 + {$page.content} 0% 50%) 0 0/20px 20px; 8 12 display: inline-block; 9 13 border: 1px solid {$lightblueborder}; 10 14 padding: 4px;