diff options
| -rw-r--r-- | templates/feed-styles.html | 2 | ||||
| -rw-r--r-- | themes/bear/templates/base.html | 2 | ||||
| -rw-r--r-- | themes/bear/templates/style.css | 194 | ||||
| l---------[-rw-r--r--] | themes/bear/templates/style.html | 183 |
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 |