diff --git a/src/routes/root.ts b/src/routes/root.ts index 41b012e..fcc14a4 100644 --- a/src/routes/root.ts +++ b/src/routes/root.ts @@ -8,7 +8,6 @@ export const rootRoute = new Hono(); rootRoute.get("/", realIP, presentation, context => { // Move request to correct route const { port, ipAddress } = context.req.query(); - if (port) { if (ipAddress) { return context.redirect(`/${ipAddress}/${port}`); @@ -17,7 +16,10 @@ rootRoute.get("/", realIP, presentation, context => { } } + // Render index page + const userAgent = context.req.header("User-Agent"); return render(context, "index", { ip: context.get("ip"), + userAgent, }); }); diff --git a/templates/base.njk.html b/templates/base.njk.html index 87d7631..0f196ce 100644 --- a/templates/base.njk.html +++ b/templates/base.njk.html @@ -18,20 +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: 0 auto; border-radius: 1em; - padding: 3em; + padding: 2em; } h2 { @@ -43,7 +50,6 @@ display: flex; justify-content: end; column-gap: 1em; - margin-top: 1.4em; } .socials img { @@ -63,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 %}
-