You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@grails.apache.org by as...@apache.org on 2026/05/03 14:17:18 UTC

(grails-website) branch asf-site-production updated: Updating apache/grails-website asf-site-production branch for GitHub Actions run:25281319312

This is an automated email from the ASF dual-hosted git repository.

asf-ci-deploy pushed a commit to branch asf-site-production
in repository https://gitbox.apache.org/repos/asf/grails-website.git


The following commit(s) were added to refs/heads/asf-site-production by this push:
     new 8b7df8f5b9e Updating apache/grails-website asf-site-production branch for GitHub Actions run:25281319312
8b7df8f5b9e is described below

commit 8b7df8f5b9e1fb71576df6085c061e8b2e200e91
Author: jamesfredley <ja...@users.noreply.github.com>
AuthorDate: Sun May 3 14:17:11 2026 +0000

    Updating apache/grails-website asf-site-production branch for GitHub Actions run:25281319312
---
 foundation/minutes.xml                                    |  2 +-
 foundation/minutes/20210321-tab.html                      | 10 +++++-----
 foundation/minutes/20211217-tab.html                      | 10 +++++-----
 foundation/minutes/20220323-tab.html                      | 10 +++++-----
 foundation/minutes/20220711-tab.html                      | 10 +++++-----
 foundation/minutes/20221128-tab.html                      | 10 +++++-----
 foundation/minutes/index.html                             |  2 +-
 guides/_redirects.json                                    |  2 +-
 guides/adding-commit-info/3/css/guide.css                 | 15 ++++++++-------
 guides/adding-commit-info/4/css/guide.css                 | 15 ++++++++-------
 guides/angular2-combined/4/css/guide.css                  | 15 ++++++++-------
 guides/building-a-react-app/4/css/guide.css               | 15 ++++++++-------
 guides/building-a-vue-app/4/css/guide.css                 | 15 ++++++++-------
 .../4/css/guide.css                                       | 15 ++++++++-------
 .../4/css/guide.css                                       | 15 ++++++++-------
 .../4/css/guide.css                                       | 15 ++++++++-------
 guides/command-objects-and-forms/3/css/guide.css          | 15 ++++++++-------
 guides/command-objects-and-forms/4/css/guide.css          | 15 ++++++++-------
 guides/creating-your-first-grails-app/3/css/guide.css     | 15 ++++++++-------
 guides/creating-your-first-grails-app/4/css/guide.css     | 15 ++++++++-------
 guides/creating-your-first-grails-app/6/css/guide.css     | 15 ++++++++-------
 guides/database-per-tenant/4/css/guide.css                | 15 ++++++++-------
 guides/discriminator-per-tenant/4/css/guide.css           | 15 ++++++++-------
 guides/gorm-event-listeners/3/css/guide.css               | 15 ++++++++-------
 guides/gorm-event-listeners/4/css/guide.css               | 15 ++++++++-------
 guides/gorm-graphql-with-react-and-apollo/4/css/guide.css | 15 ++++++++-------
 guides/gorm-ratpack/3/css/guide.css                       | 15 ++++++++-------
 guides/gorm-ratpack/4/css/guide.css                       | 15 ++++++++-------
 guides/gorm-without-grails/4/css/guide.css                | 15 ++++++++-------
 guides/grails-as-docker-container/3/css/guide.css         | 15 ++++++++-------
 guides/grails-as-docker-container/4/css/guide.css         | 15 ++++++++-------
 guides/grails-async-promises/3/css/guide.css              | 15 ++++++++-------
 guides/grails-async-promises/4/css/guide.css              | 15 ++++++++-------
 guides/grails-basicauth/3/css/guide.css                   | 15 ++++++++-------
 guides/grails-basicauth/4/css/guide.css                   | 15 ++++++++-------
 guides/grails-code-coverage/3/css/guide.css               | 15 ++++++++-------
 guides/grails-code-coverage/4/css/guide.css               | 15 ++++++++-------
 guides/grails-codenarc/4/css/guide.css                    | 15 ++++++++-------
 .../4/css/guide.css                                       | 15 ++++++++-------
 .../6/css/guide.css                                       | 15 ++++++++-------
 guides/grails-configuration-properties/3/css/guide.css    | 15 ++++++++-------
 guides/grails-configuration-properties/4/css/guide.css    | 15 ++++++++-------
 guides/grails-controller-testing/3/css/guide.css          | 15 ++++++++-------
 guides/grails-controller-testing/4/css/guide.css          | 15 ++++++++-------
 .../3/css/guide.css                                       | 15 ++++++++-------
 .../4/css/guide.css                                       | 15 ++++++++-------
 guides/grails-database-migration/3/css/guide.css          | 15 ++++++++-------
 guides/grails-database-migration/4/css/guide.css          | 15 ++++++++-------
 guides/grails-database-migration/6/css/guide.css          | 15 ++++++++-------
 guides/grails-docker-external-services/4/css/guide.css    | 15 ++++++++-------
 .../grails-dynamic-multiple-datasources/3/css/guide.css   | 15 ++++++++-------
 .../grails-dynamic-multiple-datasources/4/css/guide.css   | 15 ++++++++-------
 guides/grails-elasticbeanstalk/4/css/guide.css            | 15 ++++++++-------
 guides/grails-elasticsearch/4/css/guide.css               | 15 ++++++++-------
 guides/grails-email/3/css/guide.css                       | 15 ++++++++-------
 guides/grails-email/4/css/guide.css                       | 15 ++++++++-------
 guides/grails-events/3/css/guide.css                      | 15 ++++++++-------
 guides/grails-events/4/css/guide.css                      | 15 ++++++++-------
 .../8/css/guide.css                                       | 15 ++++++++-------
 guides/grails-file-download-excel/3/css/guide.css         | 15 ++++++++-------
 guides/grails-file-download-excel/4/css/guide.css         | 15 ++++++++-------
 guides/grails-geb-multiple-browsers/3/css/guide.css       | 15 ++++++++-------
 guides/grails-geb-multiple-browsers/4/css/guide.css       | 15 ++++++++-------
 guides/grails-google-cloud/4/css/guide.css                | 15 ++++++++-------
 guides/grails-google-home/4/css/guide.css                 | 15 ++++++++-------
 guides/grails-gorm-data-services/3/css/guide.css          | 15 ++++++++-------
 guides/grails-gorm-data-services/4/css/guide.css          | 15 ++++++++-------
 guides/grails-javamelody/4/css/guide.css                  | 15 ++++++++-------
 guides/grails-logicaldelete/3/css/guide.css               | 15 ++++++++-------
 guides/grails-logicaldelete/4/css/guide.css               | 15 ++++++++-------
 guides/grails-micronaut-http/5/css/guide.css              | 15 ++++++++-------
 guides/grails-micronaut-kafka/4/css/guide.css             | 15 ++++++++-------
 guides/grails-mock-basics/3/css/guide.css                 | 15 ++++++++-------
 guides/grails-mock-basics/4/css/guide.css                 | 15 ++++++++-------
 guides/grails-mock-http-server/3/css/guide.css            | 15 ++++++++-------
 guides/grails-mock-http-server/4/css/guide.css            | 15 ++++++++-------
 guides/grails-mock-logging-slf4j-test/3/css/guide.css     | 15 ++++++++-------
 guides/grails-mock-logging-slf4j-test/4/css/guide.css     | 15 ++++++++-------
 guides/grails-multi-datasource/3/css/guide.css            | 15 ++++++++-------
 guides/grails-multi-datasource/4/css/guide.css            | 15 ++++++++-------
 guides/grails-multi-project-build/4/css/guide.css         | 15 ++++++++-------
 guides/grails-oauth-google/4/css/guide.css                | 15 ++++++++-------
 guides/grails-oauth-twitter/4/css/guide.css               | 15 ++++++++-------
 guides/grails-on-circleci-basics/4/css/guide.css          | 15 ++++++++-------
 guides/grails-on-github-actions/4/css/guide.css           | 15 ++++++++-------
 guides/grails-on-travis-basics/3/css/guide.css            | 15 ++++++++-------
 guides/grails-on-travis-basics/4/css/guide.css            | 15 ++++++++-------
 guides/grails-quickcast-logging/4/css/guide.css           | 15 ++++++++-------
 .../4/css/guide.css                                       | 15 ++++++++-------
 .../4/css/guide.css                                       | 15 ++++++++-------
 guides/grails-quickcasts-interceptors/4/css/guide.css     | 15 ++++++++-------
 guides/grails-quickcasts-json-views/4/css/guide.css       | 15 ++++++++-------
 .../4/css/guide.css                                       | 15 ++++++++-------
 .../4/css/guide.css                                       | 15 ++++++++-------
 guides/grails-rabbitmq/4/css/guide.css                    | 15 ++++++++-------
 guides/grails-restapi-angularjs/4/css/guide.css           | 15 ++++++++-------
 guides/grails-scheduled/3/css/guide.css                   | 15 ++++++++-------
 guides/grails-scheduled/4/css/guide.css                   | 15 ++++++++-------
 guides/grails-schwartz/4/css/guide.css                    | 15 ++++++++-------
 guides/grails-soap/3/css/guide.css                        | 15 ++++++++-------
 guides/grails-soap/4/css/guide.css                        | 15 ++++++++-------
 .../3/css/guide.css                                       | 15 ++++++++-------
 .../4/css/guide.css                                       | 15 ++++++++-------
 guides/grails-taglib-wyswyg-trix/3/css/guide.css          | 15 ++++++++-------
 guides/grails-taglib-wyswyg-trix/4/css/guide.css          | 15 ++++++++-------
 .../grails-test-domain-class-constraints/3/css/guide.css  | 15 ++++++++-------
 .../grails-test-domain-class-constraints/4/css/guide.css  | 15 ++++++++-------
 guides/grails-test-security/3/css/guide.css               | 15 ++++++++-------
 guides/grails-test-security/4/css/guide.css               | 15 ++++++++-------
 guides/grails-tvmlapp/3/css/guide.css                     | 15 ++++++++-------
 guides/grails-tvmlapp/4/css/guide.css                     | 15 ++++++++-------
 guides/grails-upload-file/3/css/guide.css                 | 15 ++++++++-------
 guides/grails-upload-file/4/css/guide.css                 | 15 ++++++++-------
 guides/grails-vs-nodejs/4/css/guide.css                   | 15 ++++++++-------
 guides/grails-vue-combined/4/css/guide.css                | 15 ++++++++-------
 guides/grails-yourkit-profiling/4/css/guide.css           | 15 ++++++++-------
 guides/grails_i18n/3/css/guide.css                        | 15 ++++++++-------
 guides/grails_i18n/4/css/guide.css                        | 15 ++++++++-------
 guides/grails_url_mappings/4/css/guide.css                | 15 ++++++++-------
 guides/neo4j-movies/4/css/guide.css                       | 15 ++++++++-------
 guides/querying-gorm-dynamic-finders/3/css/guide.css      | 15 ++++++++-------
 guides/querying-gorm-dynamic-finders/4/css/guide.css      | 15 ++++++++-------
 guides/react-combined/4/css/guide.css                     | 15 ++++++++-------
 guides/react-spring-security/4/css/guide.css              | 15 ++++++++-------
 guides/rest-hibernate/3/css/guide.css                     | 15 ++++++++-------
 guides/rest-hibernate/4/css/guide.css                     | 15 ++++++++-------
 guides/rest-mongodb/4/css/guide.css                       | 15 ++++++++-------
 guides/server-sent-events/3/css/guide.css                 | 15 ++++++++-------
 guides/server-sent-events/4/css/guide.css                 | 15 ++++++++-------
 guides/using-hal-with-json-views/3/css/guide.css          | 15 ++++++++-------
 guides/using-hal-with-json-views/4/css/guide.css          | 15 ++++++++-------
 guides/using-the-react-profile/4/css/guide.css            | 15 ++++++++-------
 guides/using-the-vue-profile/3/css/guide.css              | 15 ++++++++-------
 guides/using-the-vue-profile/4/css/guide.css              | 15 ++++++++-------
 guides/vaadin-grails/4/css/guide.css                      | 15 ++++++++-------
 rss.xml                                                   |  2 +-
 136 files changed, 1045 insertions(+), 918 deletions(-)

