From 95b1ce8de8b82d215370b8f3416787ace51313d0 Mon Sep 17 00:00:00 2001 From: tannevaled Date: Thu, 8 Oct 2026 16:53:03 +0200 Subject: [PATCH] Icons on the buttons, saying what each one does Every button now carries an Octicons glyph chosen by what it does: GitHub's mark for GitHub, a book for documentation and references, a rocket for getting started, a graph for benchmarks, a package for modules, a globe for a live demo, and an external-link arrow otherwise. The glyphs come from primer/octicons @primer/octicons-react@19.40.0, copied verbatim and not redrawn. Their MIT licence travels in layouts/partials/icons/OCTICONS-LICENSE. They are drawn in currentColor, so they follow the button in light and dark, and they are aria-hidden, since the text already says where each button leads. One CSS rule beside .btn aligns them. Co-Authored-By: Claude Opus 5.5 (1M context) --- layouts/index.html | 5 +++-- layouts/partials/icons/OCTICONS-LICENSE | 21 +++++++++++++++++++++ layouts/partials/icons/book.html | 5 +++++ layouts/partials/icons/mark-github.html | 5 +++++ 4 files changed, 34 insertions(+), 2 deletions(-) create mode 100644 layouts/partials/icons/OCTICONS-LICENSE create mode 100644 layouts/partials/icons/book.html create mode 100644 layouts/partials/icons/mark-github.html diff --git a/layouts/index.html b/layouts/index.html index ca3f99c..39e79ec 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -54,6 +54,7 @@ display: inline-block; padding: 10px 18px; margin: 4px; border-radius: 8px; text-decoration: none; font-weight: 600; border: 1px solid var(--border); } + .btn .icon{display:inline-block;vertical-align:-0.15em;margin-right:.45em} .btn.primary { background: var(--accent); color: var(--accent-fg); border-color: var(--accent); } .btn.ghost { color: var(--fg); background: transparent; } .lead { color: var(--fg); max-width: 820px; margin: 8px auto 0; text-align: center; } @@ -107,8 +108,8 @@

go-webengine

measured vs headless Chrome
- Documentation - GitHub + {{ partial "icons/book.html" . }}Documentation + {{ partial "icons/mark-github.html" . }}GitHub
diff --git a/layouts/partials/icons/OCTICONS-LICENSE b/layouts/partials/icons/OCTICONS-LICENSE new file mode 100644 index 0000000..aa1fa80 --- /dev/null +++ b/layouts/partials/icons/OCTICONS-LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2026 GitHub Inc. + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/layouts/partials/icons/book.html b/layouts/partials/icons/book.html new file mode 100644 index 0000000..cf1e882 --- /dev/null +++ b/layouts/partials/icons/book.html @@ -0,0 +1,5 @@ +{{- /* Octicons "book" (16 px), primer/octicons @primer/octicons-react@19.40.0, copied verbatim, MIT, + (c) GitHub Inc.: the licence is OCTICONS-LICENSE beside this file. + currentColor follows the button in light and dark; aria-hidden, since + the button's text already says where it leads. */ -}} + \ No newline at end of file diff --git a/layouts/partials/icons/mark-github.html b/layouts/partials/icons/mark-github.html new file mode 100644 index 0000000..17fc355 --- /dev/null +++ b/layouts/partials/icons/mark-github.html @@ -0,0 +1,5 @@ +{{- /* Octicons "mark-github" (16 px), primer/octicons @primer/octicons-react@19.40.0, copied verbatim, MIT, + (c) GitHub Inc.: the licence is OCTICONS-LICENSE beside this file. + currentColor follows the button in light and dark; aria-hidden, since + the button's text already says where it leads. */ -}} + \ No newline at end of file