about summary refs log tree commit diff stats
diff options
context:
space:
mode:
authorAlan Pearce2023-06-23 09:05:57 +0200
committerAlan Pearce2023-06-23 14:04:53 +0200
commit181ab0399d23a8edb732610d8e545ed227136908 (patch)
tree96d6fb74d9596e54eaf483c67faa51e7a9502354
parent6be02cea11848175ead843d2ecad78dd0548a8a4 (diff)
downloadwebsite-181ab0399d23a8edb732610d8e545ed227136908.tar.lz
website-181ab0399d23a8edb732610d8e545ed227136908.tar.zst
website-181ab0399d23a8edb732610d8e545ed227136908.zip
Make style a css file (although zola requires .html extension)
-rw-r--r--templates/feed-styles.html2
-rw-r--r--themes/bear/templates/base.html2
-rw-r--r--themes/bear/templates/style.css194
l---------[-rw-r--r--]themes/bear/templates/style.html183
4 files changed, 199 insertions, 182 deletions
diff --git a/templates/feed-styles.html b/templates/feed-styles.html
index a6cae59..66dac33 100644
--- a/templates/feed-styles.html
+++ b/templates/feed-styles.html
@@ -12,7 +12,9 @@
         <meta charset="utf-8"/>
         <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
         <meta name="viewport" content="width=device-width, initial-scale=1"/>
+        <style>
         {% include "style.html" ignore missing -%}
+        </style>
       </head>
       <body>
         <main>
diff --git a/themes/bear/templates/base.html b/themes/bear/templates/base.html
index 4ba8442..3b5340e 100644
--- a/themes/bear/templates/base.html
+++ b/themes/bear/templates/base.html
@@ -12,7 +12,9 @@
   <link rel="alternate" type={% if config.feed_filename == "atom.xml" %}"application/atom+xml"{% else %}"application/rss+xml"{% endif %} title="{{ config.title }}" href="{{ get_url(path=config.feed_filename) | safe }}">
   {%- endblock -%}
   {%- endif %}
+  <style>
   {% include "style.html" ignore missing -%}
+  </style>
   {% include "custom_head.html" ignore missing -%}
 </head>
 <body>
