style(ui): improve ahead/behind colors and amend toggle styling

Adjust the repo ahead/behind meta colors and add subtle background
highlights for better visual distinction. Also introduce dedicated
CSS for the commit amend toggle input, including checked, focus, and
disabled states to improve usability and accessibility.

- Refine ahead/behind meta color and background emphasis
- Add complete styling for commit amend toggle states
This commit is contained in:
Christoph Brandau
2026-07-06 20:24:07 +02:00
parent d1d3604a6d
commit 98f3902839
+29 -2
View File
@@ -833,8 +833,8 @@
font-style: normal;
font-weight: 800;
}
.repo-row-meta .ahead { color: #4eca76; }
.repo-row-meta .behind { color: #e0a040; }
.repo-row-meta .ahead { color: #e0a040; background: rgba(224,160,64,0.13); }
.repo-row-meta .behind { color: #7aacff; background: rgba(122,172,255,0.13); }
.repo-row-icon {
min-height: 36px;
min-width: 36px;
@@ -1823,6 +1823,33 @@
font-size: 12px;
white-space: nowrap;
}
.commit-amend-toggle input {
appearance: none;
flex: 0 0 auto;
width: 14px;
height: 14px;
min-width: 14px;
min-height: 14px;
padding: 0;
border: 1px solid rgba(94,110,156,0.42);
border-radius: 4px;
background: rgba(13,14,26,0.78);
box-shadow: none;
cursor: pointer;
}
.commit-amend-toggle input:checked {
border-color: rgba(65,209,255,0.62);
background:
linear-gradient(135deg, rgba(65,209,255,0.92), rgba(100,108,255,0.92));
box-shadow: inset 0 0 0 2px rgba(13,14,26,0.82);
}
.commit-amend-toggle input:focus {
box-shadow: 0 0 0 2px rgba(65,209,255,0.2);
}
.commit-amend-toggle input:disabled {
cursor: not-allowed;
opacity: 0.5;
}
.commit-undo-button {
flex: 0 0 auto;
min-height: 26px;