From 3a73ad39954e48dce7270971b11228109f064633 Mon Sep 17 00:00:00 2001 From: p4gs <10093271+p4gs@users.noreply.github.com> Date: Wed, 30 Sep 2026 11:10:10 -0400 Subject: [PATCH] Home page: quote the Cheat Sheet's definition of GRC Engineering; nav points Teachings at the Cheat Sheet - Adds a styled definition block between the manifesto's first and second paragraphs, quoting the GRC Engineering definition from cheatsheet.grc.engineering with its blue/orange highlights, links to the Cheat Sheet's Governance/Risk/Compliance terms, a source line pointing at #grc-engineering, and an "Explore the Cheat Sheet" button. Light and dark schemes both styled. - Replaces the "Learning Hub" nav entry with "Teachings", linking to cheatsheet.grc.engineering/#teachings. learning-hub.md is left in place (no longer in the nav) so existing links to /learning-hub/ keep working. Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_0119cVhm2sz5U7Dv5adTWRFf --- docs/index.md | 11 ++++ docs/stylesheets/extra.css | 118 ++++++++++++++++++++++++++++++++++++- mkdocs.yml | 2 +- 3 files changed, 129 insertions(+), 2 deletions(-) diff --git a/docs/index.md b/docs/index.md index 51b1246..0eedc03 100644 --- a/docs/index.md +++ b/docs/index.md @@ -2,6 +2,17 @@ GRC Engineering is a step-change evolution in security governance, risk, and compliance (GRC), and related disciplines such as trust and assurance. It’s more than just “GRC + writing code.” It’s a fundamental shift in how GRC is done, one that fully embraces an engineering mindset (broadly speaking), [systems thinking](https://en.m.wikipedia.org/wiki/Systems_thinking) and [design thinking](https://en.m.wikipedia.org/wiki/Design_thinking), and a customer-centric focus around how best to deliver GRC outcomes. +
+

What is GRC Engineering?

+
+

GRC Engineering is the practice of using science, math, user-centered design, and modern software development to assure an organization reliably achieves objectives, addresses uncertainty, and acts with integrity, all while continuously improving its efficiency, productivity, and systems.

+
+
+ — The GRC Engineering Cheat Sheet + Explore the Cheat Sheet → +
+
+ We see the [organic interest](https://www.reddit.com/r/cybersecurity/comments/18efir2/grc_engineering/) and momentum that is growing around GRC Engineering as an opportunity to bring our community together with a shared definition of what GRC Engineering is as well as a shared focus on advancing it together before it’s co-opted and constrained by commercial interests. As a group of impassioned GRC practitioners, we seek to propel GRC into the modern era so it can: diff --git a/docs/stylesheets/extra.css b/docs/stylesheets/extra.css index d2125b2..18f209e 100644 --- a/docs/stylesheets/extra.css +++ b/docs/stylesheets/extra.css @@ -112,4 +112,120 @@ td:nth-child(2) { box-shadow: var(--md-shadow-z1); color: var(--md-admonition-fg-color); transition: box-shadow 500ms; -} \ No newline at end of file +} +/* ── Cheat Sheet definition quote (home page, between intro paragraphs) ── */ +.md-typeset .grce-definition { + position: relative; + margin: 2em 0 2.2em; + padding: 1.6em 1.8em 1.4em 2em; + border-radius: 12px; + background: + radial-gradient(120% 140% at 0% 0%, rgba(255, 168, 79, 0.10) 0%, transparent 55%), + radial-gradient(120% 140% at 100% 100%, rgba(27, 149, 193, 0.10) 0%, transparent 55%), + var(--md-code-bg-color); + box-shadow: var(--md-shadow-z1); + overflow: hidden; + text-align: left; +} +.md-typeset .grce-definition::before { + content: ""; + position: absolute; + inset: 0 auto 0 0; + width: 4px; + background: linear-gradient(180deg, #ffa84fff 0%, #1b95c1ff 100%); +} +.md-typeset .grce-definition::after { + content: "\201C"; + position: absolute; + top: -0.12em; + right: 0.25em; + font-family: Georgia, "Times New Roman", serif; + font-size: 7em; + line-height: 1; + color: #1b95c1ff; + opacity: 0.12; + pointer-events: none; +} +.md-typeset .grce-definition__eyebrow { + margin: 0 0 0.6em; + font-size: 0.72em; + font-weight: 700; + letter-spacing: 0.16em; + text-transform: uppercase; + color: var(--md-default-fg-color--light); +} +.md-typeset .grce-definition blockquote { + margin: 0; + padding: 0; + border: 0; + color: var(--md-typeset-color); +} +.md-typeset .grce-definition blockquote p { + margin: 0; + font-size: 1.12em; + line-height: 1.75; +} +.md-typeset .grce-hl { + padding: 0 0.1em; + -webkit-box-decoration-break: clone; + box-decoration-break: clone; +} +.md-typeset .grce-hl--blue { + background: linear-gradient(transparent 62%, rgba(27, 149, 193, 0.28) 62%); +} +.md-typeset .grce-hl--orange { + background: linear-gradient(transparent 62%, rgba(255, 168, 79, 0.40) 62%); +} +.md-typeset .grce-definition blockquote a { + color: inherit; + text-decoration: underline; + text-decoration-color: currentColor; + text-decoration-thickness: 1px; + text-underline-offset: 3px; +} +.md-typeset .grce-definition blockquote a:hover { + color: var(--md-typeset-a-color); +} +.md-typeset .grce-definition figcaption { + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: space-between; + gap: 0.6em 1.2em; + max-width: none; + margin: 1.1em 0 0; + font-size: 0.85em; + font-style: normal; + color: var(--md-default-fg-color--light); +} +.md-typeset .grce-definition__cta { + display: inline-block; + padding: 0.45em 1em; + border-radius: 999px; + font-weight: 700; + color: #ffffff !important; + background: linear-gradient(100deg, #ffa84fff 0%, #1b95c1ff 100%); + text-decoration: none; + transition: filter 200ms, transform 200ms !important; +} +.md-typeset .grce-definition__cta:hover { + filter: brightness(1.08); + transform: translateY(-1px); +} +[data-md-color-scheme="grcengineering-dark"] .md-typeset .grce-definition { + background: + radial-gradient(120% 140% at 0% 0%, rgba(255, 168, 79, 0.12) 0%, transparent 55%), + radial-gradient(120% 140% at 100% 100%, rgba(27, 149, 193, 0.14) 0%, transparent 55%), + #0c1117; + box-shadow: 0 0 0 1px #ffffff1f; +} +[data-md-color-scheme="grcengineering-dark"] .md-typeset .grce-hl--blue { + background: linear-gradient(transparent 62%, rgba(27, 149, 193, 0.45) 62%); +} +[data-md-color-scheme="grcengineering-dark"] .md-typeset .grce-hl--orange { + background: linear-gradient(transparent 62%, rgba(255, 168, 79, 0.38) 62%); +} +@media screen and (max-width: 44.9375em) { + .md-typeset .grce-definition { padding: 1.3em 1.2em 1.2em 1.4em; } + .md-typeset .grce-definition blockquote p { font-size: 1.02em; } +} diff --git a/mkdocs.yml b/mkdocs.yml index 3ded6eb..d93f956 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -5,7 +5,7 @@ repo_name: grcengineering edit_uri: edit/main/docs/index.md nav: - index.md - - Learning Hub: learning-hub.md + - Teachings: "https://cheatsheet.grc.engineering/#teachings" - Blog: "https://blog.grc.engineering" - Projects: projects.md extra_css: