forked from cadey/xesite
templates/header: add logo image that is responsive to theme preference
Thanks to many people on Twitter that helped with this: https://twitter.com/theprincessxena/status/1480767115993010177 Signed-off-by: Xe <me@christine.website>
This commit is contained in:
parent
ce0ab58292
commit
97e31d0e8b
18
css/shim.css
18
css/shim.css
|
@ -58,8 +58,26 @@ img {
|
|||
background-color: #282828;
|
||||
}
|
||||
|
||||
.logo {
|
||||
background-color: #fdf5d7;
|
||||
-webkit-mask: url("/static/img/xeiaso.svg");
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
-webkit-mask-size: 100%;
|
||||
mask: url("/static/img/xeiaso.svg");
|
||||
height: 32px;
|
||||
width: 19px;
|
||||
float: left;
|
||||
display: inline;
|
||||
margin: 3px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
.warning {
|
||||
background-color: #fbf1c7;
|
||||
}
|
||||
|
||||
.logo {
|
||||
background-color: #1d2021;
|
||||
}
|
||||
}
|
||||
|
|
File diff suppressed because one or more lines are too long
After Width: | Height: | Size: 11 KiB |
|
@ -92,7 +92,7 @@ la budza pu cusku lu
|
|||
<body class="snow hack gruvbox-dark">
|
||||
<div class="container">
|
||||
<header>
|
||||
<p><a href="/">Xe</a> - <a href="/blog">Blog</a> - <a href="/contact">Contact</a> - <a href="/gallery">Gallery</a> - <a href="/resume">Resume</a> - <a href="/talks">Talks</a> - <a href="/signalboost">Signal Boost</a> - <a href="/feeds">Feeds</a> | <a target="_blank" rel="noopener noreferrer" href="https://graphviz.christine.website">GraphViz</a> - <a target="_blank" rel="noopener noreferrer" href="https://when-then-zen.christine.website/">When Then Zen</a></p>
|
||||
<span class="logo"></span><nav><a href="/">Xe</a> - <a href="/blog">Blog</a> - <a href="/contact">Contact</a> - <a href="/gallery">Gallery</a> - <a href="/resume">Resume</a> - <a href="/talks">Talks</a> - <a href="/signalboost">Signal Boost</a> - <a href="/feeds">Feeds</a> | <a target="_blank" rel="noopener noreferrer" href="https://graphviz.christine.website">GraphViz</a> - <a target="_blank" rel="noopener noreferrer" href="https://when-then-zen.christine.website/">When Then Zen</a></nav>
|
||||
</header>
|
||||
|
||||
<div class="snowframe">
|
||||
|
|
Loading…
Reference in New Issue