From ef30f5b898f3798e8a0690ed47a30320a6f8b14b Mon Sep 17 00:00:00 2001
From: Luka Hietala <luka.hietala08@gmail.com>
Date: Thu, 27 Nov 2025 18:46:23 +0200
Subject: [PATCH] start improving styling

---
 static/styles.css     | 25 ++++++++++++++++---------
 templates/commit.html | 39 +++++++++++++++++++--------------------
 2 files changed, 35 insertions(+), 29 deletions(-)

diff --git a/static/styles.css b/static/styles.css
index 22aa68a..49e8dc3 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -1,5 +1,4 @@
 body {
-    font-family: sans-serif;
     font-size: 12pt;
     color: #000;
     background: white;
@@ -19,17 +18,17 @@ nav {
     top: 0;
     width: screen;
     position: sticky;
-    padding: 0.5em 1em;
-    border-bottom: 1px solid lightgray;
+    padding: 0.8em 2em;
     display: flex;
     justify-content: space-between;
     align-items: center;
-    background-color: #fbfbfb;
+    background-color: #f5f5f5;
+    border-bottom: 1px solid lightgray;
 }
 
 nav a {
     color: black;
-    margin-right: 0.5em;
+    margin-right: 1em;
 }
 
 nav a.active {
@@ -42,7 +41,7 @@ pre {
 }
 
 .content {
-    padding: 1em;
+    padding: 1em 2em;
 }
 
 /* dont make headers too big */
@@ -66,15 +65,20 @@ table {
     max-width: 100%;
 }
 
+th {
+    background-color: #f0f0f0;
+}
+
 th, td {
-    border: 1px solid lightgray;
     padding: 4px 8px;
     text-align: left;
     white-space: nowrap;
+    border: 1px solid lightgray;
 }
 
+
 tbody tr:nth-child(even) {
-	background-color: #f9f9f9;
+	background-color: #f1f1f1;
 }
 
 /* commits table */
@@ -146,7 +150,7 @@ table.commits-table .message-col {
 }
 
 .blob-content {
-    margin: 0 -1em;
+    margin: 0 -2em;
 }
 
 .blob-content pre {
@@ -164,6 +168,9 @@ table.commits-table .message-col {
     overflow-x: auto;
 }
 
+.commit-message {
+    margin: 1em 0;
+}
 
 /* index */
 .main-layout {
diff --git a/templates/commit.html b/templates/commit.html
index 2dd5001..e5fe2f6 100644
--- a/templates/commit.html
+++ b/templates/commit.html
@@ -1,25 +1,21 @@
 {% extends "base.html" %}
 
 {% block content %}
-    <h1>Commit {{ commit.id }}</h1>
-    <p>Message: {{ commit.message }}</p>
-    <p>Author: {{ commit.author.name }} &lt;{{ commit.author.email }}&gt;</p>
-    <p>Committer: {{ commit.committer.name }} &lt;{{ commit.committer.email }}&gt;</p>
-    <p>Date: {{ commit.date | datetime }}</p>
-    {% if commit.parent_id %}
-    <p>Parent: <a href="{{ url_for('commit_detail', repo_name=repo_name, commit_id=commit.parent_id) }}">{{ commit.parent_id }}</a></p>
-    {% endif %}
-    <p>Tree: <a href="{{ url_for('repo_tree_path', repo_name=repo_name, path='') }}?ref={{ commit.tree_id }}">{{ commit.tree_id }}</a></p>
-    <p><a href="{{ url_for('repo_tree_path', repo_name=repo_name, path='') }}?ref={{ commit.id }}">View Tree</a></p>
+    <h1>commit {{ commit.id }}</h1>
+        Author: {{ commit.author.name }} &lt;{{ commit.author.email }}&gt;<br>
+        Committer: {{ commit.committer.name }} &lt;{{ commit.committer.email }}&gt;<br>
+        Date: {{ commit.date | datetime }}
+        {% if commit.parent_id %}<br>
+        Parent: <a href="{{ url_for('commit_detail', repo_name=repo_name, commit_id=commit.parent_id) }}">{{ commit.parent_id }}</a>
+        {% endif %}<br>
+        Tree: <a href="{{ url_for('repo_tree_path', repo_name=repo_name, path='') }}?ref={{ commit.tree_id }}">{{ commit.tree_id }}</a>
+        <div class="commit-message">
+            {{ commit.message }}
+        </div>
+        <a href="{{ url_for('repo_tree_path', repo_name=repo_name, path='') }}?ref={{ commit.id }}">View Tree</a>
     {% if commit.diff %}
-    <h2>Diff Stats</h2>
-    <ul>
-        <li>Files Changed: {{ commit.diff_stats.files_changed }}</li>
-        <li>Insertions: {{ commit.diff_stats.insertions }}</li>
-        <li>Deletions: {{ commit.diff_stats.deletions }}</li>
-    </ul>
     <h2>Changed Files</h2>
-    <table>
+    <table class="changed-files-table">
         <thead>
             <tr>
                 <th>File</th>
@@ -32,15 +28,18 @@
             {% for file in commit.changed_files %}
             <tr>
                 <td><a href="{{ url_for('repo_blob_path', repo_name=repo_name, path=file.file) }}?ref={{ commit.id }}">{{ file.file }}</a></td>
-                <td style="color: green;">+{{ file.additions }}</td>
-                <td style="color: red;">-{{ file.deletions }}</td>
+                <td class="insertions">+{{ file.additions }}</td>
+                <td class="deletions">-{{ file.deletions }}</td>
                 <td>{{ file.status }}</td>
             </tr>
             {% endfor %}
         </tbody>
     </table>
     {% if commit.parent_id %}
-    <p><a href="{{ url_for('repo_diff', repo_name=repo_name) }}?id1={{ commit.parent_id }}&id2={{ commit.id }}">View Full Diff</a> | <a href="{{ url_for('commit_patch', repo_name=repo_name, commit_id=commit.id) }}">Patch</a></p>
+    <div>
+        <a href="{{ url_for('repo_diff', repo_name=repo_name) }}?id1={{ commit.parent_id }}&id2={{ commit.id }}">View Full Diff</a> | 
+        <a href="{{ url_for('commit_patch', repo_name=repo_name, commit_id=commit.id) }}">Patch</a>
+    </div>
     {% endif %}
     {% else %}
     <p>No changes compared to parent</p>
-- 
2.47.3