diff --git a/themes/bear/templates/style.css b/themes/bear/templates/style.css
new file mode 100644
index 0000000..49b3680
--- /dev/null
+++ b/themes/bear/templates/style.css
@@ -0,0 +1,194 @@
+/* -*- mode: css; -*- */
+body {
+  font-family: Verdana, sans-serif;
+  margin: auto;
+  padding: 20px;
+  max-width: 720px;
+  text-align: left;
+  background-color: #fff;
+  word-wrap: break-word;
+  overflow-wrap: break-word;
+  line-height: 1.5;
+  color: #444;
+}
+
+.skip {
+  position: absolute;
+  top: -3em;
+  background: #fff;
+}
+.skip:focus {
+  top: 0;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+strong,
+b {
+  color: #222;
+}
+
+a {
+  color: #3273dc;
+}
+
+.title {
+  color: #222;
+  text-decoration: none;
+  border: 0;
+}
+
+time {
+  font-style: italic;
+}
+
+.title span {
+  font-weight: 400;
+}
+
+nav a {
+  margin-right: 10px;
+}
+
+.tags {
+  padding: unset;
+  font-size: small;
+}
+
+.tags > li {
+  list-style: none;
+  display: inline-block;
+}
+
+textarea {
+  width: 100%;
+  font-size: 1rem;
+}
+
+input {
+  font-size: 1rem;
+}
+
+main,article {
+  line-height: 1.6;
+}
+
+table {
+  width: 100%;
+}
+
+img {
+  max-width: 100%;
+}
+
+code {
+  padding: 2px 5px;
+  background-color: #f2f2f2;
+}
+
+pre code {
+  color: #222;
+  display: block;
+  padding: 20px;
+  white-space: pre-wrap;
+  font-size: 0.875rem;
+  overflow-x: auto;
+}
+
+div.highlight pre {
+  background-color: initial;
+  color: initial;
+}
+
+div.highlight code {
+  background-color: unset;
+  color: unset;
+}
+
+blockquote {
+  border-left: 1px solid #999;
+  color: #222;
+  padding-left: 20px;
+  font-style: italic;
+}
+
+footer {
+  padding: 25px;
+  text-align: center;
+}
+
+.helptext {
+  color: #777;
+  font-size: small;
+}
+
+.errorlist {
+  color: #eba613;
+  font-size: small;
+}
+
+/* blog posts */
+ul.blog-posts {
+  list-style-type: none;
+  padding: unset;
+}
+
+ul.blog-posts li {
+  display: flex;
+}
+
+ul.blog-posts li span {
+  flex: 0 0 130px;
+}
+
+ul.blog-posts li a:visited {
+  color: #8b6fcb;
+}
+
+@media (prefers-color-scheme: dark) {
+  body {
+    background-color: #333;
+    color: #ddd;
+  }
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6,
+  strong,
+  b {
+    color: #eee;
+  }
+
+  a {
+    color: #8cc2dd;
+  }
+
+  code {
+    background-color: #777;
+  }
+
+  pre code {
+    color: #ddd;
+  }
+
+  blockquote {
+    color: #ccc;
+  }
+
+  textarea,
+  input {
+    background-color: #252525;
+    color: #ddd;
+  }
+
+  .helptext {
+    color: #aaa;
+  }
+}
diff --git a/themes/bear/templates/style.html b/themes/bear/templates/style.html
index 9015890..f6b71cc 100644..120000
--- a/themes/bear/templates/style.html
+++ b/themes/bear/templates/style.html
@@ -1,182 +1 @@
-<style>
-  body {
-    font-family: Verdana, sans-serif;
-    margin: auto;
-    padding: 20px;
-    max-width: 720px;
-    text-align: left;
-    background-color: #fff;
-    word-wrap: break-word;
-    overflow-wrap: break-word;
-    line-height: 1.5;
-    color: #444;
-  }
-
-  .skip {
-    position: absolute;
-    top: -3em;
-    background: #fff;
-  }
-  .skip:focus {
-    top: 0;
-  }
-
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6,
-  strong,
-  b {
-    color: #222;
-  }
-
-  a {
-    color: #3273dc;
-  }
-
-  .title {
-    color: #222;
-    text-decoration: none;
-    border: 0;
-  }
-
-  .title span {
-    font-weight: 400;
-  }
-
-  nav a {
-    margin-right: 10px;
-  }
-
-  textarea {
-    width: 100%;
-    font-size: 1rem;
-  }
-
-  input {
-    font-size: 1rem;
-  }
-
-  main,article {
-    line-height: 1.6;
-  }
-
-  table {
-    width: 100%;
-  }
-
-  img {
-    max-width: 100%;
-  }
-
-  code {
-    padding: 2px 5px;
-    background-color: #f2f2f2;
-  }
-
-  pre code {
-    color: #222;
-    display: block;
-    padding: 20px;
-    white-space: pre-wrap;
-    font-size: 0.875rem;
-    overflow-x: auto;
-  }
-
-  div.highlight pre {
-    background-color: initial;
-    color: initial;
-  }
-
-  div.highlight code {
-    background-color: unset;
-    color: unset;
-  }
-
-  blockquote {
-    border-left: 1px solid #999;
-    color: #222;
-    padding-left: 20px;
-    font-style: italic;
-  }
-
-  footer {
-    padding: 25px;
-    text-align: center;
-  }
-
-  .helptext {
-    color: #777;
-    font-size: small;
-  }
-
-  .errorlist {
-    color: #eba613;
-    font-size: small;
-  }
-
-  /* blog posts */
-  ul.blog-posts {
-    list-style-type: none;
-    padding: unset;
-  }
-
-  ul.blog-posts li {
-    display: flex;
-  }
-
-  ul.blog-posts li span {
-    flex: 0 0 130px;
-  }
-
-  ul.blog-posts li a:visited {
-    color: #8b6fcb;
-  }
-
-  @media (prefers-color-scheme: dark) {
-    body {
-      background-color: #333;
-      color: #ddd;
-    }
-
-    h1,
-    h2,
-    h3,
-    h4,
-    h5,
-    h6,
-    strong,
-    b {
-      color: #eee;
-    }
-
-    a {
-      color: #8cc2dd;
-    }
-
-    code {
-      background-color: #777;
-    }
-
-    pre code {
-      color: #ddd;
-    }
-
-    blockquote {
-      color: #ccc;
-    }
-
-    textarea,
-    input {
-      background-color: #252525;
-      color: #ddd;
-    }
-
-    .helptext {
-      color: #aaa;
-    }
-  }
-
-</style>
+style.css
\ No newline at end of file