alee/stegasoo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refine Tools page tab colors and site-wide styling

Browse Source 
- Green→lime→yellow gradient across tool tabs (#55df85→#c4f26a→#fdde4a)
- Complements blue→purple header gradient
- Fine-tuned header gold (#fee862) with subtle drop shadow
- Apply gold styling to .text-warning.small site-wide

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Aaron D. Lee
2026-01-04 13:45:40 -05:00
parent 3537e8cdf9
commit 81d3f37f09
1 changed files with 33 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
frontends/web/templates/tools.html
View File

@@ -148,21 +148,43 @@
.tool-section { display: none; }
.tool-section.active { display: block; }
/* Lime green tool tabs */
.tool-tabs .btn-outline-primary {
color: #a3e635;
border-color: #a3e635;
/* Green→lime→yellow gradient across tabs */
.tool-tabs .btn-outline-primary:nth-of-type(1) {
color: #55df85;
border-color: #55df85;
}
.tool-tabs .btn-outline-primary:nth-of-type(2) {
color: #c4f26a;
border-color: #c4f26a;
}
.tool-tabs .btn-outline-primary:nth-of-type(3) {
color: #fdde4a;
border-color: #fdde4a;
}
.tool-tabs .btn-outline-primary:hover {
background-color: rgba(163, 230, 53, 0.15);
border-color: #a3e635;
color: #a3e635;
.tool-tabs .btn-outline-primary:nth-of-type(1):hover {
background-color: rgba(85, 223, 133, 0.15);
}
.tool-tabs .btn-outline-primary:nth-of-type(2):hover {
background-color: rgba(196, 242, 106, 0.15);
}
.tool-tabs .btn-outline-primary:nth-of-type(3):hover {
background-color: rgba(253, 222, 74, 0.15);
}
.tool-tabs .btn-check:checked + .btn-outline-primary {
background-color: #a3e635;
border-color: #a3e635;
.tool-tabs .btn-check:checked + .btn-outline-primary:nth-of-type(1) {
background-color: #55df85;
border-color: #55df85;
color: #1a1a2e;
}
.tool-tabs .btn-check:checked + .btn-outline-primary:nth-of-type(2) {
background-color: #c4f26a;
border-color: #c4f26a;
color: #1a1a2e;
}
.tool-tabs .btn-check:checked + .btn-outline-primary:nth-of-type(3) {
background-color: #fdde4a;
border-color: #fdde4a;
color: #1a1a2e;
}
</style>