« get me outta code hell

wiki-blog - Unnamed repository; edit this file 'description' to name the repository.
summary refs log tree commit diff
path: root/theme
diff options
context:
space:
mode:
Diffstat (limited to 'theme')
-rw-r--r--theme/neb/static/css/codehilite-coffee.css85
-rw-r--r--theme/neb/static/css/neb-anim.css31
-rw-r--r--theme/neb/static/css/neb-style.css261
-rw-r--r--theme/neb/static/img/5002.pngbin0 -> 37852 bytes
-rw-r--r--theme/neb/static/img/5003.pngbin0 -> 32076 bytes
-rw-r--r--theme/neb/templates/base.html60
6 files changed, 437 insertions, 0 deletions
diff --git a/theme/neb/static/css/codehilite-coffee.css b/theme/neb/static/css/codehilite-coffee.css
new file mode 100644
index 0000000..1f7de46
--- /dev/null
+++ b/theme/neb/static/css/codehilite-coffee.css
@@ -0,0 +1,85 @@
+pre { line-height: 125%; }
+td.linenos .normal { color: #4e4e4e; background-color: transparent; padding-left: 5px; padding-right: 5px; }
+span.linenos { color: #4e4e4e; background-color: transparent; padding-left: 5px; padding-right: 5px; }
+td.linenos .special { color: #8f9494; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
+span.linenos.special { color: #8f9494; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
+.codehilite .hll { background-color: #ddd0c0 }
+.codehilite { background: #262220; color: #ddd0c0 }
+.codehilite .c { color: #70757A } /* Comment */
+.codehilite .err { color: #af5f5f } /* Error */
+.codehilite .esc { color: #ddd0c0 } /* Escape */
+.codehilite .g { color: #ddd0c0 } /* Generic */
+.codehilite .k { color: #919191 } /* Keyword */
+.codehilite .l { color: #af875f } /* Literal */
+.codehilite .n { color: #ddd0c0 } /* Name */
+.codehilite .o { color: #878787 } /* Operator */
+.codehilite .x { color: #ddd0c0 } /* Other */
+.codehilite .p { color: #ddd0c0 } /* Punctuation */
+.codehilite .ch { color: #8f9f9f } /* Comment.Hashbang */
+.codehilite .cm { color: #70757A } /* Comment.Multiline */
+.codehilite .cp { color: #fdd0c0 } /* Comment.Preproc */
+.codehilite .cpf { color: #c9b98f } /* Comment.PreprocFile */
+.codehilite .c1 { color: #70757A } /* Comment.Single */
+.codehilite .cs { color: #af5f5f } /* Comment.Special */
+.codehilite .gd { color: #bb6868 } /* Generic.Deleted */
+.codehilite .ge { color: #ddd0c0; font-style: italic } /* Generic.Emph */
+.codehilite .ges { color: #ddd0c0 } /* Generic.EmphStrong */
+.codehilite .gr { color: #af5f5f } /* Generic.Error */
+.codehilite .gh { color: #ddd0c0 } /* Generic.Heading */
+.codehilite .gi { color: #849155 } /* Generic.Inserted */
+.codehilite .go { color: #ddd0c0 } /* Generic.Output */
+.codehilite .gp { color: #ddd0c0 } /* Generic.Prompt */
+.codehilite .gs { color: #ddd0c0; font-weight: bold } /* Generic.Strong */
+.codehilite .gu { color: #ddd0c0 } /* Generic.Subheading */
+.codehilite .gt { color: #af5f5f } /* Generic.Traceback */
+.codehilite .kc { color: #875f5f } /* Keyword.Constant */
+.codehilite .kd { color: #875f5f } /* Keyword.Declaration */
+.codehilite .kn { color: #875f5f } /* Keyword.Namespace */
+.codehilite .kp { color: #919191 } /* Keyword.Pseudo */
+.codehilite .kr { color: #b46276 } /* Keyword.Reserved */
+.codehilite .kt { color: #af875f } /* Keyword.Type */
+.codehilite .ld { color: #af875f } /* Literal.Date */
+.codehilite .m { color: #87afaf } /* Literal.Number */
+.codehilite .s { color: #c9b98f } /* Literal.String */
+.codehilite .na { color: #ddd0c0 } /* Name.Attribute */
+.codehilite .nb { color: #ddd0c0 } /* Name.Builtin */
+.codehilite .nc { color: #875f5f } /* Name.Class */
+.codehilite .no { color: #af8787 } /* Name.Constant */
+.codehilite .nd { color: #fdd0c0 } /* Name.Decorator */
+.codehilite .ni { color: #ddd0c0 } /* Name.Entity */
+.codehilite .ne { color: #877575 } /* Name.Exception */
+.codehilite .nf { color: #fdd0c0 } /* Name.Function */
+.codehilite .nl { color: #ddd0c0 } /* Name.Label */
+.codehilite .nn { color: #ddd0c0 } /* Name.Namespace */
+.codehilite .nx { color: #ddd0c0 } /* Name.Other */
+.codehilite .py { color: #dfaf87 } /* Name.Property */
+.codehilite .nt { color: #87afaf } /* Name.Tag */
+.codehilite .nv { color: #ddd0c0 } /* Name.Variable */
+.codehilite .ow { color: #878787 } /* Operator.Word */
+.codehilite .pm { color: #ddd0c0 } /* Punctuation.Marker */
+.codehilite .w { color: #ddd0c0 } /* Text.Whitespace */
+.codehilite .mb { color: #87afaf } /* Literal.Number.Bin */
+.codehilite .mf { color: #87afaf } /* Literal.Number.Float */
+.codehilite .mh { color: #87afaf } /* Literal.Number.Hex */
+.codehilite .mi { color: #87afaf } /* Literal.Number.Integer */
+.codehilite .mo { color: #87afaf } /* Literal.Number.Oct */
+.codehilite .sa { color: #dfaf87 } /* Literal.String.Affix */
+.codehilite .sb { color: #c9b98f } /* Literal.String.Backtick */
+.codehilite .sc { color: #c9b98f } /* Literal.String.Char */
+.codehilite .dl { color: #c9b98f } /* Literal.String.Delimiter */
+.codehilite .sd { color: #878787 } /* Literal.String.Doc */
+.codehilite .s2 { color: #c9b98f } /* Literal.String.Double */
+.codehilite .se { color: #af5f5f } /* Literal.String.Escape */
+.codehilite .sh { color: #c9b98f } /* Literal.String.Heredoc */
+.codehilite .si { color: #af5f5f } /* Literal.String.Interpol */
+.codehilite .sx { color: #fdd0c0 } /* Literal.String.Other */
+.codehilite .sr { color: #af5f5f } /* Literal.String.Regex */
+.codehilite .s1 { color: #c9b98f } /* Literal.String.Single */
+.codehilite .ss { color: #af5f5f } /* Literal.String.Symbol */
+.codehilite .bp { color: #87afaf } /* Name.Builtin.Pseudo */
+.codehilite .fm { color: #fdd0c0 } /* Name.Function.Magic */
+.codehilite .vc { color: #ddd0c0 } /* Name.Variable.Class */
+.codehilite .vg { color: #ddd0c0 } /* Name.Variable.Global */
+.codehilite .vi { color: #ddd0c0 } /* Name.Variable.Instance */
+.codehilite .vm { color: #ddd0c0 } /* Name.Variable.Magic */
+.codehilite .il { color: #87afaf } /* Literal.Number.Integer.Long */
diff --git a/theme/neb/static/css/neb-anim.css b/theme/neb/static/css/neb-anim.css
new file mode 100644
index 0000000..45de2fd
--- /dev/null
+++ b/theme/neb/static/css/neb-anim.css
@@ -0,0 +1,31 @@
+@property --shine1 {
+  syntax: '<percentage>';
+  initial-value: 0%;
+  inherits: false;
+}
+
+@property --shine2 {
+  syntax: '<percentage>';
+  initial-value: 0%;
+  inherits: false;
+}
+
+@keyframes label-shine {
+  from {
+    --shine1: 0%;
+    --shine2: 0%;
+  }
+
+  20% {
+    --shine2: 0%;
+  }
+
+  80% {
+    --shine1: 100%;
+  }
+
+  100% {
+    --shine1: 100%;
+    --shine2: 100%;
+  }
+}
diff --git a/theme/neb/static/css/neb-style.css b/theme/neb/static/css/neb-style.css
new file mode 100644
index 0000000..daf798a
--- /dev/null
+++ b/theme/neb/static/css/neb-style.css
@@ -0,0 +1,261 @@
+@import url(codehilite-coffee.css);
+@import url(neb-anim.css);
+
+:root {
+  font-family: sans-serif;
+
+  --color: #0088ff;
+
+  --code-color: #de2891;
+  --coffee-color: #ee211d;
+  --data-color: #18d211;
+  --design-color: #d26b2a;
+  --feature-color: #7f35ee;
+
+  .code { --color: var(--code-color); }
+  .coffee { --color: var(--coffee-color); }
+  .data { --color: var(--data-color); }
+  .design { --color: var(--design-color); }
+  .feature { --color: var(--feature-color); }
+}
+
+body {
+  margin: 25px;
+  margin-bottom: 60px;
+
+  &::before {
+    content: "";
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: -1;
+
+    background-color: #c9c9c9;
+    background-image: url(/theme/img/5002.png);
+    background-size: 125px;
+  }
+
+  > header,
+  > main,
+  > footer {
+    max-width: 968px;
+    margin-left: auto;
+    margin-right: auto;
+
+    background: white;
+  }
+
+  > header {
+    padding: 20px 20px 10px 20px;
+
+    background-color: black;
+    background-image: url(/theme/img/5003.png);
+    color: white;
+    background-size: 125px;
+
+    > nav ul {
+      display: flex;
+      padding: 0;
+      margin-bottom: 10px;
+
+      li {
+        display: block;
+
+        &:has(+ .right) {
+          flex-grow: 1;
+        }
+      }
+
+      li a {
+        padding: 5px 20px;
+
+        background: #272727;
+        border: 1px solid var(--color);
+        border-radius: 2px;
+
+        &:where(li.active a) {
+          background: var(--color);
+          color: white;
+        }
+      }
+    }
+  }
+
+  > footer {
+    padding: 5px 20px 5px 20px;
+    background-color: #f3f3f3;
+  }
+
+  > main {
+    --content-padding: 20px;
+    padding: var(--content-padding);
+
+    contain: paint;
+
+    article > header > :first-child {
+      margin-top: 0;
+    }
+  }
+}
+
+a {
+  color: var(--color);
+  text-decoration: none;
+
+  &:hover {
+    text-decoration: underline;
+  }
+
+  &.secret {
+    color: inherit;
+  }
+}
+
+article {
+  line-height: 1.6;
+
+  code:not(:where(pre code)) {
+    padding: 2px 3px;
+    background-color: color-mix(in srgb, var(--color), 85% #00000003);
+    border: 1px solid color-mix(in srgb, var(--color), 70% #00000002);
+    border-radius: 3px;
+  }
+
+  pre {
+    line-height: 1.3;
+    white-space: pre-wrap;
+    background: #0006;
+    border: 4px inset #ccce !important;
+    padding: 12px 8px;
+  }
+
+  li {
+    /* baseline, paragraphs will space further */
+    margin-bottom: 0.25em;
+  }
+
+  figure {
+    img, video {
+      display: block;
+      margin-left: auto;
+      margin-right: auto;
+      margin-bottom: 1em;
+      max-width: 100%;
+      max-height: 80vh;
+      box-shadow: 0 1px 3px 1px #3336;
+      width: auto;
+      height: auto;
+    }
+
+    figcaption {
+      text-align: center;
+      font-style: oblique;
+    }
+  }
+
+  .toc {
+    font-weight: 800;
+
+    li i { display: none; }
+
+    li::before {
+      --pale: color-mix(in srgb, var(--color), 65% #ffffff);
+      --shine: color-mix(in srgb, var(--color), 75% white);
+
+      background: var(--pale);
+      padding: 3px 7px;
+      margin-right: 7px;
+      border-bottom-right-radius: 5px;
+      border-top-left-radius: 5px;
+    }
+
+    li:has(a:hover)::before {
+      background:
+        linear-gradient(45deg,
+          var(--pale) var(--shine2),
+          var(--shine) calc(var(--shine2) + 1%),
+          var(--shine) var(--shine1),
+          var(--pale) calc(var(--shine1) + 1%));
+
+      animation: label-shine 0.35s linear forwards;
+    }
+
+    li:has(a[href*="#code"])::before {
+      content: "code"; --color: var(--code-color);
+    }
+
+    li:has(a[href*="#coffee"])::before {
+      content: "coffee"; --color: var(--coffee-color);
+    }
+
+    li:has(a[href*="#data"])::before {
+      content: "data"; --color: var(--data-color);
+    }
+
+    li:has(a[href*="#design"])::before {
+      content: "design"; --color: var(--design-color);
+    }
+
+    li:has(a[href*="#feature"])::before {
+      content: "feature"; --color: var(--feature-color);
+    }
+  }
+
+  h3 {
+    margin-left: calc(-1 * var(--content-padding));
+    margin-right: calc(-1 * var(--content-padding));
+    padding-left: calc(0.5 * var(--content-padding));
+    padding-right: calc(1.5 * var(--content-padding));
+    padding-top: 6px;
+    padding-bottom: 4px;
+    margin-top: 1.75em;
+    scroll-margin-top: 0.75em;
+
+    position: sticky;
+    top: 0;
+    background: #fffc;
+    box-shadow: 0 3px 4px #fff3;
+    border-bottom: 2px solid #22222238;
+    backdrop-filter:
+      contrast(0.9) brightness(1.4) contrast(0.2) brightness(2.0) saturate(1.4) blur(6px);
+
+    &::before {
+      background: color-mix(in srgb, var(--color), 65% #ffffff);
+      padding: 5px 10px;
+      margin-right: 10px;
+      border-bottom-right-radius: 5px;
+      border-top-left-radius: 5px;
+    }
+
+    &.code::before { content: "code"; }
+    &.coffee::before { content: "coffee"; }
+    &.data::before { content: "data"; }
+    &.design::before { content: "design"; }
+    &.feature::before { content: "feature"; }
+  }
+
+  h3 { font-size: 1.17em; }
+  h3 { margin-bottom: 0;  }
+  h3 + * { margin-top: 1.17em; }
+
+  footer {
+    line-height: 1.2;
+    p { margin: 0; }
+
+    &::before {
+      content: "";
+      display: block;
+      width: 14ch;
+      height: 2px;
+      margin-bottom: 1em;
+      margin-top: 3em;
+      background: #c7c7c7;
+    }
+
+    address {
+      font-style: normal;
+    }
+  }
+}
diff --git a/theme/neb/static/img/5002.png b/theme/neb/static/img/5002.png
new file mode 100644
index 0000000..7f0bfb8
--- /dev/null
+++ b/theme/neb/static/img/5002.png
Binary files differdiff --git a/theme/neb/static/img/5003.png b/theme/neb/static/img/5003.png
new file mode 100644
index 0000000..b33c3e9
--- /dev/null
+++ b/theme/neb/static/img/5003.png
Binary files differdiff --git a/theme/neb/templates/base.html b/theme/neb/templates/base.html
new file mode 100644
index 0000000..53350ef
--- /dev/null
+++ b/theme/neb/templates/base.html
@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html lang="{% block html_lang %}{{ DEFAULT_LANG }}{% endblock html_lang %}">
+  <head>
+    {% block head %}
+      <meta charset="utf-8" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+      <meta name="generator" content="Pelican" />
+      <title>{% block title %}{{ SITENAME|striptags }}{%endblock%}</title>
+      <link rel="stylesheet" type="text/css" href="{{ SITEURL }}/theme/css/neb-style.css" />
+      {% if FEED_ALL_ATOM %}
+        <link href="{{ FEED_DOMAIN }}/{% if FEED_ALL_ATOM_URL %}{{ FEED_ALL_ATOM_URL }}{% else %}{{ FEED_ALL_ATOM }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME|striptags }} Atom Feed" />
+      {% endif %}
+      {% if FEED_ALL_RSS %}
+        <link href="{{ FEED_DOMAIN }}/{% if FEED_ALL_RSS_URL %}{{ FEED_ALL_RSS_URL }}{% else %}{{ FEED_ALL_RSS }}{% endif %}" type="application/rss+xml" rel="alternate" title="{{ SITENAME|striptags }} RSS Feed" />
+      {% endif %}
+      {% block extra_head %}{% endblock extra_head %}
+    {% endblock head %}
+  </head>
+
+  <body id="index" class="home">
+    <header id="banner" class="body">
+      <h1><a href="{{ SITEURL }}/">{{ SITENAME }}{% if SITESUBTITLE %} <strong>{{ SITESUBTITLE }}</strong>{% endif %}</a></h1>
+      <nav><ul>
+        {% for title, link in MENUITEMS %}
+          <li><a href="{{ link }}">{{ title }}</a></li>
+        {% endfor %}
+
+        {% if DISPLAY_PAGES_ON_MENU -%}
+          {% for pg in pages %}
+            <li{% if pg == page %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ pg.url }}">{{ pg.title }}</a></li>
+          {% endfor %}
+        {% endif %}
+
+        {% if DISPLAY_CATEGORIES_ON_MENU -%}
+          {% for cat, null in categories %}
+            <li{% if cat == category %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ cat.url }}">{{ cat }}</a></li>
+          {% endfor %}
+        {% endif %}
+
+        {% if FEED_ALL_ATOM %}
+          <li class="right" style="--color: #ef5226"><a href="{{ FEED_DOMAIN }}/{% if FEED_ALL_ATOM_URL %}{{ FEED_ALL_ATOM_URL }}{% else %}{{ FEED_ALL_ATOM }}{% endif %}" type="application/atom+xml" rel="alternate">atom</a></li>
+        {% endif %}
+
+        {% if FEED_ALL_RSS %}
+          <li class="right" style="--color: #ef5226"><a href="{{ FEED_DOMAIN }}/{% if FEED_ALL_RSS_URL %}{{ FEED_ALL_RSS_URL }}{% else %}{{ FEED_ALL_RSS }}{% endif %}" type="application/rss+xml" rel="alternate">rss</a></li>
+        {% endif %}
+      </ul></nav>
+    </header>
+
+    <main id="top">
+      {% block content %}
+      {% endblock %}
+    </main>
+
+    <footer id="contentinfo" class="body">
+      <p>Proudly powered by <a rel="nofollow" href="https://getpelican.com/">Pelican</a>, which takes great advantage of <a rel="nofollow" href="https://www.python.org/">Python</a>.<br>
+      Various background tiles from <a href="https://background-tiles.com/">background-tiles.com</a>.</p>
+    </footer>
+  </body>
+</html>
generated by cgit-pink 1.3.0-6-gf8a5 (git 2.35.1) at 2025-06-05 22:27:34 +0000