fix: target Bootstrap-specific classes in custom theme
Updated custom.css to target the actual Bootstrap classes used by asciinema server instead of generic selectors: - Added .navbar-dark and .bg-dark overrides for navigation - Added .btn-light targeting for button styles - Added .btn.active and .btn-light.active for active button states This ensures the Pivoine theme properly overrides Bootstrap's default dark theme classes. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -43,11 +43,18 @@ body {
|
|||||||
/* Header & Navigation */
|
/* Header & Navigation */
|
||||||
header,
|
header,
|
||||||
.header,
|
.header,
|
||||||
nav {
|
nav,
|
||||||
|
.navbar {
|
||||||
background-color: var(--pivoine-bg-darker) !important;
|
background-color: var(--pivoine-bg-darker) !important;
|
||||||
border-bottom: 2px solid var(--pivoine-rose) !important;
|
border-bottom: 2px solid var(--pivoine-rose) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Override Bootstrap navbar-dark and bg-dark */
|
||||||
|
.navbar-dark,
|
||||||
|
.bg-dark {
|
||||||
|
background-color: var(--pivoine-bg-darker) !important;
|
||||||
|
}
|
||||||
|
|
||||||
.navbar,
|
.navbar,
|
||||||
.nav-link {
|
.nav-link {
|
||||||
color: var(--pivoine-text-primary) !important;
|
color: var(--pivoine-text-primary) !important;
|
||||||
@@ -76,6 +83,7 @@ a:focus {
|
|||||||
|
|
||||||
button,
|
button,
|
||||||
.btn,
|
.btn,
|
||||||
|
.btn-light,
|
||||||
input[type="submit"] {
|
input[type="submit"] {
|
||||||
background-color: var(--pivoine-rose) !important;
|
background-color: var(--pivoine-rose) !important;
|
||||||
color: white !important;
|
color: white !important;
|
||||||
@@ -90,6 +98,7 @@ input[type="submit"] {
|
|||||||
|
|
||||||
button:hover,
|
button:hover,
|
||||||
.btn:hover,
|
.btn:hover,
|
||||||
|
.btn-light:hover,
|
||||||
input[type="submit"]:hover {
|
input[type="submit"]:hover {
|
||||||
background-color: var(--pivoine-rose-light) !important;
|
background-color: var(--pivoine-rose-light) !important;
|
||||||
box-shadow: 0 4px 8px var(--pivoine-rose-glow);
|
box-shadow: 0 4px 8px var(--pivoine-rose-glow);
|
||||||
@@ -98,11 +107,19 @@ input[type="submit"]:hover {
|
|||||||
|
|
||||||
button:active,
|
button:active,
|
||||||
.btn:active,
|
.btn:active,
|
||||||
|
.btn-light:active,
|
||||||
input[type="submit"]:active {
|
input[type="submit"]:active {
|
||||||
transform: translateY(0);
|
transform: translateY(0);
|
||||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Active state for buttons */
|
||||||
|
.btn.active,
|
||||||
|
.btn-light.active {
|
||||||
|
background-color: var(--pivoine-rose-dark) !important;
|
||||||
|
color: white !important;
|
||||||
|
}
|
||||||
|
|
||||||
/* Cards & Containers */
|
/* Cards & Containers */
|
||||||
.card,
|
.card,
|
||||||
.panel,
|
.panel,
|
||||||
|
|||||||
Reference in New Issue
Block a user