Update favicons and touch icons

This commit is contained in:
Eryn Wells 2022-11-24 08:29:59 -05:00
parent 88476a707e
commit f0931bd9d1
7 changed files with 45 additions and 19 deletions

1
.gitattributes vendored
View file

@ -1,2 +1,3 @@
*.jpg filter=lfs diff=lfs merge=lfs -text
*.jpeg filter=lfs diff=lfs merge=lfs -text
*.pxm filter=lfs diff=lfs merge=lfs -text

View file

@ -19,13 +19,13 @@
<link rel="preload" as="image" href="{{ printf `%s.svg` . | absURL }}">
{{- end -}}
<link rel="icon" href="{{ `favicon.ico` | absURL }}">
<link rel="apple-touch-icon" href="{{ `apple-touch-icon.png` | absURL }}">
<link rel="icon" type="image/png" href="{{ `icons/favicon.png` | relURL }}">
<link rel="apple-touch-icon" type="image/png" href="{{ `icons/touchicon.png` | relURL }}">
{{ hugo.Generator }}
{{- range .AlternativeOutputFormats -}}
<link rel="{{ .Rel }}" type="{{ .MediaType.Type }}" href="{{ .Permalink }}" title="{{ site.Title }}">
<link rel="{{ .Rel }}" type="{{ .MediaType.Type }}" href="{{ .RelPermalink }}" title="{{ site.Title }}">
{{- end -}}
{{- if or hugo.IsProduction (eq site.Params.env "production") -}}

View file

@ -1,8 +1,13 @@
<!doctype html>
<html>
<body>
<h1>Site Logo</h1>
<div id="logo">E</div>
<header>
<h1>Site Logo</h1>
</header>
<main>
<div class="logo" id="touchicon"><span>E</span></div>
<div class="logo" id="favicon"><span>E</span></div>
</main>
</body>
<style>
@font-face {
@ -19,28 +24,32 @@
--purple: rgb(161, 49, 232);
--lilac: rgb(187, 121, 245);
}
* { box-sizing: border-box; }
body {
align-items: center;
color: #222;
padding-block-start: 6vmin;
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
height: 100%;
padding-block-start: 6vmin;
font-family: "Museo_Slab";
}
#logo {
main {
align-items: center;
display: flex;
gap: 2rem;
margin: 0 auto;
}
.logo {
border: 1px dotted #aaa;
color: transparent;
border: 0.5rem solid #222;
border-radius: 6px;
padding-top: 30px;
display: flex;
justify-content: center;
align-items: center;
width: 500px;
height: 500px;
background-color: blue;
text-align: center;
line-height: 1;
}
.logo > span {
display: block;
position: relative;
background:
radial-gradient(circle at 20% 70%, var(--purple), transparent 40%),
radial-gradient(circle at 30% 30%, var(--lt-blue), var(--mid-blue) 20%, transparent 80%),
@ -49,9 +58,22 @@ body {
radial-gradient(circle at 45% 100%, var(--lilac), var(--purple) 60%),
radial-gradient(ellipse at 50% 50%, var(--dk-blue), transparent 80%);
background-clip: text;
}
#touchicon {
font-size: 600px;
text-align: center;
line-height: 0.8;
width: 512px;
height: 512px;
}
#touchicon > span {
top: 15px;
}
#favicon {
font-size: 24px;
width: 24px;
height: 24px;
}
#favicon > span {
top: 0.5px;
}
</style>
</html>

BIN
logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 360 KiB

3
logo.pxm Normal file
View file

@ -0,0 +1,3 @@
version https://git-lfs.github.com/spec/v1
oid sha256:ac330d86c788701d3f4981bee56954b324844a4115e28611bba8028b2f43ee7b
size 785132

BIN
static/icons/favicon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.4 KiB

BIN
static/icons/touchicon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 329 KiB