diff options
| -rw-r--r-- | .gitignore | 1 | ||||
| -rw-r--r-- | content/weblog/2018-07-21_first-post/index.md | 2 | ||||
| -rw-r--r-- | static/css/yaroslavps.css | 54 | ||||
| -rw-r--r-- | static/svg/background.svg | 4 | ||||
| -rw-r--r-- | templates/archive.html | 7 | ||||
| -rw-r--r-- | templates/base.html | 20 | ||||
| -rw-r--r-- | templates/index.html | 6 | ||||
| -rw-r--r-- | templates/page.html | 5 | ||||
| -rw-r--r-- | templates/weblog.html | 7 |
9 files changed, 88 insertions, 18 deletions
diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..364fdec --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +public/ diff --git a/content/weblog/2018-07-21_first-post/index.md b/content/weblog/2018-07-21_first-post/index.md index 3904e53..365204c 100644 --- a/content/weblog/2018-07-21_first-post/index.md +++ b/content/weblog/2018-07-21_first-post/index.md @@ -1,6 +1,6 @@ +++ title = "A weblog by Yaroslav de la Peña Smirnov" -date = 2018-07-21T09:06:00Z +date = 2018-07-21T20:06:00Z +++ Hello, and welcome to my weblog. As you may have read in my home page, I will be diff --git a/static/css/yaroslavps.css b/static/css/yaroslavps.css index f4f722f..21e70a6 100644 --- a/static/css/yaroslavps.css +++ b/static/css/yaroslavps.css @@ -3,7 +3,10 @@ html, body { width: 100%; min-height: 100vh; - background-color: #1b1e25; + background-color: #000; + background-image: url("/svg/background.svg"); + background-size: 45px 45px; + background-repeat: repeat; margin: 0; padding: 0; font-size: 18px; @@ -32,12 +35,12 @@ p { } a, a:visited { - color: #3f6e90; + color: #7fac96; text-decoration: none; } a:hover { - color: #81acc1; + color: #5b8277; } h1, @@ -53,24 +56,65 @@ h4 > a, h5 > a, h6 > a { font-family: "IBM Plex Serif", Georgia, serif; + font-weight: 300; +} + +hr { + border-style: solid; + border-color: #dedede; + border-width: 1px 0 0 0; } span.icon { font-family: "IBM Plex Mono"; + font-size: 2em; + margin: auto 0.5em; +} + +.publish-date { + color: #a1a6b2; + font-family: "IBM Plex Sans"; + font-weight: 300; + font-style: italic; +} + +h2 > span.publish-date { + font-size: 0.8em; } .main-container { display: grid; - grid-template-columns: 3fr 1fr; - max-width: 62em; + grid-template-columns: 5fr 2fr; + grid-template-rows: min-content auto; + max-width: 1080px; margin: 0 auto; + min-height: 100vh; + background-color: #000; +} + +.landing-page-container { + grid-column-start: 1; + grid-column-end: 3; } .header-container { grid-column-start: 1; grid-column-end: 3; + text-align: center; + padding: 0 1em; } .sidebar-container { padding: 1em; } + +.links-container { + text-align: center; +} + +.content-container { +} + +.post-container { + padding: 2em; +} diff --git a/static/svg/background.svg b/static/svg/background.svg new file mode 100644 index 0000000..d178423 --- /dev/null +++ b/static/svg/background.svg @@ -0,0 +1,4 @@ +<svg viewbox="0 0 45 45" xmlns="http://www.w3.org/2000/svg"> + <line x1="0" x2="45" y1="45" y2="45" stroke="#a1a6b2" stroke-dasharray="1 2" /> + <line x1="45" x2="45" y1="0" y2="45" stroke="#a1a6b2" stroke-dasharray="1 2" /> +</svg> diff --git a/templates/archive.html b/templates/archive.html index 68daf65..c3eb817 100644 --- a/templates/archive.html +++ b/templates/archive.html @@ -1,12 +1,13 @@ {% extends "base.html" %} {% block content %} {% set section = get_section(path="weblog/_index.md") %} -<div class="posts-list"> +<div class="post-container"> + <h2>Archive</h2> {% for year, posts in section.pages | group_by(attribute="year") %} - <h2>{{ year }}</h2> + <h3>{{ year }}</h3> <ul> {% for post in posts %} - <li>{{ post.date }} - <a href="{{ post.permalink }}">{{ post.title }}</a></li> + <li><span class="publish-date">{{ post.date | date }}</span> - <a href="{{ post.permalink }}">{{ post.title }}</a></li> {% endfor %} </ul> {% endfor %} diff --git a/templates/base.html b/templates/base.html index f689bf3..43b0b77 100644 --- a/templates/base.html +++ b/templates/base.html @@ -14,6 +14,7 @@ <div class="main-container"> <div class="header-container"> <h1><a href="/">Yaroslav de la Peña Smirnov</a></h1> + <hr> </div> {% block page %} <div class="content-container"> @@ -21,8 +22,23 @@ {% endblock %} </div> <div class="sidebar-container"> - <p>Hello, my name is Yaroslav de la Peña Smirnov. Welcome to my weblog.</p> - <a href="/weblog/archive">Archive</a> + <p>Hello, my name is Yaroslav de la Peña Smirnov, welcome to my + weblog. Sometimes I write software, sometimes I might write my mind + here. </p> + <div class="links-container"> + <a href="https://github.com/Yaroslav-95" title="GitHub"><span class="icon"></span></a> + <a href="https://git.yaroslavps.com/yaroslav" title="Git server"><span class="icon"></span></a> + <a href="/rss.xml" title="RSS feed"><span class="icon"></span></a> + </div> + <h3>Navigation</h3> + <ul class="navigation-list"> + <li><a href="/">Landing page</a></li> + <li><a href="/weblog/">Weblog ~</a></li> + <li><a href="/weblog/archive">Weblog archive</a></li> + </ul> + <h3>Contact</h3> + <p>If you want to tell me something, you can contact me by email at:</p> + <a href="mailto:contact@yaroslavps.com">contact@yaroslavps.com</a> </div> {% endblock %} </div> diff --git a/templates/index.html b/templates/index.html index 4e009e3..64bea0c 100644 --- a/templates/index.html +++ b/templates/index.html @@ -1,5 +1,7 @@ {% extends "base.html" %} {% block page %} - <h2>Welcome to my site!</h2> - <a href="/weblog">Go to weblog</a> + <div class="landing-page-container"> + <h2>Welcome to my site!</h2> + <a href="/weblog">Go to weblog</a> + </div> {% endblock %} diff --git a/templates/page.html b/templates/page.html index 66faa93..4a3c86c 100644 --- a/templates/page.html +++ b/templates/page.html @@ -1,10 +1,9 @@ {% extends "base.html" %} {% block content %} {% set post = page %} -<div class="post-page"> +<div class="post-container"> <h2>{{ post.title }}</h2> - <p class="publish-date">{{ post.date }}</p> - <hr> + <p class="publish-date">Published on: {{ post.date | date(format="%b %d, %Y %H:%M Zulu") }}</p> {{ post.content | safe }} </div> {% endblock %} diff --git a/templates/weblog.html b/templates/weblog.html index a20f356..88abf61 100644 --- a/templates/weblog.html +++ b/templates/weblog.html @@ -2,8 +2,11 @@ {% block content %} <div class="posts-list"> {% for post in paginator.pages %} - <div class="post-preview"> - <h2><a href="{{ post.permalink }}">{{ post.title }}</a></h2> + <div class="post-container"> + <h2> + <a href="{{ post.permalink }}">{{ post.title }}</a> + <span class="publish-date">{{ post.date | date }}</span> + </h2> {% if post.summary %} {{ post.summary | safe }} {% endif %} |
