-
Notifications
You must be signed in to change notification settings - Fork 63
Conversation
Storybook and Tailwind configuration previews: Ready Storybook: https://wordpress.github.io/openverse-frontend/_preview/2077 Please note that GitHub pages takes a little time to deploy newly pushed code, if the links above don't work or you see old versions, wait 5 minutes and try again. You can check the GitHub pages deployment action list to see the current status of the deployments. |
Size Change: -11.1 kB (-1%) Total Size: 899 kB
ℹ️ View Unchanged
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Could you add some visual regression tests of the component stories (if any) and the page?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The change looks great, and since there is no mockup, I suggest applying two changes:
- Text style: Apply the "Label bold" style as defined in the Design Library.
- Spacing: Set a
8px
gap between label and icon.
Sorry for replying late as I was reviewing the buttons created in the Design Library and in storybook to select the correct one. However, there are multiple inconsistencies between both sources that do not block this PR. Applying the changes described above is sufficient.
In parallel, I started exploring a layout improvement for this and Timeout pages that will share in a separate design ticket.
37c2d8c
to
7d127fa
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The changes look good to me!
I have some issues with the look of full-width buttons at the tablet breakpoint but that's a design issue and not something to block the PR over. @panchovm maybe more than one column or just the individual buttons as seen on the desktop would be better.
Thanks for the suggestion @dhruvkb I am currently working on a proposal for updating this and Timeout pages' layouts. For this PR scope, the buttons look correct. I plan to share the layout proposal soon. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I suggested two spacing tweaks in the layout that have nothing to do with the button's style.
For @zackkrida's point. Yes, the button style is something we need to tackle in the future to address the spacing consistency across the site.
7d127fa
to
7c0e2f7
Compare
The requested changes were implemented
Fixes
Fixes #1999 by @obulat
Description
This PR refactors the No results page to use rows/column of buttons.
@panchovm, there are no updated mockups for this in Figma, so I'll need your input on paddings and sizes.
Testing Instructions
Run the app, and try searching for something that doesn't have any results, something like "lskdjflskdjflsk". This should open a "No results" page. Here, on desktop, the external sources should be in a row of buttons, and on mobile, in a column.
Checklist
Update index.md
).main
) ora parent feature branch.
errors.
Developer Certificate of Origin
Developer Certificate of Origin