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

Design cleanups issues. #1560

Merged
merged 77 commits into from
Oct 12, 2021
Merged

Design cleanups issues. #1560

merged 77 commits into from
Oct 12, 2021

Conversation

scottjehl
Copy link
Contributor

@scottjehl scottjehl commented Oct 1, 2021

Ready for merge!! but this is the PR for moving most views to a more fluid, responsive layout, particularly at smaller screen sizes.

It includes a content change for the global nav: the home link is removed. We should repeat that edit in other pages that are hosted elsewhere, like the logged-in test history and account pages.

AB#140590

…er spacing, cleaned up typography, responsive tables and global navigation, footer, fluid SVGs, and fewer content boxes.
…l and accordion css into pagestyle. make minor scoping additions to templates to try to prevent style conflicts for redundant styles. cleanup in css still very much needed
@scottjehl
Copy link
Contributor Author

scottjehl commented Oct 8, 2021

Close to being ready. Some notes on what's left:

  • - safari botching up the svgs currently
  • - php discrepancy causing Filmstrip Options checks to not show up for LCP candidates or layout shift regions , sticky
  • - extra overflow container seems to be wrapping the results tables
  • - "I wonder if the opacity sliders play nice with longer urls than www.cnn.com"

@scottjehl
Copy link
Contributor Author

Good to go. Worth another round of browser testing first.

@scottjehl scottjehl added this to Needs Review in Tracked Issues Oct 11, 2021
@scottjehl
Copy link
Contributor Author

Ready, pending a little more testing.

Fixes #1560
Fixes #1569
Fixes #1555
Fixes #1556
Fixes #1546
Fixes #1545
Fixes #1544

@tkadlec
Copy link
Contributor

tkadlec commented Oct 12, 2021

@tkadlec
Copy link
Contributor

tkadlec commented Oct 12, 2021

The request dialog box has some contrast issues (for both hover and non-hover states).

contrast-issues

Looks like if we bump the default (see: https://github.com/WPO-Foundation/webpagetest/blob/3d481243463ff10e98cc93a094ef26a6f924e485/www/pagestyle2.css#L3399 ) to #61cbf6, we fix part of this.

Screen Shot 2021-10-12 at 8 45 19 AM

Then, for the div.request-dialog-radio .ui-state-hover state, maybe we ditch the background color entirely and just alter the font color?

@scottjehl
Copy link
Contributor Author

Thanks @tkadlec

On those above edits now. Also, for the visual comparison tab where the field formatting looks bonked up, it seems to be an existing markup problem with the JS additions:
image

Will get that too.

@scottjehl
Copy link
Contributor Author

Alright, fixes above are in. I believe we're good to go.

@scottjehl scottjehl merged commit 82f0a78 into master Oct 12, 2021
Tracked Issues automation moved this from Needs Review to Done Oct 12, 2021
@scottjehl scottjehl deleted the design-cleanups branch October 12, 2021 18:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
Development

Successfully merging this pull request may close these issues.

None yet

2 participants