~sircmpwn/core.sr.ht

83d4943c7414b966ccb84f42567ce77ea9fa8e40 — Umar Getagazov 1 year, 7 months ago fb54daf 0.69.9 
Make favicon visible in a light theme

The SVG version now switches colors with the browser's theme. An outline
is added to both SVG and PNG versions for browsers that do not support
`prefers-color-scheme` or SVG favicons. The PNG version now has an added
`sizes="any"` attribute to work around Chrome preferring it over SVG.
patch browse .tar.gz 
3 files changed, 15 insertions(+), 2 deletions(-)

M srht/static/logo.png
M srht/static/logo.svg
M srht/templates/layout.html

M srht/static/logo.png => srht/static/logo.png +0 -0
M srht/static/logo.svg => srht/static/logo.svg +14 -1
@@ 1,1 1,14 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="#fff" d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm0 448c-110.5 0-200-89.5-200-200S145.5 56 256 56s200 89.5 200 200-89.5 200-200 200z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="128" height="128" viewBox="0 0 128 128">
	<style>
		@media (prefers-color-scheme: light) {
			#outline { display: none }
			#logo { stroke: black }
		}
		@media (prefers-color-scheme: dark) {
			#outline { display: none }
			#logo { stroke: white }
		}
	</style>
	<circle id="outline" cx="64" cy="64" r="50" fill="none" stroke-width="14" stroke="#888" />
	<circle id="logo" cx="64" cy="64" r="50" fill="none" stroke-width="10" stroke="white" />
</svg>


M srht/templates/layout.html => srht/templates/layout.html +1 -1
@@ 8,7 8,7 @@
    {% endblock %}
    {% block favicon %}
    <link rel="icon" type="image/svg+xml" href="/static/logo.svg" />
    <link rel="icon" type="image/png" href="/static/logo.png" />
    <link rel="icon" type="image/png" href="/static/logo.png" sizes="any" />
    {% endblock favicon %}
    {% if app.debug %}
    <link rel="stylesheet" href="/static/main.css">