From c479130069b4d0f2814e5d9857d6e68ff9bb358f Mon Sep 17 00:00:00 2001
From: Marco Janotta <marcojntt@gmail.com>
Date: Mon, 3 May 2021 11:17:35 +0200
Subject: [PATCH] Add logo to site menu

---
 static/404.html                                  |  2 +-
 static/articles/grapheneos-servers.html          |  2 +-
 static/articles/index.html                       |  2 +-
 static/articles/server-traffic-shaping.html      |  2 +-
 .../sitewide-advertising-industry-opt-out.html   |  2 +-
 static/build.html                                |  2 +-
 static/contact.html                              |  2 +-
 static/donate.html                               |  2 +-
 static/faq.html                                  |  2 +-
 static/features.html                             |  2 +-
 static/grapheneos.css                            | 16 +++++++++++++++-
 static/history/copperheados.html                 |  2 +-
 static/history/index.html                        |  2 +-
 static/history/legacy-changelog.html             |  2 +-
 static/index.html                                |  2 +-
 static/install/cli.html                          |  2 +-
 static/install/index.html                        |  2 +-
 static/install/web.html                          |  2 +-
 static/pdfviewer-privacy-policy.html             |  2 +-
 static/releases.html                             |  2 +-
 static/source.html                               |  2 +-
 static/usage.html                                |  2 +-
 22 files changed, 36 insertions(+), 22 deletions(-)

diff --git a/static/404.html b/static/404.html
index 5871c2a3..daf6d8bb 100644
--- a/static/404.html
+++ b/static/404.html
@@ -29,7 +29,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/articles/grapheneos-servers.html b/static/articles/grapheneos-servers.html
index 37614a3d..a8383a39 100644
--- a/static/articles/grapheneos-servers.html
+++ b/static/articles/grapheneos-servers.html
@@ -31,7 +31,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/articles/index.html b/static/articles/index.html
index 07b14126..fc12f3a4 100644
--- a/static/articles/index.html
+++ b/static/articles/index.html
@@ -31,7 +31,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/articles/server-traffic-shaping.html b/static/articles/server-traffic-shaping.html
index 4cbf734b..3488b269 100644
--- a/static/articles/server-traffic-shaping.html
+++ b/static/articles/server-traffic-shaping.html
@@ -31,7 +31,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/articles/sitewide-advertising-industry-opt-out.html b/static/articles/sitewide-advertising-industry-opt-out.html
index bc681802..66b61671 100644
--- a/static/articles/sitewide-advertising-industry-opt-out.html
+++ b/static/articles/sitewide-advertising-industry-opt-out.html
@@ -31,7 +31,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/build.html b/static/build.html
index f2e47960..da9e51a3 100644
--- a/static/build.html
+++ b/static/build.html
@@ -32,7 +32,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li aria-current="page"><a href="/build">Build</a></li>
diff --git a/static/contact.html b/static/contact.html
index 516847f0..754261f1 100644
--- a/static/contact.html
+++ b/static/contact.html
@@ -31,7 +31,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/donate.html b/static/donate.html
index dbcdbd95..f2ae2639 100644
--- a/static/donate.html
+++ b/static/donate.html
@@ -31,7 +31,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/faq.html b/static/faq.html
index e718a11f..4ab0a793 100644
--- a/static/faq.html
+++ b/static/faq.html
@@ -32,7 +32,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/features.html b/static/features.html
index 342fcb49..1059241d 100644
--- a/static/features.html
+++ b/static/features.html
@@ -31,7 +31,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li aria-current="page"><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/grapheneos.css b/static/grapheneos.css
index dec5f69d..a12ca78a 100644
--- a/static/grapheneos.css
+++ b/static/grapheneos.css
@@ -61,10 +61,12 @@ code {
 #site-menu {
     background-color: #212121; /* grey900 */
     box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
+    white-space: nowrap;
 }
 
 #site-menu ul li {
     list-style-type: none;
+    display: flex;
 }
 
 #site-menu ul li:hover {
@@ -73,9 +75,10 @@ code {
 
 #site-menu ul li a {
     color: #fff; /* 100% white */
-    display: block;
+    display: flex;
     text-decoration: none;
     padding: 1em;
+    align-items: center;
 }
 
 #site-menu ul li a:visited {
@@ -86,6 +89,17 @@ code {
     color: #64b5f6; /* blue300 */
 }
 
+#site-menu img {
+    height: 1.8rem;
+    filter: invert(100);
+    vertical-align: middle;
+    margin-right: 0.5rem;
+}
+
+#site-menu ul li[aria-current] img {
+    filter: invert(67%) sepia(13%) saturate(3136%) hue-rotate(180deg) brightness(102%) contrast(93%);
+}
+
 main {
     margin-left: auto;
     margin-right: auto;
diff --git a/static/history/copperheados.html b/static/history/copperheados.html
index 9aead560..c2896cf1 100644
--- a/static/history/copperheados.html
+++ b/static/history/copperheados.html
@@ -31,7 +31,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/history/index.html b/static/history/index.html
index 5faee2ab..9701bd5e 100644
--- a/static/history/index.html
+++ b/static/history/index.html
@@ -31,7 +31,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/history/legacy-changelog.html b/static/history/legacy-changelog.html
index 8ffc6546..4b60645f 100644
--- a/static/history/legacy-changelog.html
+++ b/static/history/legacy-changelog.html
@@ -31,7 +31,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/index.html b/static/index.html
index 3830fabf..2e36174f 100644
--- a/static/index.html
+++ b/static/index.html
@@ -32,7 +32,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li aria-current="page"><a href="/">GrapheneOS</a></li>
+                    <li aria-current="page"><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/install/cli.html b/static/install/cli.html
index 08ce4cdf..a8a592a6 100644
--- a/static/install/cli.html
+++ b/static/install/cli.html
@@ -32,7 +32,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/install/index.html b/static/install/index.html
index d9603c7f..d118aa56 100644
--- a/static/install/index.html
+++ b/static/install/index.html
@@ -32,7 +32,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li aria-current="page"><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/install/web.html b/static/install/web.html
index 2dbc07dc..69d53e42 100644
--- a/static/install/web.html
+++ b/static/install/web.html
@@ -34,7 +34,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/pdfviewer-privacy-policy.html b/static/pdfviewer-privacy-policy.html
index fe8e7b28..c7ad6e98 100644
--- a/static/pdfviewer-privacy-policy.html
+++ b/static/pdfviewer-privacy-policy.html
@@ -31,7 +31,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/releases.html b/static/releases.html
index f656acc3..93c55da9 100644
--- a/static/releases.html
+++ b/static/releases.html
@@ -34,7 +34,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/source.html b/static/source.html
index a21d267a..f194d937 100644
--- a/static/source.html
+++ b/static/source.html
@@ -31,7 +31,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>
diff --git a/static/usage.html b/static/usage.html
index 339f313d..796ceb20 100644
--- a/static/usage.html
+++ b/static/usage.html
@@ -32,7 +32,7 @@
         <header>
             <nav id="site-menu">
                 <ul>
-                    <li><a href="/">GrapheneOS</a></li>
+                    <li><a href="/"><img src="/mask-icon.svg" alt="GrapheneOS logo"/>GrapheneOS</a></li>
                     <li><a href="/features">Features</a></li>
                     <li><a href="/install/">Install</a></li>
                     <li><a href="/build">Build</a></li>