Refine Tools page tab colors and site-wide styling
- 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:
@@ -148,21 +148,43 @@
|
|||||||
.tool-section { display: none; }
|
.tool-section { display: none; }
|
||||||
.tool-section.active { display: block; }
|
.tool-section.active { display: block; }
|
||||||
|
|
||||||
/* Lime green tool tabs */
|
/* Green→lime→yellow gradient across tabs */
|
||||||
.tool-tabs .btn-outline-primary {
|
.tool-tabs .btn-outline-primary:nth-of-type(1) {
|
||||||
color: #a3e635;
|
color: #55df85;
|
||||||
border-color: #a3e635;
|
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 {
|
.tool-tabs .btn-outline-primary:nth-of-type(1):hover {
|
||||||
background-color: rgba(163, 230, 53, 0.15);
|
background-color: rgba(85, 223, 133, 0.15);
|
||||||
border-color: #a3e635;
|
}
|
||||||
color: #a3e635;
|
.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 {
|
.tool-tabs .btn-check:checked + .btn-outline-primary:nth-of-type(1) {
|
||||||
background-color: #a3e635;
|
background-color: #55df85;
|
||||||
border-color: #a3e635;
|
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;
|
color: #1a1a2e;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user