Update cgit.css

1 files changed, 72 insertions, 12 deletions

diff --git a/www/cgit.css b/www/cgit.css
index 249017c..c3e015f 100644
--- a/www/cgit.css
+++ b/www/cgit.css
@@ -50,14 +50,12 @@ div#cgit table#header {
     background-color: var(--color-surface-container);
     color: var(--color-on-surface);
     padding: 1rem;
-    /* Transform table to flex for responsiveness */
     display: flex;
     flex-wrap: wrap;
     align-items: center;
     border-bottom: 1px solid var(--color-outline-variant);
 }
 
-/* Fix for table structure within header */
 div#cgit table#header tbody,
 div#cgit table#header tr {
     display: contents;
@@ -92,7 +90,7 @@ div#cgit table#header td.sub {
     padding-top: 0.25rem;
     color: var(--color-outline);
     font-size: 0.9rem;
-    border-top: none; /* Removing legacy border */
+    border-top: none;
 }
 
 /* Input Elements */
@@ -127,7 +125,7 @@ div#cgit table.tabs {
     margin: 0;
     width: 100%;
     background-color: var(--color-surface);
-    display: flex; /* Modern layout */
+    display: flex;
     flex-wrap: wrap;
     padding: 0 1rem;
 }
@@ -257,6 +255,7 @@ div#cgit table.diff,
 div#cgit table.ssdiff {
     width: 100%;
     border: 1px solid var(--color-outline-variant);
+    border-collapse: collapse;
     border-radius: 4px;
     overflow: hidden;
     margin-top: 1rem;
@@ -271,6 +270,11 @@ div#cgit table.ssdiff td.lineno {
     padding: 0 0.5em;
 }
 
+div#cgit table.blob td.lines {
+    width: 100%;
+    vertical-align: top;
+}
+
 div#cgit table.blob td.linenumbers a,
 div#cgit table.ssdiff td.lineno a {
     display: inline-block;
@@ -290,6 +294,58 @@ div#cgit table.ssdiff td {
     color: var(--color-on-surface);
 }
 
+div#cgit table.bin-blob {
+    width: 100%;
+    border: 1px solid var(--color-outline-variant);
+    border-collapse: collapse;
+    border-radius: 4px;
+    overflow: hidden;
+    margin-top: 1rem;
+    background: var(--color-surface-container-lowest);
+    font-family: monospace;
+    font-size: 0.95em;
+}
+
+div#cgit table.bin-blob th {
+    text-align: left;
+    font-weight: 600;
+    color: var(--color-primary);
+    background-color: var(--color-surface-container);
+    padding: 0.5rem 0.75rem;
+    border-bottom: 2px solid var(--color-outline-variant);
+    font-family: sans-serif;
+}
+
+div#cgit table.bin-blob td {
+    padding: 0.25rem 0.75rem;
+    color: var(--color-on-surface);
+    white-space: pre;
+    vertical-align: middle;
+}
+
+div#cgit table.bin-blob td.right {
+    text-align: right;
+    border-right: 1px solid var(--color-outline-variant);
+    background: var(--color-surface-container-high);
+    color: var(--color-outline);
+    padding-right: 0.75rem;
+    user-select: none;
+}
+
+div#cgit table.bin-blob td.hex {
+    font-family: monospace;
+    padding-left: 1rem;
+}
+
+div#cgit table.bin-blob tr:nth-child(even) td.hex {
+    background: var(--color-surface-container-low);
+}
+
+div#cgit table.bin-blob tr:hover td.hex {
+    background: var(--color-surface-container-high);
+    color: var(--color-on-surface);
+}
+
 /* Diff coloring */
 div#cgit table.diff td div.add,
 div#cgit table.ssdiff td.add {
@@ -444,7 +500,7 @@ div#cgit div.error {
 
     div#cgit div.content {
         padding: 1rem 0.5rem;
-        overflow-x: auto; /* Enable horizontal scroll for content */
+        overflow-x: auto;
     }
 
     /* Force tables to scroll on small screens */
@@ -454,16 +510,20 @@ div#cgit div.error {
         white-space: nowrap;
     }
 
+    div#cgit table.bin-blob {
+        white-space: nowrap;
+        display: block; /* Позволяет скроллить саму таблицу */
+        overflow-x: auto;
+    }
+
+    div#cgit table.bin-blob th,
+    div#cgit table.bin-blob td {
+        padding: 0.5rem;
+    }
+
     /* Allow wrapping in logs on mobile to prevent extreme width */
     div#cgit table.list td.logmsg {
         white-space: normal;
         min-width: 200px;
     }
 }
-
-/* Container override for highlighted code to handle font sizing */
-div#cgit table.blob pre {
-    font-family: monospace;
-    font-size: 0.95em;
-    line-height: 1.4;
-}