diff --git a/blog.html b/blog.html new file mode 100644 index 0000000..0d0011c --- /dev/null +++ b/blog.html @@ -0,0 +1,29 @@ + + + + + + {title} – midgard + + + +
+ A stuffed mouse in front of a wall with stripes of warm colours, this is Midgard's online avatar +
+ midgard +
+
+ +
+

{title}

+ {body} +
+ + + + + + diff --git a/blog/feeds.md b/blog/feeds.md index 90ebeac..b970122 100644 --- a/blog/feeds.md +++ b/blog/feeds.md @@ -1,5 +1,22 @@ title: Get started using feeds -summary: Pick a client, add some feeds, done +summary: Don't subscribe to our email newsletter published: 2020-06-02 --- + +Adding feeds in a feed reader is a simple way to subscribe to websites. A lot of sites support +this. + +The website provides a machine-readable document on a certain URL. You add this in your feed reader +software, which will then periodically fetch them. Whenever a new item is added, the reader will +pick up on this. If you want, you can configure it to notify you. + +## Pro and con + +## Choose a client + +Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. + +## Add some feeds + +Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. diff --git a/blog/irc.md b/blog/irc.md index 330fbb6..4d94a40 100644 --- a/blog/irc.md +++ b/blog/irc.md @@ -3,3 +3,11 @@ summary: Pick a client, join some channels, maybe register with NickServ published: 2020-06-02 --- + +IRC is a simple text protocol that's useful for channel-oriented messaging. It's used for +communities... + +## Choose a client + + +## Register your nickname diff --git a/do_blog.py b/do_blog.py new file mode 100755 index 0000000..cd04566 --- /dev/null +++ b/do_blog.py @@ -0,0 +1,42 @@ +#!/usr/bin/env python3 + +import sys +from strictyaml import load as load_yaml +from ipo import read, write, map, starstarmap, join, sort, ipo +from glob import glob +from markdown import markdown +import re + + +@ipo +def parted(data, regex): + """ + Two parts of data, delimited by the first element on which regex fullmatches. + + If a delimiter is found, the second part is an iterator over the remaining elements. Else it is None. + """ + first = [] + + it = iter(data) + try: + while True: + item = next(it) + if re.fullmatch(regex, item): + break + first.append(item) + except StopIteration: + return (first, None) + + return (first, it) + + +with open("blog.html") as blog_fh: + TEMPLATE = blog_fh.read() + +with open(sys.argv[1]) as file_in: + metadata_yaml, content = read(file_in) | parted("---+") + metadata = load_yaml(metadata_yaml | join("\n")).data + body = markdown(content | join("\n"), extras=[]) + +with open(sys.argv[2], "w") as file_out: + TEMPLATE.format(**metadata, body=body) | write(file=file_out) diff --git a/do_index.py b/do_index.py index d6d778e..8497727 100755 --- a/do_index.py +++ b/do_index.py @@ -1,10 +1,11 @@ #!/usr/bin/env python3 import sys -from strictyaml import load as load_yaml -from ipo import list, str, read, write, map, starstarmap, takewhile, join, sort from glob import glob import re +from strictyaml import load as load_yaml +from ipo import list, str, read, write, map, starstarmap, takewhile, join, sort + TEMPLATE = """
  • @@ -12,6 +13,7 @@ TEMPLATE = """
    {summary}
  • """ + def metadata(filename): with open(filename) as fh: metadata_yaml = read(fh) | takewhile(lambda line: line != "---") | join("\n") diff --git a/index.html b/index.html index bf74775..def007e 100644 --- a/index.html +++ b/index.html @@ -9,7 +9,7 @@
    A stuffed mouse in front of a wall with stripes of warm colours, this is Midgard's online avatar -

    +

    midgard

    diff --git a/makefile b/makefile index 5698a06..f162bac 100644 --- a/makefile +++ b/makefile @@ -7,15 +7,18 @@ BLOG_HTML ::= $(BLOG:%.md=$(BUILD_DIR)/%.html) all: $(BUILD_DIR)/index.html public $(BLOG_HTML) -$(BUILD_DIR)/index.html: $(BUILD_DIR) do_index.py index.html $(BLOG) - ./do_index.py "index.html" "$@" +$(BUILD_DIR)/index.html: index.html $(BLOG) do_index.py $(BUILD_DIR) + ./do_index.py "$<" "$@" -$(BUILD_DIR)/%.html: $(BUILD_DIR) do_blog.py %.md - ./do_blog.py "$(*F).md" "$@" +$(BUILD_DIR)/blog/%.html: blog/%.md blog.html do_blog.py $(BUILD_DIR)/blog + ./do_blog.py "$<" "$@" $(BUILD_DIR): mkdir -p "$@" +$(BUILD_DIR)/blog: + mkdir -p "$@" + public: cp -rt "$(BUILD_DIR)" public/. diff --git a/public/main.css b/public/main.css index 0a4df16..d928a53 100644 --- a/public/main.css +++ b/public/main.css @@ -34,9 +34,21 @@ body { "footer"; align-items: start; } +body.blog { + grid-template-rows: auto auto auto 1fr; + grid-template-areas: + "header" + "main" + "social" + "footer"; +} header { grid-area: header; } +main { + grid-area: main; + justify-self: center; +} #blog { grid-area: blog; } @@ -67,6 +79,13 @@ footer { "footer footer"; gap: 1em 3em; } + body.blog { + grid-template-rows: auto; + grid-template-areas: + "header main" + "social main" + "footer footer"; + } header { grid-area: header; } @@ -95,6 +114,13 @@ footer { "footer footer footer"; gap: 1em 4em; } + body.blog { + grid-template-columns: 1fr 3fr 1fr; + grid-template-areas: + "header main ." + "social main ." + "footer footer footer"; + } } @@ -152,13 +178,13 @@ header img { height: 25vmin; display: inline-block; } -h1 { +.sitename { margin: 0; margin-left: 0.3em; display: inline-block; font-size: 12vmin; } -header img, h1 { +header img, .sitename { vertical-align: middle; } @media (min-width:900px) or ((min-aspect-ratio:1/1) and (min-width:300px)) { @@ -170,7 +196,7 @@ header img, h1 { height: 27vmin; display: block; } - h1 { + .sitename { margin: 0.3em 0 0 0; display: block; font-size: 8vmin; @@ -182,7 +208,7 @@ header img, h1 { height: 250px; display: block; } - h1 { + .sitename { margin: 0.3em 0 0 0; display: block; font-size: 56pt; @@ -219,10 +245,13 @@ a .title { -aside { - +main { + line-height: 1.5; + max-width: 50em; } + + #social a { display: inline-block; width: 4em;