From d906b271005c0c39ee4c5358697981e8ac701fc7 Mon Sep 17 00:00:00 2001 From: Tim 'mithro' Ansell Date: Sat, 6 Jun 2026 15:43:08 +0930 Subject: [PATCH 1/6] Add heading-anchor include and hover-reveal CSS Foundation for linkable headings: a small Liquid include renders a '#' permalink at the end of any heading given its id, and custom.css reveals it on hover/focus plus offsets :target jumps below the sticky nav. Co-Authored-By: Claude Opus 4.8 (1M context) --- _includes/components/heading-anchor.html | 20 +++++++++++++ assets/css/custom.css | 37 ++++++++++++++++++++++++ 2 files changed, 57 insertions(+) create mode 100644 _includes/components/heading-anchor.html diff --git a/_includes/components/heading-anchor.html b/_includes/components/heading-anchor.html new file mode 100644 index 00000000..3643a492 --- /dev/null +++ b/_includes/components/heading-anchor.html @@ -0,0 +1,20 @@ +{%- comment -%} + Renders a hover-revealed "#" permalink for a heading so it can be linked + directly via a URL fragment. + + Place it immediately before the heading's closing tag and pass the heading's + id: + +

How it works{% include components/heading-anchor.html id="how-it-works" %}

+ + For dynamic / templated headings, slugify the text once and reuse it for both + the id and this include: + + {% assign hid = page.faq_area.sub_title | slugify %} +

{{ page.faq_area.sub_title }}{% include components/heading-anchor.html id=hid %}

+ + Renders nothing when the supplied id is blank, so it is safe to use behind a + slugify that may produce an empty string. +{%- endcomment -%} +{%- assign anchor_id = include.id | strip -%} +{%- if anchor_id != "" -%}#{%- endif -%} diff --git a/assets/css/custom.css b/assets/css/custom.css index a49c7ede..09bbf613 100644 --- a/assets/css/custom.css +++ b/assets/css/custom.css @@ -1,5 +1,42 @@ /* Site-specific CSS overrides */ +/* Heading anchor permalinks ------------------------------------------------ */ +/* A "#" link rendered (via components/heading-anchor.html) at the end of every + heading. It stays invisible until the heading is hovered or the link itself + is focused, so it never distracts from the design but is always discoverable. */ +.heading-anchor { + margin-left: 0.35em; + font-weight: 400; + color: inherit; + text-decoration: none; + opacity: 0; + transition: opacity 0.15s ease-in-out; +} + +/* Reveal the anchor when its heading is hovered, or when the anchor itself is + keyboard-focused (accessibility). */ +h1:hover > .heading-anchor, +h2:hover > .heading-anchor, +h3:hover > .heading-anchor, +h4:hover > .heading-anchor, +h5:hover > .heading-anchor, +h6:hover > .heading-anchor, +.heading-anchor:focus { + opacity: 0.5; +} + +.heading-anchor:hover, +.heading-anchor:focus { + opacity: 1 !important; + text-decoration: underline; +} + +/* When a visitor jumps to a heading via its #fragment, keep it clear of the + sticky site header instead of hiding it underneath. */ +:target { + scroll-margin-top: 110px; +} + /* Fix price formatting - remove the automatic "/" before duration */ .price-duration:before { content: "" !important; From 58ea1cbe622f543aaec872acf4c46d7996c007ae Mon Sep 17 00:00:00 2001 From: Tim 'mithro' Ansell Date: Sat, 6 Jun 2026 15:50:44 +0930 Subject: [PATCH 2/6] Add linkable heading anchors to design-help page and provider partial Co-Authored-By: Claude Opus 4.8 (1M context) --- _includes/design_help/provider.html | 8 +++++--- design-help.html | 12 ++++++------ 2 files changed, 11 insertions(+), 9 deletions(-) diff --git a/_includes/design_help/provider.html b/_includes/design_help/provider.html index 09d157b2..1a823198 100644 --- a/_includes/design_help/provider.html +++ b/_includes/design_help/provider.html @@ -15,12 +15,14 @@ {% endif %}
+ {% assign prov_id = include.provider.title | slugify %} + {% assign prov_sub_id = include.provider.sub_title | slugify %} {% if include.provider.website %} -