diff --git a/foundation/minutes.xml b/foundation/minutes.xml
index f13a93d9d4d..2719875c9dc 100644
--- a/foundation/minutes.xml
+++ b/foundation/minutes.xml
@@ -1,4 +1,4 @@
-<?xml version="1.0" encoding="UTF-8"?><rss xmlns:content="http://purl.org/rss/1.0/modules/content/" version="2.0"><channel><title>Foundation | Grails Framework</title><link>https://grails.apache.org</link><description>A powerful Groovy-based web application framework for the JVM built on top of Spring Boot</description><pubDate>Sun, 03 May 2026 12:28:12 GMT</pubDate><item><title>Technology Advisory Board Meeting</title><link>https://grails.apache.org/foundation/minutes/20221128-tab.html< [...]
+<?xml version="1.0" encoding="UTF-8"?><rss xmlns:content="http://purl.org/rss/1.0/modules/content/" version="2.0"><channel><title>Foundation | Grails Framework</title><link>https://grails.apache.org</link><description>A powerful Groovy-based web application framework for the JVM built on top of Spring Boot</description><pubDate>Sun, 03 May 2026 14:09:06 GMT</pubDate><item><title>Technology Advisory Board Meeting</title><link>https://grails.apache.org/foundation/minutes/20221128-tab.html< [...]
 <h3>Meeting Attendance:</h3>
 <ul>
 <li><strong>Puneet Behl</strong> - Grails Product Development Lead at Object Computing</li>
