theme changes

This commit is contained in:
wires 2025-03-31 13:46:45 -04:00
parent a6013bef3e
commit dcee4fe4b1
Signed by: wires
SSH key fingerprint: SHA256:9GtP+M3O2IivPDlw1UY872UPUuJH2gI0yG6ExBxaaiM
8 changed files with 327 additions and 154 deletions

View file

@ -1,3 +1,14 @@
* {
box-sizing: border-box;
}
:root {
--fg: #cdd6f4;
--bg: #11111b;
--link: #bd93f9;
--overlay: #313244;
}
.skip {
position: absolute;
left: -10000px;
@ -14,33 +25,47 @@
}
body {
max-width: 45rem;
padding: 0 2rem;
margin: 2rem auto 0;
line-height: 1.6;
background: #11111b;
color: white;
max-width: 50rem;
padding: 2rem;
margin: 0 auto;
line-height: 1.8;
background: var(--bg);
color: var(--fg);
font-family: serif;
}
h1, h2, h3 {
margin-bottom: 0.25em;
h1,
h2,
h3,
h4 {
margin-block-end: 0.25em;
line-height: 1.3;
}
font-family: sans-serif;
p {
margin-top: 0;
}
a,
a:visited {
color: var(--fg);
text-decoration: none;
}
p + p {
text-indent: 2em;
a:hover {
color: var(--link);
text-decoration: underline;
}
}
ul {
margin-top: 0;
margin-block-start: 0;
}
p {
margin-block-start: 0;
text-align: justify;
hyphens: auto;
}
#main-nav {
font-size: 125%;
line-height: 1.3;
}
#main-nav ul {
@ -50,24 +75,14 @@ ul {
#main-nav li {
display: inline-block;
}
#main-nav li::before {
content: '/ ';
}
#main-nav li:first-child::before {
content: '';
margin-inline-end: 0.5em;
}
#site-title {
font-family: sans-serif;
font-weight: bold;
color: inherit;
text-decoration: none;
}
#site-title:hover {
text-decoration: underline;
font-size: 150%;
margin-bottom: 0.25rem;
}
footer {
@ -82,6 +97,26 @@ header {
margin-bottom: 1em;
}
a, a:visited {
color: #8ef;
a,
a:visited {
color: var(--link);
}
hr {
border: none;
height: 1px;
background: var(--overlay);
}
pre code {
background: black;
border: 1px solid var(--overlay);
border-radius: 8px;
padding: 1em;
display: block;
overflow-x: auto;
}
code {
font-size: 125%;
}

View file

@ -4,7 +4,7 @@
--cyan: #8be9fd;
--green: #50fa7b;
--orange: #ffb86c;
--pink: #f5a;
--pink: #ff79c6;
--purple: #bd93f9;
--red: #f55;
--yellow: #f1fa8c;
@ -22,49 +22,134 @@
--yellow: #df8e1d;
}
} */
/* Background */ .bg,
/* PreWrapper */ .chroma { background-color:var(--chroma-bg); }
/* Other */ .chroma .x { }
/* Error */ .chroma .err { }
/* CodeLine */ .chroma .cl { }
/* LineLink */ .chroma .lnlinks { outline:none;text-decoration:none;color:inherit }
/* LineTableTD */ .chroma .lntd { vertical-align:top;padding:0;margin:0;border:0; }
/* LineTable */ .chroma .lntable { border-spacing:0;padding:0;margin:0;border:0; }
/* LineHighlight */ .chroma .hl { background-color:#3d3f4a }
/* LineNumbersTable */ .chroma .lnt,
/* LineNumbers */ .chroma .ln { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:var(--comment) }
/* Line */ .chroma .line { display:flex; }
/* Keyword */ .chroma .k,
/* Background */
.bg,
/* PreWrapper */ .chroma {
background-color: var(--chroma-bg);
}
/* Other */
.chroma .x {
}
/* Error */
.chroma .err {
}
/* CodeLine */
.chroma .cl {
}
/* LineLink */
.chroma .lnlinks {
outline: none;
text-decoration: none;
color: inherit;
}
/* LineTableTD */
.chroma .lntd {
vertical-align: top;
padding: 0;
margin: 0;
border: 0;
}
/* LineTable */
.chroma .lntable {
border-spacing: 0;
padding: 0;
margin: 0;
border: 0;
}
/* LineHighlight */
.chroma .hl {
background-color: #3d3f4a;
}
/* LineNumbersTable */
.chroma .lnt,
/* LineNumbers */ .chroma .ln {
white-space: pre;
-webkit-user-select: none;
user-select: none;
margin-right: 0.4em;
padding: 0 0.4em 0 0.4em;
color: var(--comment);
}
/* Line */
.chroma .line {
display: flex;
}
/* Keyword */
.chroma .k,
/* KeywordConstant */ .chroma .kc,
/* KeywordNamespace */ .chroma .kn,
/* KeywordPseudo */ .chroma .kp,
/* KeywordReserved */ .chroma .kr { color:var(--pink) }
/* KeywordType */ .chroma .kt { color:var(--cyan) }
/* KeywordDeclaration */ .chroma .kd { color:var(--cyan);font-style:italic }
/* Name */ .chroma .n { }
/* NameBuiltinPseudo */ .chroma .bp { }
/* NameConstant */ .chroma .no { }
/* NameDecorator */ .chroma .nd { }
/* NameEntity */ .chroma .ni { }
/* NameException */ .chroma .ne { }
/* NameAttribute */ .chroma .na,
/* KeywordReserved */ .chroma .kr {
color: var(--pink);
}
/* KeywordType */
.chroma .kt {
color: var(--cyan);
}
/* KeywordDeclaration */
.chroma .kd {
color: var(--cyan);
font-style: italic;
}
/* Name */
.chroma .n {
}
/* NameBuiltinPseudo */
.chroma .bp {
}
/* NameConstant */
.chroma .no {
}
/* NameDecorator */
.chroma .nd {
}
/* NameEntity */
.chroma .ni {
}
/* NameException */
.chroma .ne {
}
/* NameAttribute */
.chroma .na,
/* NameClass */ .chroma .nc,
/* NameFunctionMagic */ .chroma .fm,
/* NameFunction */ .chroma .nf { color:var(--green) }
/* NameNamespace */ .chroma .nn { }
/* NameOther */ .chroma .nx { }
/* NameProperty */ .chroma .py { }
/* NameTag */ .chroma .nt { color:var(--pink) }
/* NameBuiltin */ .chroma .nb,
/* NameFunction */ .chroma .nf {
color: var(--green);
}
/* NameNamespace */
.chroma .nn {
}
/* NameOther */
.chroma .nx {
}
/* NameProperty */
.chroma .py {
}
/* NameTag */
.chroma .nt {
color: var(--pink);
}
/* NameBuiltin */
.chroma .nb,
/* NameLabel */ .chroma .nl,
/* NameVariable */ .chroma .nv,
/* NameVariableClass */ .chroma .vc,
/* NameVariableGlobal */ .chroma .vg,
/* NameVariableInstance */ .chroma .vi { color:var(--cyan);font-style:italic }
/* NameVariableMagic */ .chroma .vm { }
/* Literal */ .chroma .l { }
/* LiteralDate */ .chroma .ld { }
/* LiteralString */ .chroma .s,
/* NameVariableInstance */ .chroma .vi {
color: var(--cyan);
font-style: italic;
}
/* NameVariableMagic */
.chroma .vm {
}
/* Literal */
.chroma .l {
}
/* LiteralDate */
.chroma .ld {
}
/* LiteralString */
.chroma .s,
/* LiteralStringAffix */ .chroma .sa,
/* LiteralStringBacktick */ .chroma .sb,
/* LiteralStringChar */ .chroma .sc,
@ -77,34 +162,85 @@
/* LiteralStringOther */ .chroma .sx,
/* LiteralStringRegex */ .chroma .sr,
/* LiteralStringSingle */ .chroma .s1,
/* LiteralStringSymbol */ .chroma .ss { color:var(--yellow) }
/* LiteralNumber */ .chroma .m,
/* LiteralStringSymbol */ .chroma .ss {
color: var(--yellow);
}
/* LiteralNumber */
.chroma .m,
/* LiteralNumberBin */ .chroma .mb,
/* LiteralNumberFloat */ .chroma .mf,
/* LiteralNumberHex */ .chroma .mh,
/* LiteralNumberInteger */ .chroma .mi,
/* LiteralNumberIntegerLong */ .chroma .il,
/* LiteralNumberOct */ .chroma .mo { color:var(--purple) }
/* Operator */ .chroma .o,
/* OperatorWord */ .chroma .ow { color:var(--pink) }
/* Punctuation */ .chroma .p { }
/* Comment */ .chroma .c,
/* LiteralNumberOct */ .chroma .mo {
color: var(--purple);
}
/* Operator */
.chroma .o,
/* OperatorWord */ .chroma .ow {
color: var(--pink);
}
/* Punctuation */
.chroma .p {
}
/* Comment */
.chroma .c,
/* CommentHashbang */ .chroma .ch,
/* CommentMultiline */ .chroma .cm,
/* CommentSingle */ .chroma .c1,
/* CommentSpecial */ .chroma .cs { color:var(--comment) }
/* CommentPreproc */ .chroma .cp,
/* CommentPreprocFile */ .chroma .cpf { color:var(--pink) }
/* Generic */ .chroma .g { }
/* GenericDeleted */ .chroma .gd { color:var(--red) }
/* GenericEmph */ .chroma .ge { text-decoration:underline }
/* GenericError */ .chroma .gr { }
/* GenericHeading */ .chroma .gh { font-weight:bold }
/* GenericInserted */ .chroma .gi { color:var(--green);font-weight:bold }
/* GenericOutput */ .chroma .go { color:var(--comment) }
/* GenericPrompt */ .chroma .gp { }
/* GenericStrong */ .chroma .gs { }
/* GenericSubheading */ .chroma .gu { font-weight:bold }
/* GenericTraceback */ .chroma .gt { }
/* GenericUnderline */ .chroma .gl { text-decoration:underline }
/* TextWhitespace */ .chroma .w { }
/* CommentSpecial */ .chroma .cs {
color: var(--comment);
}
/* CommentPreproc */
.chroma .cp,
/* CommentPreprocFile */ .chroma .cpf {
color: var(--pink);
}
/* Generic */
.chroma .g {
}
/* GenericDeleted */
.chroma .gd {
color: var(--red);
}
/* GenericEmph */
.chroma .ge {
text-decoration: underline;
}
/* GenericError */
.chroma .gr {
}
/* GenericHeading */
.chroma .gh {
font-weight: bold;
}
/* GenericInserted */
.chroma .gi {
color: var(--green);
font-weight: bold;
}
/* GenericOutput */
.chroma .go {
color: var(--comment);
}
/* GenericPrompt */
.chroma .gp {
color: var(--comment);
}
/* GenericStrong */
.chroma .gs {
}
/* GenericSubheading */
.chroma .gu {
font-weight: bold;
}
/* GenericTraceback */
.chroma .gt {
}
/* GenericUnderline */
.chroma .gl {
text-decoration: underline;
}
/* TextWhitespace */
.chroma .w {
}

View file

@ -1,6 +1,6 @@
baseURL = 'https://wires.systems'
languageCode = 'en-us'
title = "~wires"
title = "wires"
uglyurls = true
enableGitInfo = true
disableKinds = ['section', 'taxonomy']
@ -17,6 +17,11 @@ summaryLength = 10
[outputFormats.rss]
baseName = 'feed'
[[menu.main]]
weight = -10
name = "home"
url = "/"
[[menu.main]]
name = "rss"
url = "/feed.xml"

View file

@ -1 +0,0 @@
<pre class="chroma"><code class="language-{{ .Type }}" data-lang="{{ .Type }}">{{ (transform.HighlightCodeBlock .).Inner }}</code></pre>

View file

@ -0,0 +1,3 @@
<h{{ .Level }} id="{{ .Anchor }}" {{- with .Attributes.class }} class="{{ . }}" {{- end }}>
<a href="#{{ .Anchor }}">{{ .Text }}</a>
</h{{ .Level }}>

View file

@ -1,29 +1,30 @@
<!DOCTYPE html>
<!doctype html>
<html lang="{{ .Site.Language.LanguageCode }}">
<head>
{{ partial "head.html" . }}
<!-- this is here to make sure that if we can't load CSS the icons don't totally fuck up layout -->
<style>.icon svg { width: 1.25em; height: 1.25em; }</style>
{{ range .AlternativeOutputFormats -}}
{{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }}
{{ end -}}
</head>
<body>
<a href="#main" class="skip">Skip to content</a>
<nav id="main-nav">
<ul>
<li><a href="{{.Site.BaseURL}}" id="site-title">{{.Site.Title}}</a></li>
{{ with .Site.Menus.main }}
{{ range . }}
<style>
.icon svg {
width: 1.25em;
height: 1.25em;
}
</style>
{{ range .AlternativeOutputFormats -}} {{ printf `
<link rel="%s" type="%s" href="%s" title="%s" />
` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }} {{ end -}}
</head>
<body>
<a href="#main" class="skip">Skip to content</a>
<nav id="main-nav">
<div id="site-title">{{.Site.Title}}</div>
<ul>
{{ with .Site.Menus.main }} {{ range . }}
<li><a href="{{ .URL }}">{{ .Name }}</a></li>
{{ end }}
{{ end }}
</ul>
</nav>
{{ end }} {{ end }}
</ul>
</nav>
<main id="main">
{{ block "main" . }}{{ end }}
</main>
{{ partial "footer.html" . }}
</body>
<main id="main">{{ block "main" . }}{{ end }}</main>
{{ partial "footer.html" . }}
</body>
</html>

View file

@ -6,16 +6,8 @@
{{ with .Keywords }}<meta name="keywords" content="{{ delimit . ", " }}"/>{{ end }}
<link rel="license" href="https://creativecommons.org/licenses/by-sa/4.0/"/>
<link rel="canonical" href="{{ .Permalink }}"/>
{{- with resources.Get "style.css" }}
{{- if eq hugo.Environment "development" }}
<link rel="stylesheet" href="{{ .RelPermalink }}">
{{- else }}
{{- with . | minify | fingerprint }}
<link rel="stylesheet" href="{{ .RelPermalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous">
{{- end }}
{{- end }}
{{- end }}
{{- with resources.Get "syntax.css" }}
{{ range slice "style.css" "syntax.css"}}
{{- with resources.Get . }}
{{- if eq hugo.Environment "development" }}
<link rel="stylesheet" href="{{ .RelPermalink }}">
{{- else }}
@ -24,5 +16,6 @@
{{- end }}
{{- end }}
{{- end }}
{{ end }}
<title>{{ if .IsHome }}{{ site.Title }}{{ else }}{{ printf "%s | %s" .Title site.Title }}{{ end }}</title>

View file

@ -1,5 +1,6 @@
{{ with .GetTerms "tags" }}
<br>
tags:
{{ range $i, $e := . }}{{- if $i -}}, {{ end -}}{{ with $e }}<a class="tag" href="{{.Permalink}}">{{lower .Title}}</a>{{end}}{{ end }}
<p>
Tags:{{ range $i, $e := . }}{{- if $i -}},{{ end -}}{{ with $e }}
<a class="tag" href="{{.Permalink}}">{{lower .Title}}</a>{{end}}{{ end }}
</p>
{{ end }}