From 92794bf08da4508945c41f161d2017a8f03e2b9d Mon Sep 17 00:00:00 2001
From: Tom Willemse <tom@ryuslash.org>
Date: Sun, 6 Nov 2022 01:44:08 -0700
Subject: [PATCH] Improve cgit theme
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This adds a fer extra colors that work well in dark mode, light should still be
fixed.

Also fixes up a few other visual elements:

- Line numbers should line up with lines of code again.

- The buttons to switch to a different branch at the top of a repository page
  looks a little more in-place. It has the same padding as the other form
  elements, and the same background as the rest of the header.

- Give other form elements on repository pages more consistent padding.

- Separate the ‘log’, ‘stats’, and ‘plain’ buttons on the repository tree page
  so they don't just look like they're one word together.
---
 src/less/cgit.less | 62 ++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 62 insertions(+)

diff --git a/src/less/cgit.less b/src/less/cgit.less
index e8f5558..25b9f67 100644
--- a/src/less/cgit.less
+++ b/src/less/cgit.less
@@ -1,6 +1,10 @@
 @import 'include/common';
 @import 'include/components';
 
+a.button {
+  padding: 0 0.5rem;
+}
+
 .content > table {
   width: 100%;
 }
@@ -19,12 +23,60 @@
   }
 }
 
+.form form {
+  padding: 0 1rem;
+}
+
+.highlight {
+  @media (prefers-color-scheme: dark) {
+    background-color: @dark-background !important;
+  }
+  @media (prefers-color-scheme: light) {
+    background-color: @light-background !important;
+  }
+
+  .nv {
+    color: #bbca82 !important;
+  }
+
+  .nb {
+    color: #90ca82 !important;
+  }
+
+  .k {
+    color: #caad82 !important;
+  }
+
+  .ch, .c1 {
+    color: #f071bd !important;
+    font-style: normal !important;
+  }
+
+  .s2 {
+    color: #82ca9f !important;
+  }
+
+  .m {
+    color: #ca8282 !important;
+  }
+}
+
 .main {
   &:extend(.title-header);
 
   display: block;
 }
 
+.linenumbers, .lines {
+  vertical-align: top;
+
+  pre {
+    margin: 0;
+    padding: 0;
+    border: none;
+  }
+}
+
 .logo {
   width: 0;
   padding: 0;
@@ -93,4 +145,14 @@
     margin: 0;
     border: 0;
   }
+
+  .form {
+    padding: 0;
+
+    form {
+      &:extend(.header-block);
+      text-align: right;
+      padding: 0 1rem;
+    }
+  }
 }