diff --git a/static/main.css b/static/main.css index c893f2c..2b4bd69 100644 --- a/static/main.css +++ b/static/main.css @@ -1,38 +1,23 @@ -* { - margin: 0rem; -} - -/* Magic fix which forces outer most element to full view size for background scaling */ -html { - min-height: 100%; - min-width: 100%; - display: flex; - justify-content: center; - align-items: column; -} - body { - font-family: monospace; + font-family: Open Sans, Arial; color: #e4e4e4; - padding-top: 2rem; - font-size: 18px; - max-width: 55rem; + font-size: 14px; + margin: auto; + max-width: 50em; line-height: 1.4; -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%); + text-align: center; + height: 100%; + width: 100%; } li { + margin-top: 1em; list-style-type: none; } -ul { - padding: 0rem; -} - a { color: #4361ee; text-decoration: none; @@ -48,22 +33,20 @@ a:hover { } #site-content { - display: flex; - justify-content: center; - align-items: center; - flex-direction: column; - padding: 2rem; - border-radius: 1rem; - background: rgba(0,0,0, 0.78); - box-shadow: 1rem 1rem 1rem 1rem rgba(0,0,0, 0.5); + height: 100%; + margin: 5em auto; + padding: 1em; + padding-bottom: 2em; + border-radius: 1em; + background: rgba(0,0,0, 0.7); + box-shadow: 1em 1em 1em 1em rgba(0,0,0, 0.5); } #ascii-header { font-size: 10px; color: #e4e4e4; text-decoration: none; - padding: 1rem; - text-align: center; + border-bottom: #541287 0.8em dotted; } #ascii-header a { @@ -76,27 +59,30 @@ a:hover { text-decoration: none; } -#welcome-message { - padding: 1rem; - font-weight: bold; - text-align: center; +.blog-post-date { + margin: 0; + padding: 0; } -.dotted-border { - border-bottom: #e4e4e4 8px dotted; +.blog-title { + margin-bottom: 0; +} + + +/* Magic background CSS lives here */ +#bg-effect-container { + z-index: -1; + position: absolute; + bottom: 0%; + left: 0%; + height: 100%; + width: 100%; + background-color: #000000; + overflow: hidden; +} + +.bg-effect { + background: linear-gradient(to bottom right, rgba(0,0,0,1) 10%, rgba(65,14,105, 0.6) 40%, rgba(55,17,95,0.7) 50%, rgba(32,14,84,0.6) 60%, rgba(0,0,0,1) 90%); + height: 100%; width: 100%; } - -.title { - letter-spacing: -2px; - text-align: center; -} - -.blog-post-container { - padding: 1rem; - padding-top: 2rem; -} - -.blog-post-title { - padding-top: 2rem; -} diff --git a/templates/base.html b/templates/base.html index 2b7c948..4f56b3b 100644 --- a/templates/base.html +++ b/templates/base.html @@ -6,7 +6,7 @@ 🐸 CyberFrog - + 
@@ -16,21 +16,21 @@
 ██         ██    ██   ██ ██      ██   ██ ██      ██   ██ ██    ██ ██    ██    ██  ██  ██ ██      
  ██████    ██    ██████  ███████ ██   ██ ██      ██   ██  ██████   ██████  ██ ██      ██ ███████
-
-
-

Welcome

-

This blog is made with 💜 and Zola!

-

It's currently running on Vultr for free with 500MB of RAM and OpenBSD -

-
-
-
-

View the latest posts

- {% block content %} {% endblock %} +

+ This is my blog made with Zola! +

+

It's currently running on Vultr for free with 500MB of RAM and OpenBSD

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