Bring safe-area CSS up to speed and fix theme-color

This commit is contained in:
Sami Samhuri 2023-02-14 21:21:40 -08:00
parent 5399ce0c96
commit 1df7fe4652
No known key found for this signature in database
GPG key ID: 4B4195422742FC16
2 changed files with 5 additions and 5 deletions

View file

@ -38,7 +38,7 @@ body {
margin: 0 auto;
max-width: 48rem;
width: 90%;
padding: 0 constant(safe-area-inset-right) 0 constant(safe-area-inset-left);
padding: 0 env(safe-area-inset-right) 0 env(safe-area-inset-left);
}
@media (min-width: 40rem) {
@ -105,7 +105,7 @@ body {
color: #222;
font-family: 'museo-sans', 'Helvetica Neue', 'Verdana', 'Roboto', sans-serif;
font-display: swap;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
h1,
@ -140,7 +140,7 @@ hr {
header.primary {
background-color: #151515;
color: #f7f7f7;
padding: 0.8rem 1.2rem;
padding: 0.8rem max(1.2rem, env(safe-area-inset-right)) 0.8rem max(1.2rem, env(safe-area-inset-left));
border-bottom: solid 1px #888888;
box-shadow: 0 0 12px 2px #222;
}

View file

@ -15,7 +15,6 @@ enum Template {
.comment("meow"),
.head(
.encoding(.utf8),
.viewport(.accordingToDevice),
.title(context.title),
.siteName(context.site.title),
.url(context.site.url),
@ -28,7 +27,8 @@ enum Template {
.safariPinnedTabIcon(context.imageURL("safari-pinned-tab.svg"), color: "#aa0000"),
.link(.attribute(named: "rel", value: "manifest"), .href(context.imageURL("manifest.json"))),
.meta(.name("msapplication-config"), .content(context.imageURL("browserconfig.xml").absoluteString)),
.meta(.name("theme-color"), .content("#ffffff")),
.meta(.name("theme-color"), .content("#121212")), // matches header
.meta(.name("viewport"), .content("width=device-width, initial-scale=1.0, viewport-fit=cover")),
.link(.rel(.dnsPrefetch), .href("https://use.typekit.net")),
.link(.rel(.dnsPrefetch), .href("https://netdna.bootstrapcdn.com")),
.link(.rel(.dnsPrefetch), .href("https://gist.github.com")),