diff options
| -rw-r--r-- | Makefile | 36 | ||||
| -rw-r--r-- | new_journal.html | 99 | ||||
| -rw-r--r-- | partials/footer.html | 21 | ||||
| -rw-r--r-- | partials/head.html | 8 | ||||
| -rw-r--r-- | partials/header.html | 10 | ||||
| -rw-r--r-- | partials/meta.html | 7 | ||||
| -rw-r--r-- | partials/nav.html | 7 | ||||
| -rw-r--r-- | src/about.html | 29 | ||||
| -rw-r--r-- | src/journal.html | 47 | ||||
| -rw-r--r-- | src/pgp-key.txt (renamed from pgp-key.txt) | 0 | ||||
| -rw-r--r-- | src/style.css (renamed from new_journal.css) | 42 |
11 files changed, 163 insertions, 143 deletions
@@ -1,19 +1,31 @@ -HTML := index.html blog.html contact.html new_journal.html -OUT_HTML := $(addprefix build/, $(HTML)) +HTML := journal.html about.html +CSS := style.css +RESOURCES := glider.png -CSS := main.css new_journal.css -OUT_CSS := $(addprefix build/, $(CSS)) +PARTIALS := $(addprefix partials/, meta.html nav.html footer.html) -PARTIALS := $(addprefix partials/, head.html header.html footer.html) -RESOURCES := $(addprefix build/resources/, glider.png) +FILES := $(HTML) $(CSS) pgp-key.txt \ + $(addprefix resources/, $(RESOURCES)) -site : $(OUT_HTML) $(OUT_CSS) $(RESOURCES) +site: $(addprefix build/, $(FILES)) -build/%.html: %.html $(PARTIALS) $(OUT_CSS) - ./scripts/awink $< $@ +clean: + rm -rf build/* -build/%.css: %.css - ./scripts/awink $< $@ +build/%.html: src/%.html $(PARTIALS) + @./scripts/awink $< $@ + @echo Compiled $< → $@ + +build/%.css: src/%.css + @install -Dm644 $< $@ + @echo Compiled $< → $@ build/resources/%: resources/% - install -D $< $@ + @install -Dm644 $< $@ + @echo Compiled $< → $@ + +build/pgp-key.txt: src/pgp-key.txt + @install -Dm644 $< $@ + @echo Compiled $< → $@ + +partials/%: diff --git a/new_journal.html b/new_journal.html deleted file mode 100644 index ac8116d..0000000 --- a/new_journal.html +++ /dev/null @@ -1,99 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> -<head> - <meta charset="UTF-8"> - <title>~/journal</title> - <link href="new_journal.css" rel="stylesheet"> - - <meta name="viewport" content="width=device-width, initial-scale=1.0"> - - <meta name="author" content="Johannes Löthberg"> - <link rel="me author" href="https://plus.google.com/+JohannesLothberg" - title="Johannes Löthberg <johannes@kyriasis.com>"> - <link rel="publisher" href="https://plus.google.com/+JohannesLothberg"> -</head> -<body> - <header> - <nav> - <ul> - <li><a href="#">~kyrias/</a></li> - <li><a href="#">journal/</a></li> - <li><a href="#">contact/</a></li> - </ul> - </nav> - <h1>The lost journal</h1> - </header> - - - <article class="post" id="post:1"> - <h2 class="title" >Blogpost</h2> - <div class="info"> - <time datetime="2014-08-22T09:50:23Z">2014-08-22 09:50 UTC</time> - </div> - - <p>Developers developers developers developers developers developers - developers developers developers developers developers DEVELOPERS open - source microsoft excel. Leadership i have never honestly thrown a chair - in my life open source i don't know what a monopoly is no i do not have - an ipod most people steal music windows phone linux is a cancer. Open - source DEVELOPERS most people steal music leadership. Innovation - outlook vista windows open source bing. DEVELOPERS developers - developers developers developers developers developers developers - developers developers developers developers winning Zune programming - open source vista linux is not in the public domain innovation.</p> - - <p>Windows will be everywhere powerpoint presentation i have never - honestly thrown a chair in my life microsoft excel google is not a real - company DEVELOPERS outlook i don't know what a monopoly is Zune. I've - got my kids brainwashed there's no chance that the iPhone is going to - get any significant market share developers developers developers - developers developers developers developers developers developers - developers developers microsoft excel linux is a cancer programming - vista. Linux is a cancer i've got my kids brainwashed no i do not have - an ipod most people steal music microsoft excel google is not a real - company. Outlook bing windows microsoft excel vista. No i do not have - an ipod powerpoint presentation DEVELOPERS linux is a cancer.</p> - </article> - - <article class="post" id="post:2"> - <h2 class="title" >jellefant</h2> - <div class="info"> - <time datetime="2014-10-06T20:44:08Z">2014-10-06 20:44 UTC</time> - </div> - - <p>I don't actually have anything at all to write here. So why am I even making this? Who the hell knows?!</p> - - <p>Jelle is a jellefant ❤</p> - </article> - - <article class="post" id="post:3"> - <h2 class="title" >Blogpost</h2> - <div class="info"> - <time datetime="2014-08-22T09:50:23Z">2014-08-22 09:50 UTC</time> - </div> - - <p>Developers developers developers developers developers developers - developers developers developers developers developers DEVELOPERS open - source microsoft excel. Leadership i have never honestly thrown a chair - in my life open source i don't know what a monopoly is no i do not have - an ipod most people steal music windows phone linux is a cancer. Open - source DEVELOPERS most people steal music leadership. Innovation - outlook vista windows open source bing. DEVELOPERS developers - developers developers developers developers developers developers - developers developers developers developers winning Zune programming - open source vista linux is not in the public domain innovation.</p> - - <p>Windows will be everywhere powerpoint presentation i have never - honestly thrown a chair in my life microsoft excel google is not a real - company DEVELOPERS outlook i don't know what a monopoly is Zune. I've - got my kids brainwashed there's no chance that the iPhone is going to - get any significant market share developers developers developers - developers developers developers developers developers developers - developers developers microsoft excel linux is a cancer programming - vista. Linux is a cancer i've got my kids brainwashed no i do not have - an ipod most people steal music microsoft excel google is not a real - company. Outlook bing windows microsoft excel vista. No i do not have - an ipod powerpoint presentation DEVELOPERS linux is a cancer.</p> - </article> -</body> -</html> diff --git a/partials/footer.html b/partials/footer.html index e5e4641..7dcbd78 100644 --- a/partials/footer.html +++ b/partials/footer.html @@ -1,11 +1,16 @@ <footer> - <p> - Copyright © by Johannes Löthberg 2014<br /> +<p id="copy"> + © 2014 by Johannes Löthberg<br /> You can find me on: - <a href="https://plus.google.com/+JohannesLothberg?rel=author" rel="me">Google+</a> - <a href="mailto:johannes@kyriasis.com">Email</a> - </p> - <a id="emblem" href='http://www.catb.org/hacker-emblem/'> - <img src='resources/glider.png' alt='hacker emblem' /> - </a> + <span id="contact-info"> + <a rel="me" href="mailto:johannes@kyriasis.com">Email</a> + <a rel="me" href="https://twitter.com/kyriasis">Twitter</a> + <a rel="me" href="https://plus.google.com/+JohannesLothberg">Google+</a> + <a rel="me" href="sms:+46739525259">SMS</a> + </span> +</p> + +<a id="emblem" href='http://www.catb.org/hacker-emblem/'> + <img src='resources/glider.png' alt='hacker emblem' /> +</a> </footer> diff --git a/partials/head.html b/partials/head.html deleted file mode 100644 index 42d2fe6..0000000 --- a/partials/head.html +++ /dev/null @@ -1,8 +0,0 @@ -<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> -<meta name="keywords" content="Johannes Löthberg, kyrias, demize, Arch Linux OP" /> -<meta name="description" content="Johannes Löthberg's little home on the Internet" /> -<meta name="author" content="Johannes Löthberg" /> - -<link rel="me author" href="https://plus.google.com/+JohannesLothberg" /> -<link rel="publisher" href="https://plus.google.com/+JohannesLothberg" /> -<link rel="meta" type="application/rdf+xml" href="foaf.rdf" /> diff --git a/partials/header.html b/partials/header.html deleted file mode 100644 index e8a2c10..0000000 --- a/partials/header.html +++ /dev/null @@ -1,10 +0,0 @@ -<header> - <h1><a href="index.html">Johannes Löthberg</a></h1> - <nav> - <ul> - <li><a href="index.html">~/</a></li> - <li><a href="blog.html">~/blog/</a></li> - <li><a href="contact.html">~/contact/</a></li> - </ul> - </nav> -</header> diff --git a/partials/meta.html b/partials/meta.html new file mode 100644 index 0000000..57d12ae --- /dev/null +++ b/partials/meta.html @@ -0,0 +1,7 @@ +<link href="style.css" rel="stylesheet"> + +<meta name="viewport" content="width=device-width, initial-scale=1.0"> + +<meta name="author" content="Johannes Löthberg"> +<link rel="me author" href="https://plus.google.com/+JohannesLothberg" + title="Johannes Löthberg <johannes@kyriasis.com>"> diff --git a/partials/nav.html b/partials/nav.html new file mode 100644 index 0000000..c1fcb5a --- /dev/null +++ b/partials/nav.html @@ -0,0 +1,7 @@ +<nav> + <ul> + <li><a href="#">~kyrias/</a></li> + <li><a href="journal.html">journal/</a></li> + <li><a href="about.html">about/</a></li> +</ul> +</nav> diff --git a/src/about.html b/src/about.html new file mode 100644 index 0000000..346bb47 --- /dev/null +++ b/src/about.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>~/about</title> +%include partials/meta.html +</head> +<body> + <header> +%include partials/nav.html + <h1>About me</h1> + </header> + + <article id="about"> + <p> + I'm “kyrias”, also commonly known as “demize”, tho you can also call me “Johannes Löthberg” if you’d like. Tho if you ask my local government my last name doesn’t actually contain an ‘h’, which is quite annoying. Anyway, I happen to currently be 18 years of age and I come from and have lived in Sweden my whole life. + </p> + + <p> + Online you can find me in various places in almost all cases under one of the previously mentioned names. I’m most commonly in the <a href="https://archlinux.org">Arch Linux</a> IRC channels on <a href="https://freenode.net">freenode</a> as “demize”, where I somehow ended up as a channel operator, but you will also sometimes find me on <a href="https://unix.stackexchange.org">unix.SE</a> as <a href="http://unix.stackexchange.com/users/33521" rel="me">kyrias</a>. + </p> + + <p id="last-upd">Last updated <time datetime="2014-10-10">2014-10-10</time></p> + <p id="author"><a rel="author" href="about.html">Johannes Löthberg</a></p> + </article> + +%include partials/footer.html +</body> +</html> diff --git a/src/journal.html b/src/journal.html new file mode 100644 index 0000000..5e85fde --- /dev/null +++ b/src/journal.html @@ -0,0 +1,47 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>~/journal</title> +%include partials/meta.html +</head> +<body> + <header> +%include partials/nav.html + <h1>The lost journal</h1> + </header> + + + <article class="post" id="post:1"> + <h2 class="title" >Blogpost</h2> + <div class="info"> + <time datetime="2014-08-22T09:50:23Z">2014-08-22 09:50 UTC</time> + <a rel="author" href="./about">Johannes Löthberg</a> + </div> + + <p>Developers developers developers developers developers developers + developers developers developers developers developers DEVELOPERS open + source microsoft excel. Leadership i have never honestly thrown a chair + in my life open source i don't know what a monopoly is no i do not have + an ipod most people steal music windows phone linux is a cancer. Open + source DEVELOPERS most people steal music leadership. Innovation + outlook vista windows open source bing. DEVELOPERS developers + developers developers developers developers developers developers + developers developers developers developers winning Zune programming + open source vista linux is not in the public domain innovation.</p> + </article> + + <article class="post" id="post:2"> + <h2 class="title" >jellefant</h2> + <div class="info"> + <time datetime="2014-10-06T20:44:08Z">2014-10-06 20:44 UTC</time> + </div> + + <p>I don't actually have anything at all to write here. So why am I even making this? Who the hell knows?!</p> + + <p>Jelle is a jellefant ❤</p> + </article> + +%include partials/footer.html +</body> +</html> diff --git a/pgp-key.txt b/src/pgp-key.txt index ac499b4..ac499b4 100644 --- a/pgp-key.txt +++ b/src/pgp-key.txt diff --git a/new_journal.css b/src/style.css index 92a8bf0..bddd481 100644 --- a/new_journal.css +++ b/src/style.css @@ -18,6 +18,7 @@ body { border-color: #ccc; background-color: #fcfcfc; font-family: 'PT Sans'; + font-size: 16px; -moz-hyphens: auto; -webkit-hyphens: auto; } @@ -46,6 +47,13 @@ header h1 { font-size: 1.6rem; } +.post, #about { + margin-bottom: 1rem; + border-bottom: 0.15rem; + border-bottom-style: dotted; + border-bottom-color: #bbb; +} + .post .title { font-size: 1.4rem; margin-top: 0; @@ -66,7 +74,6 @@ header h1 { padding-left: 0.1rem; font-family: 'Georgia'; } - @media (max-width: 767px) { .post > p:first-of-type:first-letter { padding-top: 0.3rem; @@ -74,9 +81,32 @@ header h1 { font-size: 2.7rem; } } -body > * + :not(:last-child) { - margin-bottom: 1rem; - border-bottom: 0.15rem; - border-bottom-style: dotted; - border-bottom-color: #bbb; + +#about p#last-upd { + font-size: 14px; + text-align: right; + margin: 0; +} +#about p#author { + font-size: 14px; + text-align: right; + margin: 0 0 1rem 0; +} + +footer { + font-size: 16px; + display: flex; + align-content: flex-start; +} +footer p { + flex: 1; + margin-top: 0; + padding-top: 0; +} +footer #emblem { + flex: 1; + flex-basis: 55px; + flex-grow: 0; + margin-top: 0.2rem; + padding-top: 0; } |