From 384df9c1c1526615adcb3af6d5d017b4cdd8cf15 Mon Sep 17 00:00:00 2001 From: Myzel394 <50424412+Myzel394@users.noreply.github.com> Date: Fri, 20 Dec 2024 21:15:31 +0100 Subject: [PATCH] feat: Improve UI --- templates/base.njk.html | 80 +++++++++++++++++++++++++--------------- templates/index.njk.html | 9 +++-- 2 files changed, 56 insertions(+), 33 deletions(-) diff --git a/templates/base.njk.html b/templates/base.njk.html index 5106feb..0f196ce 100644 --- a/templates/base.njk.html +++ b/templates/base.njk.html @@ -18,22 +18,27 @@ color: #eee; margin: 0; padding: 0; - height: 100vh; + min-height: 100vh; display: flex; flex-direction: column; justify-content: center; + + padding-bottom: 1em; + } + + .wrapper { + margin: 0 auto; + width: 100%; + max-width: 40em; + padding: 2em 0; } main { background-color: #212126; - width: 100%; - max-width: 40em; - margin: 2em auto; + margin: 0 auto; border-radius: 1em; - padding: 3em; - - overflow: scroll; + padding: 2em; } h2 { @@ -45,7 +50,6 @@ display: flex; justify-content: end; column-gap: 1em; - margin-top: 1.4em; } .socials img { @@ -65,34 +69,50 @@ text-align: center; opacity: 0.6; } + + header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 1em; + } + + header h2 { + margin: 0; + } {% block header %}{% endblock %} -
- {% block main %} -

Am I Open

- {% endblock %} +
+
+
+

Am I Open

-
+ {% block main %} {% endblock %} +
+
+ No logs are stored. I have no idea that you were here.
-
- No logs are stored. I have no idea that you were here. - {% block scripts %} {% endblock %} + + {% block scripts %} {% endblock %} diff --git a/templates/index.njk.html b/templates/index.njk.html index f985ade..8d7b1e4 100644 --- a/templates/index.njk.html +++ b/templates/index.njk.html @@ -63,9 +63,12 @@ color: #fff; filter: invert(1); } + + .user-agent { + font-size: 0.7rem; + } {% endblock %} {% block main %} -

Am I Open

A small, terminal-friendly utility for checking your ports and your IP address. @@ -76,13 +79,13 @@ Copy

-

+

Your User-Agent (Header): {{userAgent}}

-