refactor: make ContentSwitcher tabs design reusable #4066
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
especially necessary for analytics tracking, so we can consistently recognize clicks inside the button padding
marcelgerber
force-pushed
the
content-switcher-refactor
branch
from
7d2c1d1
to
d35eb9f
Compare
7 tasks
|
Quick links (staging server):
Login:
SVG tester:Number of differences (default views): 0 ✅ Edited: 2024-10-17 15:54:17 UTC |
marcelgerber
force-pushed
the
content-switcher-refactor
branch
from
0635b71
to
0311406
Compare
sophiamersmann
approved these changes
Oct 22, 2024
There was a problem hiding this comment.
Nice!
The "Show more" button in the sources tab should be styled a bit differently, otherwise looks good!
Example chart: http://staging-site-content-switcher-refactor/grapher/covid-vaccine-by-age
| Prod | Staging |
|---|---|
 |
 |
|
Ah good catch, thank you! |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Part of #4015.
This makes it so the existing
<Tabs>component now also handles<ContentSwitcher>, which is the component used for chart/map/table tabs.I'm doing this by creating two styling variants for
<Tabs>:default, which is used in the sources tabslim, which is used for the content switcher (and will be used in Cycle 2024.6: Refreshed Grapher download UI that uses server side csv generation #4015)Upsides:
Downside:
ContentSwitcher.tsxnow relies on variables inside bothContentSwitcher.scssandTabs.scssThere shouldn't be any visual differences before and after, these tabs should look precisely the same as they did before 🕵🏻