Add logo to site menu
This commit is contained in:
parent
ecec6b01f3
commit
c479130069
@ -29,7 +29,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -31,7 +31,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -31,7 +31,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -31,7 +31,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -31,7 +31,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -32,7 +32,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li aria-current="page"><a href="/build">Build</a></li>
|
<li aria-current="page"><a href="/build">Build</a></li>
|
||||||
|
@ -31,7 +31,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -31,7 +31,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -32,7 +32,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -31,7 +31,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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 aria-current="page"><a href="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -61,10 +61,12 @@ code {
|
|||||||
#site-menu {
|
#site-menu {
|
||||||
background-color: #212121; /* grey900 */
|
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);
|
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 {
|
#site-menu ul li {
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
#site-menu ul li:hover {
|
#site-menu ul li:hover {
|
||||||
@ -73,9 +75,10 @@ code {
|
|||||||
|
|
||||||
#site-menu ul li a {
|
#site-menu ul li a {
|
||||||
color: #fff; /* 100% white */
|
color: #fff; /* 100% white */
|
||||||
display: block;
|
display: flex;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
#site-menu ul li a:visited {
|
#site-menu ul li a:visited {
|
||||||
@ -86,6 +89,17 @@ code {
|
|||||||
color: #64b5f6; /* blue300 */
|
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 {
|
main {
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
margin-right: auto;
|
margin-right: auto;
|
||||||
|
@ -31,7 +31,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -31,7 +31,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -31,7 +31,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -32,7 +32,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -32,7 +32,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -32,7 +32,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li aria-current="page"><a href="/install/">Install</a></li>
|
<li aria-current="page"><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -34,7 +34,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -31,7 +31,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -34,7 +34,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -31,7 +31,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
@ -32,7 +32,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<nav id="site-menu">
|
<nav id="site-menu">
|
||||||
<ul>
|
<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="/features">Features</a></li>
|
||||||
<li><a href="/install/">Install</a></li>
|
<li><a href="/install/">Install</a></li>
|
||||||
<li><a href="/build">Build</a></li>
|
<li><a href="/build">Build</a></li>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user