Svelte: implement symbol redesign#62473
Conversation
5cc3996 to
8942acb
Compare
|
I checked out the branch here but didn't see any of the new symbol icons in search results, etc. The icons visually look like they use actual text over being true outlined svgs? Apologies if this is wrong, I can't clearly see where the source for each individual icon is. |
Any chance you were running the React version?
No, you're right. It is text, but it is text within an SVG. SVG supports rendering text in an image, and it's fully vectorized. Did you want us to just copy the paths straight from the designs? I was thinking we wanted to parameterize these so we could easily adjust the short names, colors, spacing, etc. Totally fine if that's what you want, just misunderstood 🙂 |
The source for the SVG is here |
As long as it's strictly not adopting any styling from the stylesheets, then fine. To my eye I'm noticing some font-weight weirdness/faux bolding but could be wrong. |
|
Converting to draft since we decided to just use the SVGs from Figma for now. We can't guarantee that our code font exists (it didn't on my system 🙃), so until we get fonts figured out, we're just going to use what we know looks good, which are the paths from Figma |
|
Alrighty, this is ready for review again |
|
Excited about getting this in! :D |
There was a problem hiding this comment.
Can we move --icon-color: var(--text-muted) on the top level, it seems we set it
both times for dark and light theme
c5737a8 to
cda7ea2
Compare
|
Quick note on this @camdencheek: The symbols weren't updated in places like the search suggestions: There might've been other places missed out. |
|
Oh weird. Those must use a different source for the icons because I deleted the code that should be handling that 😄 Will follow up 👍 |
This implements the designs for the new symbol kind icons here.
Closes https://github.com/sourcegraph/sourcegraph/issues/61941
Test plan
Added storybook test. Manually tested the two places this was slotted in.