From 5c46a55ba69406efe441af48b40bdedf56345c79 Mon Sep 17 00:00:00 2001
From: Alexander Leonhardt <equinox.salexander@gmail.com>
Date: Sun, 16 Aug 2026 13:34:13 +0200
Subject: fix: Updated the structure in the header to resemble the original
 design, updated css to adapt to mobile phones

---
 cgit.css | 60 +++++++++++++++++++++++++++++++++++++++++++++++++-----------
 1 file changed, 49 insertions(+), 11 deletions(-)

(limited to 'cgit.css')

diff --git a/cgit.css b/cgit.css
index 1db3571..3996db4 100644
--- a/cgit.css
+++ b/cgit.css
@@ -42,20 +42,56 @@ div#cgit table#header td.logo {
 }
 
 div#cgit table#header td.main {
+	display: inline-flex;
+	justify-content: center;
 	font-size: 200%;
-	padding-left: 10px;
+	padding-left: 1rem;
+	padding-right: 1rem;
 	white-space: nowrap;
 	color: #777;
-	width: 1rem;
 }
 
+
+div#cgit table#header tr:nth-child(2) {
+	border-top: solid 1px #777;
+}
+
+div#cgit table#header tr {
+  display: flex;
+}
+@media(width <= 40rem) {
+div#cgit table#header tr {
+  justify-content: center;
+}
+div#cgit table#header tr:nth-child(2) {
+	flex-direction: column-reverse;
+}
+div#cgit table#header tr {
+	flex-direction: column;
+}
+div#cgit table#header tbody td.form {
+	padding-top: 0.1rem;
+}
+}
+@media(width > 40rem) {
+div#cgit table#header tr {
+  justify-content: space-between;
+}
+}
+
+
 div#cgit table#header td.main span#root-title {
 	color: #eee;
 	font-variant: small-caps;
+	min-width: 15rem;
+	font-family: serif;
 }
 
 div#cgit table#header td.main span.separator {
 	font-size: 2rem;
+	padding-left: 0.4em;
+	padding-right: 0.4em;
+	line-height: 1.1em;
 	color: #999;
 }
 
@@ -64,28 +100,30 @@ div#cgit table#header td.main a {
 }
 
 div#cgit table#header td.form {
-	padding-top: 1em;
+	display: inline-flex;
+	justify-content: center;
+	padding: 0.8rem 1rem 0.2rem 1rem;
 	vertical-align: bottom;
-	padding-right: 1em;
-	padding-bottom: 0.2rem;
 	white-space: nowrap;
 	text-align: right;
 }
 
 
 div#cgit table#header td.subem {
+	display: inline-flex;
 	color: #777;
-	padding-top: 1em;
-	padding-right: 10px;
+	padding-right: 1em;
+	padding-left: 1em;
+	justify-content: center;
 	font-size: 80%;
-	text-align: right;
 }
 div#cgit table#header td.sub {
+	display: inline-flex;
+	justify-content: center;
 	color: #777;
-	border-top: solid 1px #777;
-	padding-left: 10px;
+	padding-left: 1em;
+	padding-right: 1em;
 	white-space: wrap;
-	width: 1rem;
 }
 
 div#cgit table.tabs::-webkit-scrollbar {
-- 
cgit