Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Convert all non-RGBA colors to RGBA colors #11447

Merged

Conversation

timvandermeij
Copy link
Contributor

@timvandermeij timvandermeij commented Dec 25, 2019

In our usage instructions for the viewer we state the following:

We do ask if you plan to embed the viewer in your own site, that it not just be an unmodified version. Please re-skin it or build upon it.

Users have indicated that this is currently quite hard because we use no less than seven different ways to specify colors in CSS, namely RGB, RGBA, HSL, HSLA, three-digit HEX, six-digit HEX and named, leading to 83 unique color specifications.

This commit series simplifies our color specifications across the entire code base, but in particular in web/viewer.css, to specify all colors in RGBA instead. The choice for RGBA is because RGB is well-known for web development and because we need to be able to express opacity (alpha channel) in the color specification. Doing so brings down the number of unique color specifications to 70. This should be acceptable now because quite a few of the unique color specifications are actually opacity variations on the same color, and given that all colors are now in the same format, using find/replace is now possible, making the re-skinning task a lot easier.

Fixes #11372.

web/viewer.css Outdated Show resolved Hide resolved
@timvandermeij
Copy link
Contributor Author

/botio-linux preview

@mozilla mozilla deleted a comment from pdfjsbot Dec 28, 2019
@mozilla mozilla deleted a comment from pdfjsbot Dec 28, 2019
@timvandermeij
Copy link
Contributor Author

/botio-linux preview

Copy link
Collaborator

@Snuffleupagus Snuffleupagus left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sorry, but I've spotted at least one more conversion error here :-P

Please note that I've not checked all values, but I rather just picked a couple at random with the devtools until I stumbled onto a broken one.

Just of of curiosity, how did you convert these values (since unless it's fully scripted, the risk of mistakes makes me a bit wary of these types of changes)?

web/viewer.css Outdated Show resolved Hide resolved
@mozilla mozilla deleted a comment from pdfjsbot Dec 30, 2019
@mozilla mozilla deleted a comment from pdfjsbot Dec 30, 2019
@timvandermeij
Copy link
Contributor Author

/botio-linux preview

@pdfjsbot
Copy link

From: Bot.io (Linux m4)


Received

Command cmd_preview from @timvandermeij received. Current queue size: 0

Live output at: http://54.67.70.0:8877/ea04c595d195ba9/output.txt

@pdfjsbot
Copy link

From: Bot.io (Linux m4)


Success

Full output at http://54.67.70.0:8877/ea04c595d195ba9/output.txt

Total script time: 1.73 mins

Published

Copy link
Collaborator

@Snuffleupagus Snuffleupagus left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sorry, but I have just a few small comments after going through these patches line-by-line.

Furthermore, these patches seem to be missing https://github.com/mozilla/pdf.js/blob/master/test/annotation_layer_builder_overrides.css and please also check https://github.com/mozilla/pdf.js/blob/master/test/text_layer_test.css (although that one seems OK).

web/viewer.css Outdated Show resolved Hide resolved
web/viewer.css Show resolved Hide resolved
web/viewer.css Outdated Show resolved Hide resolved
This is not only useful to have one format for consistency, but also to
be able to quickly search for colors for e.g., finding duplicates or
when tweaking the CSS for custom deployments.
@timvandermeij
Copy link
Contributor Author

I have also checked the other CSS files. The first one required some changes which are combined in the "three-digit HEX" commit and the last one didn't require changes.

@timvandermeij
Copy link
Contributor Author

/botio-linux preview

@pdfjsbot
Copy link

pdfjsbot commented Jan 1, 2020

From: Bot.io (Linux m4)


Received

Command cmd_preview from @timvandermeij received. Current queue size: 0

Live output at: http://54.67.70.0:8877/98fd35d6d4343a4/output.txt

@pdfjsbot
Copy link

pdfjsbot commented Jan 1, 2020

From: Bot.io (Linux m4)


Success

Full output at http://54.67.70.0:8877/98fd35d6d4343a4/output.txt

Total script time: 1.73 mins

Published

@timvandermeij
Copy link
Contributor Author

/botio test

@pdfjsbot
Copy link

pdfjsbot commented Jan 1, 2020

From: Bot.io (Linux m4)


Received

Command cmd_test from @timvandermeij received. Current queue size: 0

Live output at: http://54.67.70.0:8877/41645b9ce919803/output.txt

@pdfjsbot
Copy link

pdfjsbot commented Jan 1, 2020

From: Bot.io (Windows)


Received

Command cmd_test from @timvandermeij received. Current queue size: 0

Live output at: http://54.215.176.217:8877/abef469748c3107/output.txt

@pdfjsbot
Copy link

pdfjsbot commented Jan 1, 2020

From: Bot.io (Linux m4)


Success

Full output at http://54.67.70.0:8877/41645b9ce919803/output.txt

Total script time: 18.86 mins

  • Font tests: Passed
  • Unit tests: Passed
  • Regression tests: Passed

@pdfjsbot
Copy link

pdfjsbot commented Jan 1, 2020

From: Bot.io (Windows)


Success

Full output at http://54.215.176.217:8877/abef469748c3107/output.txt

Total script time: 25.62 mins

  • Font tests: Passed
  • Unit tests: Passed
  • Regression tests: Passed

Copy link
Collaborator

@Snuffleupagus Snuffleupagus left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me now; thanks for bringing some much needed consistency to this part of the code-base.

Also, sorry about the back-and-forth here during review!

@timvandermeij timvandermeij merged commit 10716aa into mozilla:master Jan 1, 2020
@timvandermeij timvandermeij deleted the css-color-simplifications branch January 1, 2020 14:37
@timvandermeij
Copy link
Contributor Author

Thank you for the thorough review!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

too many colors in viewer.css
3 participants