diff --git a/foundation/minutes/20210321-tab.html b/foundation/minutes/20210321-tab.html
index 8bc0c500b24..90a8923a1ff 100644
--- a/foundation/minutes/20210321-tab.html
+++ b/foundation/minutes/20210321-tab.html
@@ -213,17 +213,17 @@ community events</p>
         <h3>2022</h3>
         <ul>
           <li>
-            <minutesLink>website.model.HtmlMinutes@139741b1</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@50933d7a</minutesLink>
             <parseDate>Nov 28, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@47e9a586</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@7891fb58</minutesLink>
             <parseDate>Jul 07, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@62111848</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@558dce63</minutesLink>
             <parseDate>Mar 23, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
@@ -231,12 +231,12 @@ community events</p>
         <h3>2021</h3>
         <ul>
           <li>
-            <minutesLink>website.model.HtmlMinutes@1c5efbc</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@535a8de6</minutesLink>
             <parseDate>Dec 17, 2021</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@7f1860f9</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@2b35c86c</minutesLink>
             <parseDate>Mar 21, 2021</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
diff --git a/foundation/minutes/20211217-tab.html b/foundation/minutes/20211217-tab.html
index e0e29126498..137d762d22e 100644
--- a/foundation/minutes/20211217-tab.html
+++ b/foundation/minutes/20211217-tab.html
@@ -255,17 +255,17 @@
         <h3>2022</h3>
         <ul>
           <li>
-            <minutesLink>website.model.HtmlMinutes@139741b1</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@50933d7a</minutesLink>
             <parseDate>Nov 28, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@47e9a586</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@7891fb58</minutesLink>
             <parseDate>Jul 07, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@62111848</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@558dce63</minutesLink>
             <parseDate>Mar 23, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
@@ -273,12 +273,12 @@
         <h3>2021</h3>
         <ul>
           <li>
-            <minutesLink>website.model.HtmlMinutes@1c5efbc</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@535a8de6</minutesLink>
             <parseDate>Dec 17, 2021</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@7f1860f9</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@2b35c86c</minutesLink>
             <parseDate>Mar 21, 2021</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
diff --git a/foundation/minutes/20220323-tab.html b/foundation/minutes/20220323-tab.html
index 5211bc9d384..90c3194c6e8 100644
--- a/foundation/minutes/20220323-tab.html
+++ b/foundation/minutes/20220323-tab.html
@@ -298,17 +298,17 @@
         <h3>2022</h3>
         <ul>
           <li>
-            <minutesLink>website.model.HtmlMinutes@139741b1</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@50933d7a</minutesLink>
             <parseDate>Nov 28, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@47e9a586</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@7891fb58</minutesLink>
             <parseDate>Jul 07, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@62111848</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@558dce63</minutesLink>
             <parseDate>Mar 23, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
@@ -316,12 +316,12 @@
         <h3>2021</h3>
         <ul>
           <li>
-            <minutesLink>website.model.HtmlMinutes@1c5efbc</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@535a8de6</minutesLink>
             <parseDate>Dec 17, 2021</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@7f1860f9</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@2b35c86c</minutesLink>
             <parseDate>Mar 21, 2021</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
diff --git a/foundation/minutes/20220711-tab.html b/foundation/minutes/20220711-tab.html
index 7a636e75a10..8d85f54f1d4 100644
--- a/foundation/minutes/20220711-tab.html
+++ b/foundation/minutes/20220711-tab.html
@@ -206,17 +206,17 @@
         <h3>2022</h3>
         <ul>
           <li>
-            <minutesLink>website.model.HtmlMinutes@139741b1</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@50933d7a</minutesLink>
             <parseDate>Nov 28, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@47e9a586</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@7891fb58</minutesLink>
             <parseDate>Jul 07, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@62111848</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@558dce63</minutesLink>
             <parseDate>Mar 23, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
@@ -224,12 +224,12 @@
         <h3>2021</h3>
         <ul>
           <li>
-            <minutesLink>website.model.HtmlMinutes@1c5efbc</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@535a8de6</minutesLink>
             <parseDate>Dec 17, 2021</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@7f1860f9</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@2b35c86c</minutesLink>
             <parseDate>Mar 21, 2021</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
