Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-06 14:50:20 -05:00
Code Issues Activity

✨ Explicitly display icon IDs in storybook

Browse source
This commit is contained in:
Belén Albeza 2024-12-03 09:59:01 +01:00
parent b4ccf545c7
commit 39c203b997
2 changed files with 15 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
frontend/src/app/main/ui/ds/foundations/assets/icon.stories.jsx
View file

@ -26,16 +26,26 @@ export const All = {
<>
<StoryHeader>
<h1>All Icons</h1>
<p>Hover on an icon to see its ID.</p>
</StoryHeader>
<StoryGrid>
<StoryGrid size="256">
{icons.map((iconId) => (
<StoryGridCell
title={iconId}
key={iconId}
style={{ color: "var(--color-accent-primary)" }}
style={{
color: "var(--color-accent-primary)",
display: "grid",
gap: "0.5rem",
}}
>
<Icon id={iconId} size={size} />
<code
style={{
"font-family": "monospace",
color: "var(--color-foreground-secondary)",
}}
>
{iconId}
</code>
</StoryGridCell>
))}
</StoryGrid>

1
frontend/src/app/main/ui/ds/storybook.scss
View file

@ -16,6 +16,7 @@
.story-header {
color: var(--color-foreground-primary);
margin-bottom: 1rem;
}
.story-grid-row {