diff options
| -rw-r--r-- | Makefile | 12 | ||||
| -rw-r--r-- | blog/blog.py | 9 | ||||
| -rw-r--r-- | blog/post.py | 4 | ||||
| -rw-r--r-- | posts/drafts/hello-world/hello-world.md | 1 | ||||
| -rw-r--r-- | share/style.css | 131 | ||||
| -rw-r--r-- | templates/feed.html | 52 | ||||
| -rw-r--r-- | templates/post.html | 29 |
7 files changed, 219 insertions, 19 deletions
diff --git a/Makefile b/Makefile new file mode 100644 index 0000000..ad78306 --- /dev/null +++ b/Makefile @@ -0,0 +1,12 @@ +TEMPLATES := $(shell find templates -name '*.html' 2> /dev/null) +SHARE := $(shell find share -name '*' 2> /dev/null) +POSTS := $(shell find posts -name '*' 2> /dev/null) +CODE := $(shell find blog -name '*.py' 2> /dev/null) + +.PHONY: clean + +remote: $(TEMPLATES) $(SHARE) $(POSTS) + python3 blog/blog.py + +clean: + rm -rf remote diff --git a/blog/blog.py b/blog/blog.py index cb6ab1e..aa7bc82 100644 --- a/blog/blog.py +++ b/blog/blog.py @@ -22,6 +22,13 @@ def find_posts(template, basedir): posts.append(Post(template, os.path.join(basedir, subdir))) return posts +def copy_share(workdir): + for filename in os.listdir("share"): + source = os.path.join("share", filename) + destination = os.path.join(workdir, filename) + + shutil.copy(source, destination) + def generate_blog(include_drafts=False): env = Environment(loader=FileSystemLoader(searchpath="templates"), @@ -44,6 +51,8 @@ def generate_blog(include_drafts=False): feed = Feed(env.get_template("feed.html"), posts) feed.generate(workdir) + copy_share(workdir) + def main(): generate_blog(include_drafts=True) diff --git a/blog/post.py b/blog/post.py index 1d35b6c..eab9d0d 100644 --- a/blog/post.py +++ b/blog/post.py @@ -63,9 +63,9 @@ class Post(object): assert md, f"There is no markdown file in `{self.directory}`" - body = render.to_html(md) + content = render.to_html(md) rendered = self.template.render(title=self.metadata.title, date=self.metadata.date, - body=body) + content=content) render.write_file_content(os.path.join(workdir, "index.html"), rendered) diff --git a/posts/drafts/hello-world/hello-world.md b/posts/drafts/hello-world/hello-world.md index cecfa2d..06639ae 100644 --- a/posts/drafts/hello-world/hello-world.md +++ b/posts/drafts/hello-world/hello-world.md @@ -28,6 +28,7 @@ And embedded code like `this` and `this`. * lists Also, sometimes I use enumerated lists like this one. + 1. One. 2. Two. 3. Three. diff --git a/share/style.css b/share/style.css new file mode 100644 index 0000000..8dec075 --- /dev/null +++ b/share/style.css @@ -0,0 +1,131 @@ +/* Design based on Bear blog: https://bearblog.dev */ + +:root { + --width: 720px; + --font-main: Verdana, sans-serif; + --font-secondary: Verdana, sans-serif; + --font-scale: 1em; + --background-color: #fff; + --heading-color: #222; + --text-color: #444; + --link-color: #3273dc; + --visited-color: #8b6fcb; + --code-background-color: #f2f2f2; + --code-color: #222; + --blockquote-color: #222; +} + +body { + font-family: var(--font-secondary); + font-size: var(--font-scale); + margin: auto; + padding: 20px; + max-width: var(--width); + text-align: left; + background-color: var(--background-color); + word-wrap: break-word; + overflow-wrap: break-word; + line-height: 1.5; + color: var(--text-color); +} + +h1, h2, h3, h4, h5, h6 { + font-family: var(--font-main); + color: var(--heading-color); +} + +/*time { + color: #00000090; +}*/ + +a { + color: var(--link-color); + cursor: pointer; + text-decoration: none; +} + +a:hover { + text-decoration: underline; +} + +nav a { + margin-right: 8px; +} + +strong, b { + color: var(--heading-color); +} + +button { + margin: 0; + cursor: pointer; +} + +content { + line-height: 1.6; +} + +table { + width: 100%; +} + +hr { + border: 0; + border-top: 1px dashed; +} + +img { + max-width: 100%; +} + +code { + font-family: monospace; + padding: 2px; + color: var(--code-color); + border-radius: 3px; +} + +blockquote { + border-left: 1px solid #999; + color: var(--code-color); + padding-left: 20px; + font-style: italic; +} + +footer { + padding: 25px 0; + text-align: center; +} + +.title:hover { + text-decoration: none; +} + +.title h1 { + font-size: 1.5em; +} + +.inline { + width: auto !important; +} + +/* posts list */ +ul.posts { + list-style-type: none; + padding: unset; +} + +ul.posts li { + display: flex; +} + +ul.posts li span { + flex: 0 0 130px; +} + +ul.posts time { +} + +ul.posts li a:visited { + color: var(--visited-color); +} diff --git a/templates/feed.html b/templates/feed.html index ee1411e..b8fc4bf 100644 --- a/templates/feed.html +++ b/templates/feed.html @@ -4,20 +4,48 @@ <head> <meta charset="UTF-8"> - <title>Blog</title> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <meta name="title" content="blog.ilvokhin.com"> + + <title>blog.ilvokhin.com</title> + <link rel="stylesheet" type="text/css" href="style.css"/> </head> -<body> - {% if posts %} - <ul> - {% for post in posts %} - <li> - <a href="{{ post.name }}">{{ post.metadata.title }}</a> - ({{ post.metadata.date }}) - </li> - {% endfor %} - </ul> - {% endif %} +<body class="feed"> +<header> +<a class="title" href="/"> + <h1>blog.ilvokhin.com</h1> +</a> +</header> + +<main> +<content> + +{% if posts %} + <ul class="posts"> + {% for post in posts %} + + <li> + <span> + <i> + <time datetime="{{ post.metadata.date }}" pubdate> + {{ post.metadata.date }} + </time> + </i> + </span> + <a href="{{ post.name }}"> + {{ post.metadata.title }} + {% if post.is_draft() %} + (Draft) + {% endif %} + </a> + </li> + {% endfor %} + </ul> +{% endif %} + +</content> +</main> </body> </html> diff --git a/templates/post.html b/templates/post.html index 088b2f6..82250f8 100644 --- a/templates/post.html +++ b/templates/post.html @@ -4,14 +4,33 @@ <head> <meta charset="UTF-8"> - <title>{{ title }}</title> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <meta name="title" content="{{ title }}"> + + <title>{{ title }} | blog.ilvokhin.com</title> + <link rel="stylesheet" type="text/css" href="style.css" /> </head> -<body> - <h1>{{ title }}</h1> - <h3>{{ date }}</h3> +<body class="post"> +<header> +<a class="title" href="/"> + <h1>blog.ilvokhin.com</h1> +</a> +</header> + +<main> +<center> +<h1>{{ title }}</h1> +<p><i><time datetime="{{ date }}" pubdate> +{{ date }} +</time></i></p> +</center> + +<content> + {{ content|safe }} +</content> - {{ body|safe }} +</main> </body> </html> |