From 914ab54a4055812c1eb39f1efd03e701e169c00c Mon Sep 17 00:00:00 2001 From: "Dustin C. Hatch" Date: Wed, 13 Apr 2022 17:05:48 -0500 Subject: [PATCH] home: Add link boxes I'm probably never going to write blog posts frequently enough to warrant having the main focus of this site be the recent posts. Instead, the home page can just be links to each section of the site. The icons used here are from the [Material Design Icons][0] project. [0]: https://materialdesignicons.com/ --- sass/style.scss | 26 ++++++++++++++++++++- static/bug.svg | 1 + static/file-document-outline.svg | 1 + static/image.svg | 1 + static/post.svg | 1 + templates/index.html | 39 ++++++++++++++++++++------------ 6 files changed, 53 insertions(+), 16 deletions(-) create mode 100644 static/bug.svg create mode 100644 static/file-document-outline.svg create mode 100644 static/image.svg create mode 100644 static/post.svg diff --git a/sass/style.scss b/sass/style.scss index 1a34818..9bfddf0 100644 --- a/sass/style.scss +++ b/sass/style.scss @@ -173,7 +173,7 @@ main.main-content div.main-content { font-size: 10pt; text-align: center; list-style-type: none; - margin: 0; + margin: 0 0 4em 0; padding: 0; } @@ -189,6 +189,30 @@ main.main-content div.main-content { content: " • "; } +.home .links { + width: 100%; + max-width: 10in; + margin: auto; + display: flex; + flex-wrap: wrap; + justify-content: space-around; +} + +.home .links .link { + background-color: $background-color; + flex: 0 10em; + margin: 1em; + padding: 0 0 1em 0; + text-align: center; +} + +.home .links svg { + fill: $text-color; + width: 100%; + height: auto; + aspect-ratio: 1 / 1; +} + #songquote { display: none; font-size: 120%; diff --git a/static/bug.svg b/static/bug.svg new file mode 100644 index 0000000..96c6be5 --- /dev/null +++ b/static/bug.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/file-document-outline.svg b/static/file-document-outline.svg new file mode 100644 index 0000000..90831cb --- /dev/null +++ b/static/file-document-outline.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/image.svg b/static/image.svg new file mode 100644 index 0000000..5c61724 --- /dev/null +++ b/static/image.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/post.svg b/static/post.svg new file mode 100644 index 0000000..339f0b3 --- /dev/null +++ b/static/post.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/templates/index.html b/templates/index.html index cd33396..c6b16bd 100644 --- a/templates/index.html +++ b/templates/index.html @@ -16,22 +16,31 @@
  • Tinkerer
  • Writer
    • -
    -

    Recent Posts

    -{% set blog = get_section(path="blog/_index.md") %} -{% for page in blog.pages | slice(end=3) %} - -

    {{ page.title }}

    -
    - -
    -{% if page.summary %} -

    {{ page.summary }}

    -{% else %} -

    {{ page.content | striptags | split(pat=" ") | slice(end=20) | join(sep=" ") | safe }}{% if page.word_count > 20 %}…{% endif %}

    -{% endif %} +
    +
    + +{{ load_data(path='static/file-document-outline.svg') | safe }} +Curriculum Vitae -{% endfor %} +
    +
    + +{{ load_data(path='static/bug.svg') | safe }} +Projects + +
    +
    + +{{ load_data(path='static/post.svg') | safe }} +Blog + +
    +
    + +{{ load_data(path='static/image.svg') | safe }} +Photos + +
    {% endblock %}