{{include.provider.title}}

+

{{include.provider.title}}{% include components/heading-anchor.html id=prov_id %}

{% else %} -

{{include.provider.title}}

+

{{include.provider.title}}{% include components/heading-anchor.html id=prov_id %}

{% endif %} -

{{include.provider.sub_title}}

+

{{include.provider.sub_title}}{% include components/heading-anchor.html id=prov_sub_id %}

{% if include.provider.content %}

{{include.provider.content | markdownify }}

{% endif %} diff --git a/design-help.html b/design-help.html index cd35e681..c67919e1 100644 --- a/design-help.html +++ b/design-help.html @@ -10,7 +10,7 @@
-

Professional Services

+

Professional Services{% include components/heading-anchor.html id="professional-services" %}

Independent companies offering professional design, consulting, and implementation services for GF180MCU projects.
Note: These services are not affiliated with or endorsed by wafer.space. @@ -27,7 +27,7 @@

Professional Services

-

Community Resources

+

Community Resources{% include components/heading-anchor.html id="community-resources" %}

Free community forums, documentation, and open-source resources for GF180MCU designs.

@@ -37,7 +37,7 @@

Community Resources

-

Community Forums

+

Community Forums{% include components/heading-anchor.html id="community-forums" %}

Coming soon - Discussion forums for design questions and peer support.

@@ -46,7 +46,7 @@

Community Forums

-

Documentation

+

Documentation{% include components/heading-anchor.html id="documentation" %}

Coming soon - Tutorials, guides, and technical documentation for GF180MCU.

@@ -55,7 +55,7 @@

Documentation

-

Open Source Tools

+

Open Source Tools{% include components/heading-anchor.html id="open-source-tools" %}

Coming soon - Links to open-source tools and example designs for GF180MCU.

@@ -68,7 +68,7 @@

Open Source Tools

-

Want to be listed here?

+

Want to be listed here?{% include components/heading-anchor.html id="want-to-be-listed-here" %}

If you offer professional design services or community resources for GF180MCU projects, please contact us to be considered for inclusion on this page. From 538dbd07f937bd3765608339ab757060409c3ba7 Mon Sep 17 00:00:00 2001 From: Tim 'mithro' Ansell Date: Sat, 6 Jun 2026 15:54:00 +0930 Subject: [PATCH 3/6] Add linkable heading anchors to faq, about, technology, free pages Co-Authored-By: Claude Opus 4.8 (1M context) --- about.html | 15 ++++++++++----- faq.html | 15 +++++++++------ free.html | 11 ++++++----- technology.html | 25 ++++++++++++++++--------- 4 files changed, 41 insertions(+), 25 deletions(-) diff --git a/about.html b/about.html index 32d7213a..14bef698 100644 --- a/about.html +++ b/about.html @@ -75,7 +75,8 @@

{% if page.about_area.projects_number %} -

{{page.about_area.projects_number}}+

+ {% assign about_stat_id = page.about_area.project_tag | slugify %} +

{{page.about_area.projects_number}}+{% include components/heading-anchor.html id=about_stat_id %}

{% endif %} {% if page.about_area.project_tag %}

{{page.about_area.project_tag}}

@@ -92,7 +93,8 @@

{{page.about_area.projects_number}}+

{% if page.about_area.title %} -

{{ page.about_area.title }}

+ {% assign about_title_id = page.about_area.title | strip_html | slugify %} +

{{ page.about_area.title }}{% include components/heading-anchor.html id=about_title_id %}

{% endif %} {% if page.about_area.sub_title %}

{{page.about_area.sub_title}}

@@ -123,7 +125,8 @@

{{ page.about_area.title }}

-

{{page.video_area.title}}

+ {% assign video_title_id = page.video_area.title | strip_html | slugify %} +

{{page.video_area.title}}{% include components/heading-anchor.html id=video_title_id %}

{{page.video_area.sub_title}}