From ce2705a84c7c218fadaf4d96c0d1c92a9c998f17 Mon Sep 17 00:00:00 2001
From: Rex P <rexpan@google.com>
Date: Fri, 31 Jan 2025 11:57:19 +1100
Subject: [PATCH] Polish up documentation CSS and font

---
 docs/_sass/color_schemes/_variables.scss  |  4 +++-
 docs/_sass/color_schemes/custom_dark.scss |  2 +-
 docs/_sass/custom/custom.scss             | 13 +++++++++++++
 docs/_sass/highlight/native.scss          |  9 +++++----
 docs/supported_languages_and_lockfiles.md |  6 +++---
 docs/usage.md                             |  2 +-
 6 files changed, 26 insertions(+), 10 deletions(-)

diff --git a/docs/_sass/color_schemes/_variables.scss b/docs/_sass/color_schemes/_variables.scss
index a22ca6aa49d..f87a45502ad 100644
--- a/docs/_sass/color_schemes/_variables.scss
+++ b/docs/_sass/color_schemes/_variables.scss
@@ -31,7 +31,9 @@ $red-200: #e94c4c !default;
 $red-300: #dd2e2e !default;
 
 $body-font-family:
-  "Overpass",
+  "Source Sans 3",
   system-ui,
   -apple-system,
   sans-serif;
+
+$mono-font-family: consolas, monospace;
diff --git a/docs/_sass/color_schemes/custom_dark.scss b/docs/_sass/color_schemes/custom_dark.scss
index ddffac3edf5..941d63dc292 100644
--- a/docs/_sass/color_schemes/custom_dark.scss
+++ b/docs/_sass/color_schemes/custom_dark.scss
@@ -1,6 +1,6 @@
 @import "./variables";
 @import "../highlight/native.scss";
-@import url("https://fonts.googleapis.com/css2?family=Overpass:ital,wght@0,100..900;1,100..900&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap");
 
 $new-body-background-color: #292929;
 
diff --git a/docs/_sass/custom/custom.scss b/docs/_sass/custom/custom.scss
index 6655e9df4e7..ead925feffb 100644
--- a/docs/_sass/custom/custom.scss
+++ b/docs/_sass/custom/custom.scss
@@ -8,3 +8,16 @@
 .nav-list .nav-list-expander {
   display: none !important;
 }
+
+:not(pre, figure) code {
+  padding: 0.2rem 0.35rem !important;
+  font-size: 0.85em;
+}
+
+table {
+  border-collapse: collapse;
+
+  th {
+    border-bottom-width: 2px;
+  }
+}
diff --git a/docs/_sass/highlight/native.scss b/docs/_sass/highlight/native.scss
index c28adea85cb..77a0319c589 100644
--- a/docs/_sass/highlight/native.scss
+++ b/docs/_sass/highlight/native.scss
@@ -1,14 +1,15 @@
 // Based on https://github.com/dwayne/sass-pygments/blob/master/styles/scss/native.scss
 
 .highlight,
-pre.highlight {
+pre.highlight,
+.highlight code {
+  color: #d0d0d0;
+  background: #202020;
+
   .hll {
     background-color: #404040;
   }
 
-  color: #d0d0d0;
-  background: #202020;
-
   .c {
     color: #999999;
     font-style: italic;
diff --git a/docs/supported_languages_and_lockfiles.md b/docs/supported_languages_and_lockfiles.md
index 45c7c9562f5..39d480d16e3 100644
--- a/docs/supported_languages_and_lockfiles.md
+++ b/docs/supported_languages_and_lockfiles.md
@@ -20,7 +20,7 @@ nav_order: 2
 
 Artifact and manifest extraction logic is implemented in [OSV-Scalibr](https://github.com/google/osv-scalibr) as a standalone library. OSV-Scanner tightly integrates with OSV-Scalibr to provide a end to end vulnerability scanner for developers.
 
-### Core Concept
+## Core Concept
 
 We split the files we can scan into two broad categories, **artifacts** and **manifests**.
 
@@ -105,7 +105,7 @@ If you have a custom lockfile that we do not support or prefer to do your own cu
 
 Once you extracted your own dependency information, place it in a `osv-scanner.json` file, with the same format as the JSON output of osv-scanner, e.g.:
 
-```
+```jsonc
 {
   "results": [
     {
@@ -122,7 +122,7 @@ Once you extracted your own dependency information, place it in a `osv-scanner.j
             "version": "1.2.3",
             "ecosystem": "npm"
           }
-        },
+        }
         // ...
       ]
     }
diff --git a/docs/usage.md b/docs/usage.md
index f5dd3d48f5d..24c5a584a43 100644
--- a/docs/usage.md
+++ b/docs/usage.md
@@ -21,7 +21,7 @@ This documentation is for the beta V2 release. For the older, V1 release documen
 {:toc}
 </details>
 
-### Core Concepts
+## Core Concept
 
 OSV-Scanner operates in a two-step process: