X-Git-Url: https://git.chrismorgan.info/gitweb/blobdiff_plain/662457e5a80e8f1037547efc535d6e888a7d5a74..15c020263f5c99b3598a48428ad9a7fd4af0c06b:/static/gitweb.css

diff --git a/static/gitweb.css b/static/gitweb.css
index 0cd760a..b3bf60b 100644
--- a/static/gitweb.css
+++ b/static/gitweb.css
@@ -8,8 +8,28 @@ body {
 	margin: 0;
 	background-color: #ffffff;
 	color: #000000;
+	/*display: flex;
+	flex-direction: column;*/
+}
+
+.cards {
 	display: flex;
 	flex-direction: column;
+	gap: 1rem;
+	margin: 1rem;
+}
+
+.cards > article {
+	border: 1px solid #ddd;
+}
+
+.cards > article > .header > .title {
+	--card-title-pad-left: 0.5rem;
+	padding: 0.25rem 0.5rem;
+}
+
+.cards > article > table {
+	padding: 0;
 }
 
 a {
@@ -81,17 +101,18 @@ div.page_nav a:visited {
 }
 
 div.page_path {
-	padding: 8px;
+	padding: 0.5rem 1rem;
 	font-weight: bold;
-	border: solid #d9d8d1;
+	border: solid #ddd;
 	border-width: 0px 0px 1px;
 }
 
-footer {
+.page_footer {
 	margin-top: auto;
+	margin-top: 2rem;
 	display: flex;
-	padding: 4px 8px;
-	background-color: #d9d8d1;
+	padding: 0.5rem 1rem;
+	background-color: #ddd;
 	justify-content: flex-end;
 }
 
@@ -103,22 +124,22 @@ div.page_footer_text {
 }
 
 div#generating_info {
-	margin: 4px;
+	margin: 0.5rem 1rem;
 	font-size: smaller;
 	text-align: center;
 	color: #505050;
 }
 
 div.page_body {
-	padding: 8px;
+	padding: 0.5rem 1rem;
 	font-family: monospace;
 }
 
 div.title, a.title {
 	display: block;
-	padding: 6px 8px;
+	padding: 0.5rem 1rem;
 	font-weight: bold;
-	background-color: #edece6;
+	background-color: #ddd;
 	text-decoration: none;
 	color: #000000;
 }
@@ -128,17 +149,22 @@ div.readme {
 }
 
 a.title:hover {
-	background-color: #d9d8d1;
+	background-color: #ccc;
 }
 
 div.title_text {
-	padding: 6px 0px;
-	border: solid #d9d8d1;
+	padding: 0;
+	border: solid #ccc;
 	border-width: 0px 0px 1px;
 }
 
+:root {
+	/* FIXME: not good, too tied to the font, restructure */
+	--log-sidebar-width: 10rem;
+}
+
 div.log_body {
-	padding: 8px 8px 8px 150px;
+	padding: 8px 8px 8px var(--log-sidebar-width);
 }
 
 time {
@@ -147,7 +173,8 @@ time {
 
 time.age {
 	float: left;
-	width: 142px;
+	/* From .cards > article > .header > .title padding-left; eww, TODO tidy all this up */
+	width: calc(var(--log-sidebar-width) - var(--card-title-pad-left));
 }
 
 span.signoff {
@@ -155,13 +182,13 @@ span.signoff {
 }
 
 div.log_link {
-	padding: 0px 8px;
-	font-size: 70%;
+	padding: 0 0.5rem;
+	font-size: 80%;
 	font-family: sans-serif;
 	font-style: normal;
 	position: relative;
 	float: left;
-	width: 136px;
+	width: calc(var(--log-sidebar-width) - 0.5rem - 0.5rem);
 }
 
 div.list_head {
@@ -215,9 +242,12 @@ a.text:hover {
 }
 
 table {
-	padding: 8px 4px;
+	padding: 0.5rem 1rem;
 	border-spacing: 0;
 }
+table.tree {
+	padding: 0;
+}
 
 table.diff_tree {
 	font-family: monospace,m;
@@ -259,21 +289,17 @@ th {
 	text-align: left;
 }
 
-/* do not change row style on hover for 'blame' view */
-tr.light,
-table.blame .light:hover {
-	background-color: #ffffff;
+th:first-child {
+	padding-left: 0;
 }
 
-tr.dark,
-table.blame .dark:hover {
-	background-color: #f6f6f0;
+/* do not change row style on hover for 'blame' view */
+tr.light {
+	background-color: #ffffff;
 }
 
-/* currently both use the same, but it can change */
-tr.light:hover,
-tr.dark:hover {
-	background-color: #edece6;
+tr.dark {
+	background-color: #f6f6f6;
 }
 
 /* boundary commits in 'blame' view */
@@ -289,14 +315,13 @@ tr.color2 { background-color: #f6f6ff; }
 tr.color3 { background-color: #fff6f6; }
 
 td {
-	padding: 2px 5px;
-	vertical-align: top;
+	padding: 0.25rem 0.5rem;
 }
 
 td.link, td.selflink {
 	padding: 2px 5px;
 	font-family: sans-serif;
-	font-size: 70%;
+	font-size: 80%;
 }
 
 td.selflink {
@@ -409,13 +434,8 @@ div.diff.extended_header {
 
 div.diff.header {
 	font-weight: bold;
-
-	background-color: #edece6;
-
-	margin-top: 4px;
-	padding: 4px 0px 2px 0px;
-	border: solid #d9d8d1;
-	border-width: 1px 0px 1px 0px;
+	background-color: #eee;
+	box-shadow: inset 0 1px #0003;
 }
 
 div.diff.header a.path {
@@ -425,16 +445,17 @@ div.diff.header a.path {
 div.diff.extended_header,
 div.diff.extended_header a.path,
 div.diff.extended_header a.hash {
-	color: #777777;
+	color: #333;
 }
 
 div.diff.extended_header .info {
-	color: #b0b0b0;
+	opacity: 0.5;
 }
 
-div.diff.extended_header {
-	background-color: #f6f5ee;
-	padding: 2px 0px 2px 0px;
+div.diff.extended_header,
+div.diff.from_file,
+div.diff.to_file {
+	background-color: #eee;
 }
 
 div.diff a.list,
@@ -481,9 +502,6 @@ div.diff.chunk_header {
 }
 
 div.diff.chunk_header {
-	border: dotted #ffe0ff;
-	border-width: 1px 0px 0px 0px;
-	margin-top: 2px;
 }
 
 div.diff.chunk_header span.chunk_info {
@@ -492,6 +510,7 @@ div.diff.chunk_header span.chunk_info {
 
 div.diff.chunk_header span.section {
 	color: #aa22aa;
+	font-style: italic;
 }
 
 div.diff.incomplete {
@@ -570,7 +589,7 @@ a.rss_logo {
 	background-color: #ff6600;
 	font-weight: bold;
 	font-family: sans-serif;
-	font-size: 70%;
+	font-size: 80%;
 	text-align: center;
 	text-decoration: none;
 }
@@ -589,7 +608,7 @@ a.rss_logo.generic:hover {
 
 span.refs span {
 	padding: 0px 4px;
-	font-size: 70%;
+	font-size: 80%;
 	font-weight: normal;
 	border: 1px solid;
 	background-color: #ffaaff;