From 62ac0c54c3a68cd62d3463ed8a8cee00f8d6b6f9 Mon Sep 17 00:00:00 2001
From: dmc <dave@holepunch.to>
Date: Mon, 15 Jan 2024 21:10:58 +0100
Subject: [PATCH] code styles

---
 lib/docs-viewer.js   | 12 ++++++++++--
 lib/system-status.js | 23 ++++++++++++++++++++---
 pulse.html           |  1 +
 3 files changed, 31 insertions(+), 5 deletions(-)

diff --git a/lib/docs-viewer.js b/lib/docs-viewer.js
index 13e30e4..fa54ac3 100644
--- a/lib/docs-viewer.js
+++ b/lib/docs-viewer.js
@@ -22,8 +22,16 @@ customElements.define('docs-viewer', class extends HTMLElement {
         a:visited, a:active, a { color: #B0D944; outline: none; text-decoration: none;  }
         #panel.light a, #panel.light a:visited, #panel.light a:active { color: #7c9735; font-weight: bold; }
         h1 { padding: .5rem; border-right: 1px solid #B0D944; border-bottom: 1px solid #B0D944; display: inline-block; padding-right: 0.75em; padding-left: 0.5em; }
-        code {  background: #333; color: #efeaea; padding: .25rem; }
-        pre > code { display: block; line-height: 1.025rem; padding-left: 1em; }
+        code {
+          background: #3a4816;
+          color: #efeaea;
+          padding: 0.25rem;
+          padding-top: 0.1rem;
+          padding-bottom: 0.15rem;
+          font-family: 'overpass-mono';
+          border-radius: 1px;
+        }
+        pre > code { display: block; line-height: 1.025rem; padding-left: 1em; background: #181e19 }
         h1, h2, h3, h4, h5, h6 { font-weight: bold; }
         h1 { font-size: 1.6rem; }
         h2 { font-size: 1.4rem; }
diff --git a/lib/system-status.js b/lib/system-status.js
index 1829f74..7349954 100644
--- a/lib/system-status.js
+++ b/lib/system-status.js
@@ -18,6 +18,15 @@ customElements.define('pear-welcome', class extends HTMLElement {
         blockquote::before { content: "✔"; float: left; font-size: 1.625rem; margin-left: 1rem; margin-right: 0.625rem; }
         video { float: right; outline: 1px solid #323532; border-radius: 2px; }
         #welcome { float: left; width: calc(100% - 420px); }
+        code {
+          background: #3a4816;
+          color: #efeaea;
+          padding: 0.25rem;
+          padding-top: 0.1rem;
+          padding-bottom: 0.15rem;
+          font-family: 'overpass-mono';
+          border-radius: 1px;
+        }
       </style>
       <blockquote>
         <p> Pear is in the system PATH and ready to go .</p>
@@ -25,8 +34,8 @@ customElements.define('pear-welcome', class extends HTMLElement {
       <div id="welcome">
         <h2> Welcome... </h2>
         <p> ...to the Internet of Peers. <p>
-        <p> Pear provides the \`pear\` Command-line Interface as the primary interface for developing, sharing & maintaining unstoppable peer-to-peer applications and systems. </p>
-        <p> To get started, open a terminal, type \`pear\` and hit return. </p>
+        <p> Pear provides the <code>pear</code> Command-line Interface as the primary interface for developing, sharing & maintaining unstoppable peer-to-peer applications and systems. </p>
+        <p> To get started, open a terminal, type <code>pear</code> and hit return. </p>
       </div>
       <video width="420" height="390" autoplay muted>
         <source src="./assets/usage.mp4" type="video/mp4">
@@ -56,7 +65,15 @@ customElements.define('system-status', class extends HTMLElement {
         blockquote::before { content: "ℹ"; float: left; font-size: 1.625rem; margin-left: 1rem; margin-right: 0.625rem; }
         button { background: #151517; color: #B0D944; border: 1px solid; padding: .575em .65em; cursor: pointer; margin-top: 2.65rem; font-size: 1.25rem; }
         #tip { text-indent: 4px; margin-top: -.25rem }
-        code { padding: .25rem; }
+        code {
+          background: #3a4816;
+          color: #efeaea;
+          padding: 0.25rem;
+          padding-top: 0.1rem;
+          padding-bottom: 0.15rem;
+          font-family: 'overpass-mono';
+          border-radius: 1px;
+        }
         #tip > p { margin: 0; padding: 0}
         h1 { 
           padding: 0.5rem;
diff --git a/pulse.html b/pulse.html
index 69671a9..765918c 100644
--- a/pulse.html
+++ b/pulse.html
@@ -137,6 +137,7 @@
     header:has(~ #documentation:target) > #headin > #home {
       display: inline;
     }
+
   </style>
   <header>
     <div id="headin">