diff --git a/foundation/minutes/20221128-tab.html b/foundation/minutes/20221128-tab.html
index 43eddfec276..7ab881a66a8 100644
--- a/foundation/minutes/20221128-tab.html
+++ b/foundation/minutes/20221128-tab.html
@@ -245,17 +245,17 @@
         <h3>2022</h3>
         <ul>
           <li>
-            <minutesLink>website.model.HtmlMinutes@139741b1</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@50933d7a</minutesLink>
             <parseDate>Nov 28, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@47e9a586</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@7891fb58</minutesLink>
             <parseDate>Jul 07, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@62111848</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@558dce63</minutesLink>
             <parseDate>Mar 23, 2022</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
@@ -263,12 +263,12 @@
         <h3>2021</h3>
         <ul>
           <li>
-            <minutesLink>website.model.HtmlMinutes@1c5efbc</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@535a8de6</minutesLink>
             <parseDate>Dec 17, 2021</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
           <li>
-            <minutesLink>website.model.HtmlMinutes@7f1860f9</minutesLink>
+            <minutesLink>website.model.HtmlMinutes@2b35c86c</minutesLink>
             <parseDate>Mar 21, 2021</parseDate>
             <a href='minutesLink'>MMM dd - Technology Advisory Board Meeting</a>
           </li>
diff --git a/foundation/minutes/index.html b/foundation/minutes/index.html
index be05df04c92..843bfdc147e 100644
--- a/foundation/minutes/index.html
+++ b/foundation/minutes/index.html
@@ -100,7 +100,7 @@
     </div>
 </header>
 
-<article><div class='header-bar chalices-bg'><div class='content'><h1><a href='https://grails.apache.org/foundation/index.html'>Foundation</a></h1></div></div><div class='clear content container'><h3 class='column-header'>Meeting Minutes Archive</h3><div class='light'><div class='padded' style='padding-top: 0;'><div class="three-columns"><div class='column'><article class='blog-card' style='margin-bottom: 0; background-image: url(https://grails.apache.org/images/grails-blog-index-6.png)' [...]
+<article><div class='header-bar chalices-bg'><div class='content'><h1><a href='https://grails.apache.org/foundation/index.html'>Foundation</a></h1></div></div><div class='clear content container'><h3 class='column-header'>Meeting Minutes Archive</h3><div class='light'><div class='padded' style='padding-top: 0;'><div class="three-columns"><div class='column'><article class='blog-card' style='margin-bottom: 0; background-image: url(https://grails.apache.org/images/grails-blog-index-6.png)' [...]
 <footer>
     <div class='content'>
         <div class='apache-grails'>
diff --git a/guides/_redirects.json b/guides/_redirects.json
index b10ff4b811a..2789421d844 100644
--- a/guides/_redirects.json
+++ b/guides/_redirects.json
@@ -1,6 +1,6 @@
 {
     "version": 1,
-    "generated": "2026-05-03T12:29:36.591097031Z",
+    "generated": "2026-05-03T14:10:13.416772366Z",
     "from_base": "https://guides.grails.org",
     "to_base": "https://grails.apache.org/guides",
     "count": 1735,
diff --git a/guides/adding-commit-info/3/css/guide.css b/guides/adding-commit-info/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/adding-commit-info/3/css/guide.css
+++ b/guides/adding-commit-info/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/adding-commit-info/4/css/guide.css b/guides/adding-commit-info/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/adding-commit-info/4/css/guide.css
+++ b/guides/adding-commit-info/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/angular2-combined/4/css/guide.css b/guides/angular2-combined/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/angular2-combined/4/css/guide.css
+++ b/guides/angular2-combined/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/building-a-react-app/4/css/guide.css b/guides/building-a-react-app/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/building-a-react-app/4/css/guide.css
+++ b/guides/building-a-react-app/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/building-a-vue-app/4/css/guide.css b/guides/building-a-vue-app/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/building-a-vue-app/4/css/guide.css
+++ b/guides/building-a-vue-app/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/building-an-android-client-powered-by-a-grails-backend/4/css/guide.css b/guides/building-an-android-client-powered-by-a-grails-backend/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/building-an-android-client-powered-by-a-grails-backend/4/css/guide.css
+++ b/guides/building-an-android-client-powered-by-a-grails-backend/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/building-an-ios-objectc-client-powered-by-a-grails-backend/4/css/guide.css b/guides/building-an-ios-objectc-client-powered-by-a-grails-backend/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/building-an-ios-objectc-client-powered-by-a-grails-backend/4/css/guide.css
+++ b/guides/building-an-ios-objectc-client-powered-by-a-grails-backend/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/building-an-ios-swift-client-powered-by-a-grails-backend/4/css/guide.css b/guides/building-an-ios-swift-client-powered-by-a-grails-backend/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/building-an-ios-swift-client-powered-by-a-grails-backend/4/css/guide.css
+++ b/guides/building-an-ios-swift-client-powered-by-a-grails-backend/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/command-objects-and-forms/3/css/guide.css b/guides/command-objects-and-forms/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/command-objects-and-forms/3/css/guide.css
+++ b/guides/command-objects-and-forms/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/command-objects-and-forms/4/css/guide.css b/guides/command-objects-and-forms/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/command-objects-and-forms/4/css/guide.css
+++ b/guides/command-objects-and-forms/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/creating-your-first-grails-app/3/css/guide.css b/guides/creating-your-first-grails-app/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/creating-your-first-grails-app/3/css/guide.css
+++ b/guides/creating-your-first-grails-app/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/creating-your-first-grails-app/4/css/guide.css b/guides/creating-your-first-grails-app/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/creating-your-first-grails-app/4/css/guide.css
+++ b/guides/creating-your-first-grails-app/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/creating-your-first-grails-app/6/css/guide.css b/guides/creating-your-first-grails-app/6/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/creating-your-first-grails-app/6/css/guide.css
+++ b/guides/creating-your-first-grails-app/6/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/database-per-tenant/4/css/guide.css b/guides/database-per-tenant/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/database-per-tenant/4/css/guide.css
+++ b/guides/database-per-tenant/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/discriminator-per-tenant/4/css/guide.css b/guides/discriminator-per-tenant/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/discriminator-per-tenant/4/css/guide.css
+++ b/guides/discriminator-per-tenant/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/gorm-event-listeners/3/css/guide.css b/guides/gorm-event-listeners/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/gorm-event-listeners/3/css/guide.css
+++ b/guides/gorm-event-listeners/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/gorm-event-listeners/4/css/guide.css b/guides/gorm-event-listeners/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/gorm-event-listeners/4/css/guide.css
+++ b/guides/gorm-event-listeners/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/gorm-graphql-with-react-and-apollo/4/css/guide.css b/guides/gorm-graphql-with-react-and-apollo/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/gorm-graphql-with-react-and-apollo/4/css/guide.css
+++ b/guides/gorm-graphql-with-react-and-apollo/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/gorm-ratpack/3/css/guide.css b/guides/gorm-ratpack/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/gorm-ratpack/3/css/guide.css
+++ b/guides/gorm-ratpack/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/gorm-ratpack/4/css/guide.css b/guides/gorm-ratpack/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/gorm-ratpack/4/css/guide.css
+++ b/guides/gorm-ratpack/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/gorm-without-grails/4/css/guide.css b/guides/gorm-without-grails/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/gorm-without-grails/4/css/guide.css
+++ b/guides/gorm-without-grails/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-as-docker-container/3/css/guide.css b/guides/grails-as-docker-container/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-as-docker-container/3/css/guide.css
+++ b/guides/grails-as-docker-container/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-as-docker-container/4/css/guide.css b/guides/grails-as-docker-container/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-as-docker-container/4/css/guide.css
+++ b/guides/grails-as-docker-container/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-async-promises/3/css/guide.css b/guides/grails-async-promises/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-async-promises/3/css/guide.css
+++ b/guides/grails-async-promises/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-async-promises/4/css/guide.css b/guides/grails-async-promises/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-async-promises/4/css/guide.css
+++ b/guides/grails-async-promises/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-basicauth/3/css/guide.css b/guides/grails-basicauth/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-basicauth/3/css/guide.css
+++ b/guides/grails-basicauth/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-basicauth/4/css/guide.css b/guides/grails-basicauth/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-basicauth/4/css/guide.css
+++ b/guides/grails-basicauth/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-code-coverage/3/css/guide.css b/guides/grails-code-coverage/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-code-coverage/3/css/guide.css
+++ b/guides/grails-code-coverage/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-code-coverage/4/css/guide.css b/guides/grails-code-coverage/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-code-coverage/4/css/guide.css
+++ b/guides/grails-code-coverage/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-codenarc/4/css/guide.css b/guides/grails-codenarc/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-codenarc/4/css/guide.css
+++ b/guides/grails-codenarc/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-configuration-properties-micronaut/4/css/guide.css b/guides/grails-configuration-properties-micronaut/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-configuration-properties-micronaut/4/css/guide.css
+++ b/guides/grails-configuration-properties-micronaut/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-configuration-properties-micronaut/6/css/guide.css b/guides/grails-configuration-properties-micronaut/6/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-configuration-properties-micronaut/6/css/guide.css
+++ b/guides/grails-configuration-properties-micronaut/6/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-configuration-properties/3/css/guide.css b/guides/grails-configuration-properties/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-configuration-properties/3/css/guide.css
+++ b/guides/grails-configuration-properties/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-configuration-properties/4/css/guide.css b/guides/grails-configuration-properties/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-configuration-properties/4/css/guide.css
+++ b/guides/grails-configuration-properties/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-controller-testing/3/css/guide.css b/guides/grails-controller-testing/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-controller-testing/3/css/guide.css
+++ b/guides/grails-controller-testing/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-controller-testing/4/css/guide.css b/guides/grails-controller-testing/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-controller-testing/4/css/guide.css
+++ b/guides/grails-controller-testing/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-custom-security-tenant-resolver/3/css/guide.css b/guides/grails-custom-security-tenant-resolver/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-custom-security-tenant-resolver/3/css/guide.css
+++ b/guides/grails-custom-security-tenant-resolver/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-custom-security-tenant-resolver/4/css/guide.css b/guides/grails-custom-security-tenant-resolver/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-custom-security-tenant-resolver/4/css/guide.css
+++ b/guides/grails-custom-security-tenant-resolver/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-database-migration/3/css/guide.css b/guides/grails-database-migration/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-database-migration/3/css/guide.css
+++ b/guides/grails-database-migration/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-database-migration/4/css/guide.css b/guides/grails-database-migration/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-database-migration/4/css/guide.css
+++ b/guides/grails-database-migration/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-database-migration/6/css/guide.css b/guides/grails-database-migration/6/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-database-migration/6/css/guide.css
+++ b/guides/grails-database-migration/6/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-docker-external-services/4/css/guide.css b/guides/grails-docker-external-services/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-docker-external-services/4/css/guide.css
+++ b/guides/grails-docker-external-services/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-dynamic-multiple-datasources/3/css/guide.css b/guides/grails-dynamic-multiple-datasources/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-dynamic-multiple-datasources/3/css/guide.css
+++ b/guides/grails-dynamic-multiple-datasources/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-dynamic-multiple-datasources/4/css/guide.css b/guides/grails-dynamic-multiple-datasources/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-dynamic-multiple-datasources/4/css/guide.css
+++ b/guides/grails-dynamic-multiple-datasources/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-elasticbeanstalk/4/css/guide.css b/guides/grails-elasticbeanstalk/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-elasticbeanstalk/4/css/guide.css
+++ b/guides/grails-elasticbeanstalk/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-elasticsearch/4/css/guide.css b/guides/grails-elasticsearch/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-elasticsearch/4/css/guide.css
+++ b/guides/grails-elasticsearch/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-email/3/css/guide.css b/guides/grails-email/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-email/3/css/guide.css
+++ b/guides/grails-email/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-email/4/css/guide.css b/guides/grails-email/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-email/4/css/guide.css
+++ b/guides/grails-email/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-events/3/css/guide.css b/guides/grails-events/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-events/3/css/guide.css
+++ b/guides/grails-events/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-events/4/css/guide.css b/guides/grails-events/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-events/4/css/guide.css
+++ b/guides/grails-events/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-fields-custom-widgets-and-wrappers/8/css/guide.css b/guides/grails-fields-custom-widgets-and-wrappers/8/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-fields-custom-widgets-and-wrappers/8/css/guide.css
+++ b/guides/grails-fields-custom-widgets-and-wrappers/8/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-file-download-excel/3/css/guide.css b/guides/grails-file-download-excel/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-file-download-excel/3/css/guide.css
+++ b/guides/grails-file-download-excel/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-file-download-excel/4/css/guide.css b/guides/grails-file-download-excel/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-file-download-excel/4/css/guide.css
+++ b/guides/grails-file-download-excel/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-geb-multiple-browsers/3/css/guide.css b/guides/grails-geb-multiple-browsers/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-geb-multiple-browsers/3/css/guide.css
+++ b/guides/grails-geb-multiple-browsers/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-geb-multiple-browsers/4/css/guide.css b/guides/grails-geb-multiple-browsers/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-geb-multiple-browsers/4/css/guide.css
+++ b/guides/grails-geb-multiple-browsers/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-google-cloud/4/css/guide.css b/guides/grails-google-cloud/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-google-cloud/4/css/guide.css
+++ b/guides/grails-google-cloud/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-google-home/4/css/guide.css b/guides/grails-google-home/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-google-home/4/css/guide.css
+++ b/guides/grails-google-home/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-gorm-data-services/3/css/guide.css b/guides/grails-gorm-data-services/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-gorm-data-services/3/css/guide.css
+++ b/guides/grails-gorm-data-services/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-gorm-data-services/4/css/guide.css b/guides/grails-gorm-data-services/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-gorm-data-services/4/css/guide.css
+++ b/guides/grails-gorm-data-services/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-javamelody/4/css/guide.css b/guides/grails-javamelody/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-javamelody/4/css/guide.css
+++ b/guides/grails-javamelody/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-logicaldelete/3/css/guide.css b/guides/grails-logicaldelete/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-logicaldelete/3/css/guide.css
+++ b/guides/grails-logicaldelete/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-logicaldelete/4/css/guide.css b/guides/grails-logicaldelete/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-logicaldelete/4/css/guide.css
+++ b/guides/grails-logicaldelete/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-micronaut-http/5/css/guide.css b/guides/grails-micronaut-http/5/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-micronaut-http/5/css/guide.css
+++ b/guides/grails-micronaut-http/5/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-micronaut-kafka/4/css/guide.css b/guides/grails-micronaut-kafka/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-micronaut-kafka/4/css/guide.css
+++ b/guides/grails-micronaut-kafka/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-mock-basics/3/css/guide.css b/guides/grails-mock-basics/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-mock-basics/3/css/guide.css
+++ b/guides/grails-mock-basics/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-mock-basics/4/css/guide.css b/guides/grails-mock-basics/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-mock-basics/4/css/guide.css
+++ b/guides/grails-mock-basics/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-mock-http-server/3/css/guide.css b/guides/grails-mock-http-server/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-mock-http-server/3/css/guide.css
+++ b/guides/grails-mock-http-server/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-mock-http-server/4/css/guide.css b/guides/grails-mock-http-server/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-mock-http-server/4/css/guide.css
+++ b/guides/grails-mock-http-server/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-mock-logging-slf4j-test/3/css/guide.css b/guides/grails-mock-logging-slf4j-test/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-mock-logging-slf4j-test/3/css/guide.css
+++ b/guides/grails-mock-logging-slf4j-test/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-mock-logging-slf4j-test/4/css/guide.css b/guides/grails-mock-logging-slf4j-test/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-mock-logging-slf4j-test/4/css/guide.css
+++ b/guides/grails-mock-logging-slf4j-test/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-multi-datasource/3/css/guide.css b/guides/grails-multi-datasource/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-multi-datasource/3/css/guide.css
+++ b/guides/grails-multi-datasource/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-multi-datasource/4/css/guide.css b/guides/grails-multi-datasource/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-multi-datasource/4/css/guide.css
+++ b/guides/grails-multi-datasource/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-multi-project-build/4/css/guide.css b/guides/grails-multi-project-build/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-multi-project-build/4/css/guide.css
+++ b/guides/grails-multi-project-build/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-oauth-google/4/css/guide.css b/guides/grails-oauth-google/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-oauth-google/4/css/guide.css
+++ b/guides/grails-oauth-google/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-oauth-twitter/4/css/guide.css b/guides/grails-oauth-twitter/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-oauth-twitter/4/css/guide.css
+++ b/guides/grails-oauth-twitter/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-on-circleci-basics/4/css/guide.css b/guides/grails-on-circleci-basics/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-on-circleci-basics/4/css/guide.css
+++ b/guides/grails-on-circleci-basics/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-on-github-actions/4/css/guide.css b/guides/grails-on-github-actions/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-on-github-actions/4/css/guide.css
+++ b/guides/grails-on-github-actions/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-on-travis-basics/3/css/guide.css b/guides/grails-on-travis-basics/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-on-travis-basics/3/css/guide.css
+++ b/guides/grails-on-travis-basics/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-on-travis-basics/4/css/guide.css b/guides/grails-on-travis-basics/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-on-travis-basics/4/css/guide.css
+++ b/guides/grails-on-travis-basics/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-quickcast-logging/4/css/guide.css b/guides/grails-quickcast-logging/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-quickcast-logging/4/css/guide.css
+++ b/guides/grails-quickcast-logging/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-quickcasts-angularjs-scaffolding-with-grails-3/4/css/guide.css b/guides/grails-quickcasts-angularjs-scaffolding-with-grails-3/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-quickcasts-angularjs-scaffolding-with-grails-3/4/css/guide.css
+++ b/guides/grails-quickcasts-angularjs-scaffolding-with-grails-3/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-quickcasts-developing-grails-3-applications-with-intellij-idea/4/css/guide.css b/guides/grails-quickcasts-developing-grails-3-applications-with-intellij-idea/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-quickcasts-developing-grails-3-applications-with-intellij-idea/4/css/guide.css
+++ b/guides/grails-quickcasts-developing-grails-3-applications-with-intellij-idea/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-quickcasts-interceptors/4/css/guide.css b/guides/grails-quickcasts-interceptors/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-quickcasts-interceptors/4/css/guide.css
+++ b/guides/grails-quickcasts-interceptors/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-quickcasts-json-views/4/css/guide.css b/guides/grails-quickcasts-json-views/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-quickcasts-json-views/4/css/guide.css
+++ b/guides/grails-quickcasts-json-views/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-quickcasts-multi-project-builds/4/css/guide.css b/guides/grails-quickcasts-multi-project-builds/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-quickcasts-multi-project-builds/4/css/guide.css
+++ b/guides/grails-quickcasts-multi-project-builds/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-quickcasts-retrieving-config-values/4/css/guide.css b/guides/grails-quickcasts-retrieving-config-values/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-quickcasts-retrieving-config-values/4/css/guide.css
+++ b/guides/grails-quickcasts-retrieving-config-values/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-rabbitmq/4/css/guide.css b/guides/grails-rabbitmq/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-rabbitmq/4/css/guide.css
+++ b/guides/grails-rabbitmq/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-restapi-angularjs/4/css/guide.css b/guides/grails-restapi-angularjs/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-restapi-angularjs/4/css/guide.css
+++ b/guides/grails-restapi-angularjs/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-scheduled/3/css/guide.css b/guides/grails-scheduled/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-scheduled/3/css/guide.css
+++ b/guides/grails-scheduled/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-scheduled/4/css/guide.css b/guides/grails-scheduled/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-scheduled/4/css/guide.css
+++ b/guides/grails-scheduled/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-schwartz/4/css/guide.css b/guides/grails-schwartz/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-schwartz/4/css/guide.css
+++ b/guides/grails-schwartz/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-soap/3/css/guide.css b/guides/grails-soap/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-soap/3/css/guide.css
+++ b/guides/grails-soap/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-soap/4/css/guide.css b/guides/grails-soap/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-soap/4/css/guide.css
+++ b/guides/grails-soap/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-spring-security-core-plugin-custom-authentication/3/css/guide.css b/guides/grails-spring-security-core-plugin-custom-authentication/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-spring-security-core-plugin-custom-authentication/3/css/guide.css
+++ b/guides/grails-spring-security-core-plugin-custom-authentication/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-spring-security-core-plugin-custom-authentication/4/css/guide.css b/guides/grails-spring-security-core-plugin-custom-authentication/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-spring-security-core-plugin-custom-authentication/4/css/guide.css
+++ b/guides/grails-spring-security-core-plugin-custom-authentication/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-taglib-wyswyg-trix/3/css/guide.css b/guides/grails-taglib-wyswyg-trix/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-taglib-wyswyg-trix/3/css/guide.css
+++ b/guides/grails-taglib-wyswyg-trix/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-taglib-wyswyg-trix/4/css/guide.css b/guides/grails-taglib-wyswyg-trix/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-taglib-wyswyg-trix/4/css/guide.css
+++ b/guides/grails-taglib-wyswyg-trix/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-test-domain-class-constraints/3/css/guide.css b/guides/grails-test-domain-class-constraints/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-test-domain-class-constraints/3/css/guide.css
+++ b/guides/grails-test-domain-class-constraints/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-test-domain-class-constraints/4/css/guide.css b/guides/grails-test-domain-class-constraints/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-test-domain-class-constraints/4/css/guide.css
+++ b/guides/grails-test-domain-class-constraints/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-test-security/3/css/guide.css b/guides/grails-test-security/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-test-security/3/css/guide.css
+++ b/guides/grails-test-security/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-test-security/4/css/guide.css b/guides/grails-test-security/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-test-security/4/css/guide.css
+++ b/guides/grails-test-security/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-tvmlapp/3/css/guide.css b/guides/grails-tvmlapp/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-tvmlapp/3/css/guide.css
+++ b/guides/grails-tvmlapp/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-tvmlapp/4/css/guide.css b/guides/grails-tvmlapp/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-tvmlapp/4/css/guide.css
+++ b/guides/grails-tvmlapp/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-upload-file/3/css/guide.css b/guides/grails-upload-file/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-upload-file/3/css/guide.css
+++ b/guides/grails-upload-file/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-upload-file/4/css/guide.css b/guides/grails-upload-file/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-upload-file/4/css/guide.css
+++ b/guides/grails-upload-file/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-vs-nodejs/4/css/guide.css b/guides/grails-vs-nodejs/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-vs-nodejs/4/css/guide.css
+++ b/guides/grails-vs-nodejs/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-vue-combined/4/css/guide.css b/guides/grails-vue-combined/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-vue-combined/4/css/guide.css
+++ b/guides/grails-vue-combined/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails-yourkit-profiling/4/css/guide.css b/guides/grails-yourkit-profiling/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails-yourkit-profiling/4/css/guide.css
+++ b/guides/grails-yourkit-profiling/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails_i18n/3/css/guide.css b/guides/grails_i18n/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails_i18n/3/css/guide.css
+++ b/guides/grails_i18n/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails_i18n/4/css/guide.css b/guides/grails_i18n/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails_i18n/4/css/guide.css
+++ b/guides/grails_i18n/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/grails_url_mappings/4/css/guide.css b/guides/grails_url_mappings/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/grails_url_mappings/4/css/guide.css
+++ b/guides/grails_url_mappings/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/neo4j-movies/4/css/guide.css b/guides/neo4j-movies/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/neo4j-movies/4/css/guide.css
+++ b/guides/neo4j-movies/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/querying-gorm-dynamic-finders/3/css/guide.css b/guides/querying-gorm-dynamic-finders/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/querying-gorm-dynamic-finders/3/css/guide.css
+++ b/guides/querying-gorm-dynamic-finders/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/querying-gorm-dynamic-finders/4/css/guide.css b/guides/querying-gorm-dynamic-finders/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/querying-gorm-dynamic-finders/4/css/guide.css
+++ b/guides/querying-gorm-dynamic-finders/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/react-combined/4/css/guide.css b/guides/react-combined/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/react-combined/4/css/guide.css
+++ b/guides/react-combined/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/react-spring-security/4/css/guide.css b/guides/react-spring-security/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/react-spring-security/4/css/guide.css
+++ b/guides/react-spring-security/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/rest-hibernate/3/css/guide.css b/guides/rest-hibernate/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/rest-hibernate/3/css/guide.css
+++ b/guides/rest-hibernate/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/rest-hibernate/4/css/guide.css b/guides/rest-hibernate/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/rest-hibernate/4/css/guide.css
+++ b/guides/rest-hibernate/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/rest-mongodb/4/css/guide.css b/guides/rest-mongodb/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/rest-mongodb/4/css/guide.css
+++ b/guides/rest-mongodb/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/server-sent-events/3/css/guide.css b/guides/server-sent-events/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/server-sent-events/3/css/guide.css
+++ b/guides/server-sent-events/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/server-sent-events/4/css/guide.css b/guides/server-sent-events/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/server-sent-events/4/css/guide.css
+++ b/guides/server-sent-events/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/using-hal-with-json-views/3/css/guide.css b/guides/using-hal-with-json-views/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/using-hal-with-json-views/3/css/guide.css
+++ b/guides/using-hal-with-json-views/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/using-hal-with-json-views/4/css/guide.css b/guides/using-hal-with-json-views/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/using-hal-with-json-views/4/css/guide.css
+++ b/guides/using-hal-with-json-views/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/using-the-react-profile/4/css/guide.css b/guides/using-the-react-profile/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/using-the-react-profile/4/css/guide.css
+++ b/guides/using-the-react-profile/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/using-the-vue-profile/3/css/guide.css b/guides/using-the-vue-profile/3/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/using-the-vue-profile/3/css/guide.css
+++ b/guides/using-the-vue-profile/3/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/using-the-vue-profile/4/css/guide.css b/guides/using-the-vue-profile/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/using-the-vue-profile/4/css/guide.css
+++ b/guides/using-the-vue-profile/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/guides/vaadin-grails/4/css/guide.css b/guides/vaadin-grails/4/css/guide.css
index 53146135eb0..7471d71ca4e 100644
--- a/guides/vaadin-grails/4/css/guide.css
+++ b/guides/vaadin-grails/4/css/guide.css
@@ -275,8 +275,9 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
  * AsciiDoc renders a <div class="contribute-btn"><button class="btn btn-default">
  * after every <h1>/<h2>. The legacy treatment was a screaming orange CTA
  * directly under each heading, which competed with the heading itself for
- * attention. Demote it to a subtle right-aligned link with a pencil glyph,
- * GitHub-style. */
+ * attention. Render it as a calm, GitHub-style outlined button that is
+ * visible at rest (subtle background + border) and gains a colour accent
+ * on hover, instead of only revealing button chrome on hover. */
 .contribute-btn {
 	float: right;
 	margin: -28px 0 0 12px;
@@ -285,10 +286,10 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 
 .contribute-btn button.btn,
 .contribute-btn button.btn-default {
-	background: transparent !important;
-	background-color: transparent !important;
+	background: #f6f8fa !important;
+	background-color: #f6f8fa !important;
 	background-image: none !important;
-	border: 1px solid transparent !important;
+	border: 1px solid #d0d7de !important;
 	border-radius: 6px !important;
 	color: #6b7280 !important;
 	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
@@ -306,8 +307,8 @@ body.guide article.guide aside button.btn-large + ul.githublinks + .input-group
 .contribute-btn button.btn:hover,
 .contribute-btn button.btn-default:hover {
 	color: #0969da !important;
-	background-color: #f6f8fa !important;
-	border-color: #d0d7de !important;
+	background-color: #eaeef2 !important;
+	border-color: #afb8c1 !important;
 }
 
 .contribute-btn .fa,
diff --git a/rss.xml b/rss.xml
index 38530bb643d..79871d1d0b5 100644
--- a/rss.xml
+++ b/rss.xml
@@ -1,4 +1,4 @@
-<?xml version="1.0" encoding="UTF-8"?><rss xmlns:content="http://purl.org/rss/1.0/modules/content/" version="2.0"><channel><title>Blog | Grails Framework</title><link>https://grails.apache.org</link><description>A powerful Groovy-based web application framework for the JVM built on top of Spring Boot</description><pubDate>Sun, 03 May 2026 12:28:22 GMT</pubDate><item><title>James Daugherty and Mattias Reichel Named 2026 GrailsĀ® Community Rock Stars</title><link>https://grails.apache.org/b [...]
+<?xml version="1.0" encoding="UTF-8"?><rss xmlns:content="http://purl.org/rss/1.0/modules/content/" version="2.0"><channel><title>Blog | Grails Framework</title><link>https://grails.apache.org</link><description>A powerful Groovy-based web application framework for the JVM built on top of Spring Boot</description><pubDate>Sun, 03 May 2026 14:09:16 GMT</pubDate><item><title>James Daugherty and Mattias Reichel Named 2026 GrailsĀ® Community Rock Stars</title><link>https://grails.apache.org/b [...]
 <p>The Grails Community is thrilled to kick off 2026 by recognizing two outstanding volunteers for their exceptional contributions. As we continue to build on the momentum from Grails 7 and look ahead to future innovations, it's community leaders like these who drive the framework forward.</p>
 <p>This year, we're proud to award the <a href="/community.html">Grails Community Rock Star</a> honors to <a href="https://github.com/jdaugherty">James Daugherty</a> and <a href="https://github.com/matrei">Mattias Reichel</a>. Both have demonstrated unwavering dedication through code contributions, build improvements, documentation, plugin development, community support, and leadership in advancing Grails. Without their thousands of hours of volunteer work, Grails 7 and the successful tr [...]
 <h2>Mattias Reichel</h2>