diff --git a/docs/assets/css/extra.css b/docs/assets/css/extra.css index b639e2f7c..713feb4f2 100644 --- a/docs/assets/css/extra.css +++ b/docs/assets/css/extra.css @@ -1,18 +1,105 @@ +/* Root variables for primary colors */ +:root { + --md-primary-bg-color: #0d0d0d; /* Black background */ + --md-secondary-bg-color: #1a1a1a; /* Slightly lighter black */ + --md-accent-color: #FF073A; /* Neon red */ + --md-accent-color--hover: #FF2050; /* Bright neon red for hover */ + --md-text-color: #ffffff; /* White text */ + --md-code-bg-color: #121212; /* Darker background for code blocks */ + --md-code-border-color: #FF073A; /* Neon red border for code blocks */ + --md-link-color: var(--md-accent-color); +} -/* Further customization as needed */ +/* Apply background and text colors globally */ +body { + background-color: var(--md-primary-bg-color); + color: var(--md-text-color); +} +/* Headings with neon glow */ +h1, h2, h3, h4, h5, h6 { + color: var(--md-accent-color); + text-shadow: 0 0 5px var(--md-accent-color), 0 0 10px var(--md-accent-color); +} +/* Links with hover effects */ +a { + color: var(--md-link-color); + text-decoration: none; +} +a:hover { + color: var(--md-accent-color--hover); + text-shadow: 0 0 5px var(--md-accent-color--hover), 0 0 10px var(--md-accent-color--hover); +} + +/* Sidebar styling */ +.md-sidebar { + background-color: var(--md-secondary-bg-color); + border-right: 2px solid var(--md-accent-color); +} + +/* Navigation links in sidebar */ +.md-sidebar .md-nav__link { + color: var(--md-text-color); +} +.md-sidebar .md-nav__link:hover, +.md-sidebar .md-nav__link--active { + color: var(--md-accent-color); + background-color: var(--md-primary-bg-color); +} + +/* Code blocks with neon red accents */ +.md-typeset code { + background-color: var(--md-code-bg-color); + color: var(--md-text-color); + border: 1px solid var(--md-code-border-color); + border-radius: 4px; + padding: 2px 4px; + font-family: 'Fira Code', monospace; + text-shadow: 0 0 3px var(--md-code-border-color); +} + +/* Tables */ .md-typeset__table { - min-width: 100%; + min-width: 100%; + border-collapse: collapse; + background-color: var(--md-secondary-bg-color); + color: var(--md-text-color); +} +.md-typeset__table th, .md-typeset__table td { + border: 1px solid var(--md-accent-color); + padding: 8px; +} + +/* Buttons */ +button { + background-color: var(--md-accent-color); + color: var(--md-text-color); + border: none; + border-radius: 4px; + padding: 10px 15px; + cursor: pointer; + text-shadow: 0 0 5px var(--md-accent-color); +} +button:hover { + background-color: var(--md-accent-color--hover); } -.md-typeset table:not([class]) { - display: table; +/* Additional styling for search bar */ +.md-search__form { + background-color: var(--md-secondary-bg-color); + border: 1px solid var(--md-accent-color); +} +.md-search__input { + background-color: var(--md-primary-bg-color); + color: var(--md-text-color); } -/* -:root { - --md-primary-fg-color: #EE0F0F; - --md-primary-fg-color--light: #ECB7B7; - --md-primary-fg-color--dark: #90030C; - } */ \ No newline at end of file +/* Further customization */ +footer { + background-color: var(--md-secondary-bg-color); + color: var(--md-text-color); + text-align: center; + padding: 10px; + border-top: 2px solid var(--md-accent-color); +} diff --git a/docs/mkdocs.yml b/docs/mkdocs.yml index 2d8e9a2e5..b28e7a31c 100644 --- a/docs/mkdocs.yml +++ b/docs/mkdocs.yml @@ -63,12 +63,14 @@ theme: palette: - scheme: default primary: black + accent: red toggle: icon: material/brightness-7 name: Switch to dark mode # Palette toggle for dark mode - scheme: slate primary: black + accent: red toggle: icon: material/brightness-4 name: Switch to light mode