Draw the 67 Material Symbols Google ships without a viewBox at every size
Google publishes 67 symbols per cut (auto_awesome, insights, tips_and_updates, battery_50 ...) with width and height but no viewBox, their paths in 24 units, or 20 in the 20 cut, where every other symbol draws in `0 -960 960 960`. bin/fetch-symbols dropped the size so CSS decides it, which left these with no coordinate system: `<x-icon>` drew them at 1:1, whole only at exactly 24px and cut off or misplaced at any other size, the 20 cut every small button uses included. normalise() now turns a file's width and height into its viewBox when it has none, before dropping them. The 268 files are regenerated from Google's originals at the recorded SOURCE commit with the fixed step (each shipped file matched the old step's output first; the other 16,272 do not change), and every path lies inside its new viewBox. IconTest checks that each shipped symbol has a viewBox and that `<x-icon name="auto_awesome">` renders in 20 units at size 16 and in 24 at size 32; both fail without the change. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 5
parent
b7e16476cd
commit
7a95449c82
@@ -1 +1 @@
|
||||
<svg fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M2 6q-.425 0-.712-.287Q1 5.425 1 5V4q0-1.25.875-2.125T4 1h1q.425 0 .713.287Q6 1.575 6 2t-.287.712Q5.425 3 5 3H4q-.425 0-.712.287Q3 3.575 3 4v1q0 .425-.287.713Q2.425 6 2 6Zm2 17q-1.25 0-2.125-.875T1 20v-1q0-.425.288-.712Q1.575 18 2 18t.713.288Q3 18.575 3 19v1q0 .425.288.712Q3.575 21 4 21h1q.425 0 .713.288Q6 21.575 6 22t-.287.712Q5.425 23 5 23Zm15 0q-.425 0-.712-.288Q18 22.425 18 22t.288-.712Q18.575 21 19 21h1q.425 0 .712-.288Q21 20.425 21 20v-1q0-.425.288-.712Q21.575 18 22 18t.712.288Q23 18.575 23 19v1q0 1.25-.875 2.125T20 23Zm3-17q-.425 0-.712-.287Q21 5.425 21 5V4q0-.425-.288-.713Q20.425 3 20 3h-1q-.425 0-.712-.288Q18 2.425 18 2t.288-.713Q18.575 1 19 1h1q1.25 0 2.125.875T23 4v1q0 .425-.288.713Q22.425 6 22 6ZM11 19.55l-5-2.875q-.475-.275-.737-.737Q5 15.475 5 14.925V9.2q0-.55.263-1.013.262-.462.737-.737l5-2.875q.475-.275 1-.275t1 .275l5 2.875q.475.275.738.737Q19 8.65 19 9.2v5.725q0 .55-.262 1.013-.263.462-.738.737l-5 2.875q-.475.275-1 .275t-1-.275Zm0-2.3v-4.6l-4-2.3v4.6Zm2 0 4-2.3v-4.6l-4 2.3Zm-1-6.35 4-2.3-4-2.3-4 2.3Zm0 1.75Zm0-1.75Zm1 1.75Zm-2 0Z"/></svg>
|
||||
<svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M2 6q-.425 0-.712-.287Q1 5.425 1 5V4q0-1.25.875-2.125T4 1h1q.425 0 .713.287Q6 1.575 6 2t-.287.712Q5.425 3 5 3H4q-.425 0-.712.287Q3 3.575 3 4v1q0 .425-.287.713Q2.425 6 2 6Zm2 17q-1.25 0-2.125-.875T1 20v-1q0-.425.288-.712Q1.575 18 2 18t.713.288Q3 18.575 3 19v1q0 .425.288.712Q3.575 21 4 21h1q.425 0 .713.288Q6 21.575 6 22t-.287.712Q5.425 23 5 23Zm15 0q-.425 0-.712-.288Q18 22.425 18 22t.288-.712Q18.575 21 19 21h1q.425 0 .712-.288Q21 20.425 21 20v-1q0-.425.288-.712Q21.575 18 22 18t.712.288Q23 18.575 23 19v1q0 1.25-.875 2.125T20 23Zm3-17q-.425 0-.712-.287Q21 5.425 21 5V4q0-.425-.288-.713Q20.425 3 20 3h-1q-.425 0-.712-.288Q18 2.425 18 2t.288-.713Q18.575 1 19 1h1q1.25 0 2.125.875T23 4v1q0 .425-.288.713Q22.425 6 22 6ZM11 19.55l-5-2.875q-.475-.275-.737-.737Q5 15.475 5 14.925V9.2q0-.55.263-1.013.262-.462.737-.737l5-2.875q.475-.275 1-.275t1 .275l5 2.875q.475.275.738.737Q19 8.65 19 9.2v5.725q0 .55-.262 1.013-.263.462-.738.737l-5 2.875q-.475.275-1 .275t-1-.275Zm0-2.3v-4.6l-4-2.3v4.6Zm2 0 4-2.3v-4.6l-4 2.3Zm-1-6.35 4-2.3-4-2.3-4 2.3Zm0 1.75Zm0-1.75Zm1 1.75Zm-2 0Z"/></svg>
|
||||
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Reference in New Issue
Block a user