Add the Material 3 Expressive foundation
tests / lint (push) Successful in 1m0s
tests / feature (8.4) (push) Successful in 1m0s
tests / feature (8.5) (push) Successful in 1m1s
tests / browser (safari, webkit) (push) Successful in 1m59s
tests / browser (chrome, chromium) (push) Successful in 1m49s
tests / browser (firefox, firefox) (push) Successful in 1m54s
tests / lint (push) Successful in 1m0s
tests / feature (8.4) (push) Successful in 1m0s
tests / feature (8.5) (push) Successful in 1m1s
tests / browser (safari, webkit) (push) Successful in 1m59s
tests / browser (chrome, chromium) (push) Successful in 1m49s
tests / browser (firefox, firefox) (push) Successful in 1m54s
Colour, shape, type, elevation and motion as tokens and Tailwind utilities; `php artisan material:scheme`, which generates an app's colour roles with Google's material-color-utilities (spec 2025); the theme head script with light, dark and system and its Alpine store; Google Sans Flex; every Material Symbol (4,135, outlined and filled) drawn by <x-icon> without blade-icons; all 35 M3 Expressive shapes, ported from androidx, as <x-shape>; the x-figure directive; the Toasts concern; DesignGuard for applications' tests; and a showcase with every token, both themes side by side and an icon search. Colour utilities are `@theme inline`, so a section with its own data-theme repaints; without it they resolve once on :root. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V9NnLxnPp8vaaurb3Z1MFy
This commit is contained in:
co-authored by
Claude Opus 5
parent
9b53891a8e
commit
b48e879254
Executable
+65
@@ -0,0 +1,65 @@
|
||||
#!/usr/bin/env bash
|
||||
#
|
||||
# Refresh resources/svg/symbols from google/material-design-icons (Apache-2.0).
|
||||
#
|
||||
# Material Symbols Rounded at weight 400, grade 0 and optical size 24, outlined and
|
||||
# filled, for every symbol Google publishes. Maintenance only: applications never run
|
||||
# this, and bin/ is not part of the archive Composer installs.
|
||||
#
|
||||
# The repository is ~5 GB, so it is cloned without blobs and checked out sparsely:
|
||||
# git downloads only the two files per symbol that are kept. The @material-symbols
|
||||
# npm packages were not used because their SVGs are drawn at optical size 48, whose
|
||||
# strokes are thinner than the 24px design.
|
||||
|
||||
set -euo pipefail
|
||||
|
||||
root="$(cd "$(dirname "$0")/.." && pwd)"
|
||||
work="$(mktemp -d)"
|
||||
trap 'rm -rf "$work"' EXIT
|
||||
|
||||
git clone --quiet --depth=1 --filter=blob:none --no-checkout \
|
||||
https://github.com/google/material-design-icons.git "$work/repo"
|
||||
|
||||
cd "$work/repo"
|
||||
|
||||
git sparse-checkout set --no-cone \
|
||||
'/symbols/web/*/materialsymbolsrounded/*_24px.svg' \
|
||||
'!/symbols/web/*/materialsymbolsrounded/*_wght[0-9]*' \
|
||||
'!/symbols/web/*/materialsymbolsrounded/*_grad200*' \
|
||||
'!/symbols/web/*/materialsymbolsrounded/*_gradN25*'
|
||||
|
||||
git checkout --quiet "$(git symbolic-ref --short HEAD)"
|
||||
|
||||
out="$root/resources/svg/symbols"
|
||||
rm -rf "$out/outlined" "$out/filled"
|
||||
mkdir -p "$out/outlined" "$out/filled"
|
||||
|
||||
# Google's files carry width="24" height="24" and no fill. Drop the size so CSS decides
|
||||
# it, and paint in currentColor so an icon takes the colour of the text around it.
|
||||
normalise() {
|
||||
sed -E \
|
||||
-e 's/ (width|height)="[0-9]+"//g' \
|
||||
-e 's/<svg /<svg fill="currentColor" /' \
|
||||
"$1"
|
||||
}
|
||||
|
||||
missing=0
|
||||
|
||||
for dir in symbols/web/*/materialsymbolsrounded; do
|
||||
name="$(basename "$(dirname "$dir")")"
|
||||
outlined="$dir/${name}_24px.svg"
|
||||
filled="$dir/${name}_fill1_24px.svg"
|
||||
|
||||
if [[ ! -f "$outlined" || ! -f "$filled" ]]; then
|
||||
echo "skipped $name: no outlined and filled 24px pair" >&2
|
||||
missing=$((missing + 1))
|
||||
continue
|
||||
fi
|
||||
|
||||
normalise "$outlined" > "$out/outlined/$name.svg"
|
||||
normalise "$filled" > "$out/filled/$name.svg"
|
||||
done
|
||||
|
||||
git rev-parse HEAD > "$out/SOURCE"
|
||||
|
||||
echo "$(ls "$out/outlined" | wc -l | tr -d ' ') symbols from google/material-design-icons@$(cut -c1-12 "$out/SOURCE"), $missing skipped"
|
||||
Reference in New Issue
Block a user