From 3b17c1f479ae15d53d1ae25b5fd7a029c4776b82 Mon Sep 17 00:00:00 2001 From: Froge Date: Sun, 20 Jul 2025 19:51:11 +1000 Subject: [PATCH] Add CSS and HTML for blog post styling, remove unused flexbox elements --- static/main.css | 24 +++++++++++++++++------- templates/base.html | 2 +- templates/index.html | 2 +- templates/page.html | 15 ++++++++++++--- 4 files changed, 31 insertions(+), 12 deletions(-) diff --git a/static/main.css b/static/main.css index c893f2c..99d93f0 100644 --- a/static/main.css +++ b/static/main.css @@ -4,11 +4,10 @@ /* Magic fix which forces outer most element to full view size for background scaling */ html { - min-height: 100%; - min-width: 100%; + height: 100%; + width: 100%; display: flex; justify-content: center; - align-items: column; } body { @@ -21,8 +20,8 @@ body { -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; - /* Fancy background CSS lives here */ - background: linear-gradient(to bottom right, rgba(0,0,0, 1) 2%, rgba(65,15,75, 1) 40%, rgba(65,15,90, 1) 50%, rgba(30,15,80, 1) 60%, rgba(0,0,0, 1) 98%); + /* Fancy background CSS colouring lives here */ + background: linear-gradient(to bottom right, rgba(0,0,0, 1), rgba(65,15,75, 1) 40%, rgba(65,15,90, 1) 50%, rgba(30,15,80, 1) 60%, rgba(0,0,0, 1)); } li { @@ -82,6 +81,13 @@ a:hover { text-align: center; } +#blog-page-title { + padding-top: 1.5rem; + padding-bottom: 1rem; + letter-spacing: -2px; + text-align: center; +} + .dotted-border { border-bottom: #e4e4e4 8px dotted; width: 100%; @@ -92,11 +98,15 @@ a:hover { text-align: center; } -.blog-post-container { +.blog-entry-container { padding: 1rem; padding-top: 2rem; } -.blog-post-title { +.blog-entry-title { padding-top: 2rem; } + +.blog-post-date { + text-align: left; +} diff --git a/templates/base.html b/templates/base.html index 2b7c948..a4a4bd9 100644 --- a/templates/base.html +++ b/templates/base.html @@ -25,7 +25,7 @@

-
+

View the latest posts

{% block content %} {% endblock %}
diff --git a/templates/index.html b/templates/index.html index ab1d1d4..ce6db9e 100644 --- a/templates/index.html +++ b/templates/index.html @@ -5,7 +5,7 @@ {% for page in section.pages %} -
  • {{ page.date }} // {{ page.title }}
    • +
  • {{ page.date }} // {{ page.title }}
    • {% endfor %} {% endblock content %} diff --git a/templates/page.html b/templates/page.html index 559a8a0..bac1e34 100644 --- a/templates/page.html +++ b/templates/page.html @@ -7,10 +7,19 @@ -

    Cyberfrog blog

    +
    + + +
    -

    {{ page.title }}

    -

    Published: {{ page.date }} || Last updated: {{ page.updated }}

    +

    {{ page.title }}

    +
    Published: {{ page.date }} || Last updated: {{ page.updated }}
    {% block content %} {% endblock %}