|
1 |
| -:root, |
2 |
| -[data-md-color-scheme="default"] { |
3 |
| - /* --md-primary-fg-color: #cf3f02; |
4 |
| - --md-default-fg-color: #443f3f; */ |
5 |
| - --boxShadowD: 0px 12px 24px 0px rgba(68, 63, 63, 0.08), |
6 |
| - 0px 0px 4px 0px rgba(68, 63, 63, 0.08); |
7 |
| -} |
8 |
| -body { |
9 |
| - margin: 0; |
10 |
| - padding: 0; |
11 |
| - /* font-size: 16px; */ |
12 |
| -} |
13 |
| -h1, |
14 |
| -h2, |
15 |
| -h3, |
16 |
| -h4, |
17 |
| -h5, |
18 |
| -h6 { |
19 |
| - font-family: var(--md-heading-font); |
20 |
| - font-weight: bold; |
21 |
| -} |
22 |
| -.md-typeset h1, |
23 |
| -.md-typeset h2 { |
24 |
| - font-weight: normal; |
25 |
| - color: var(--md-default-fg-color); |
26 |
| -} |
27 |
| -.md-typeset h3, |
28 |
| -.md-typeset h4 { |
29 |
| - font-weight: bold; |
30 |
| - color: var(--md-default-fg-color); |
31 |
| -} |
32 |
| -.md-button, |
33 |
| -.md-typeset .md-button { |
34 |
| - font-family: var(--md-heading-font); |
35 |
| -} |
36 |
| -.md-content .supheading { |
37 |
| - font-family: var(--md-heading-font); |
38 |
| - text-transform: uppercase; |
| 1 | +:root { |
| 2 | + --gradient-start: #e58077; |
| 3 | + --gradient-mid-1: #e57a77; |
| 4 | + --gradient-mid-2: #e46876; |
| 5 | + --gradient-mid-3: #e34b75; |
| 6 | + --gradient-mid-4: #e12374; |
| 7 | + --gradient-mid-5: #e01073; |
| 8 | + --gradient-end: #bb1085; |
| 9 | + |
| 10 | + /* Primary theme colors |
| 11 | + --md-primary-fg-color: #e34b75; |
| 12 | + --md-primary-fg-color--light: #e57a77; |
| 13 | + --md-primary-fg-color--dark: #bb1085; |
| 14 | +
|
| 15 | + /* Accent colors */ |
| 16 | + --md-accent-fg-color: #e01073; |
| 17 | + --md-accent-fg-color--transparent: rgba(224, 16, 115, 0.1); |
| 18 | + |
| 19 | + /* Text colors that work well with the palette */ |
| 20 | + --md-text-color: #333333; |
| 21 | + --md-text-color--light: #666666; |
| 22 | +} |
| 23 | + |
| 24 | +/* Dark mode color adjustments */ |
| 25 | +[data-md-color-scheme="slate"] { |
| 26 | + --md-primary-fg-color: #e57a77; |
| 27 | + --md-primary-fg-color--light: #e58077; |
| 28 | + --md-primary-fg-color--dark: #bb1085; |
| 29 | + --md-accent-fg-color: #e46876; |
| 30 | + --md-accent-fg-color--transparent: rgba(228, 104, 118, 0.1); |
| 31 | +} |
| 32 | + |
| 33 | +/* Header styling with gradient background */ |
| 34 | +.md-header { |
| 35 | + background: linear-gradient( |
| 36 | + 135deg, |
| 37 | + var(--gradient-start) 0%, |
| 38 | + var(--gradient-mid-1) 16.66%, |
| 39 | + var(--gradient-mid-2) 33.33%, |
| 40 | + var(--gradient-mid-3) 50%, |
| 41 | + var(--gradient-mid-4) 66.66%, |
| 42 | + var(--gradient-mid-5) 83.33%, |
| 43 | + var(--gradient-end) 100% |
| 44 | + ); |
| 45 | + box-shadow: 0 2px 8px rgba(187, 16, 133, 0.15); |
| 46 | +} |
| 47 | + |
| 48 | +/* Ensure header text is readable over gradient */ |
| 49 | +.md-header__title, |
| 50 | +.md-header__button, |
| 51 | +.md-header .md-icon { |
| 52 | + color: white; |
| 53 | +} |
| 54 | + |
| 55 | +/* Search box styling */ |
| 56 | +.md-search__input { |
| 57 | + background-color: rgba(255, 255, 255, 0.15); |
| 58 | + border: 1px solid rgba(255, 255, 255, 0.2); |
| 59 | + color: white; |
| 60 | +} |
| 61 | + |
| 62 | +.md-search__input::placeholder { |
| 63 | + color: rgba(255, 255, 255, 0.7); |
| 64 | +} |
| 65 | + |
| 66 | +/* Navigation tabs */ |
| 67 | +.md-tabs { |
| 68 | + background: linear-gradient( |
| 69 | + 90deg, |
| 70 | + var(--gradient-mid-3) 0%, |
| 71 | + var(--gradient-mid-4) 50%, |
| 72 | + var(--gradient-mid-5) 100% |
| 73 | + ); |
| 74 | +} |
| 75 | + |
| 76 | +.md-tabs__link { |
| 77 | + color: rgba(255, 255, 255, 0.9); |
| 78 | +} |
| 79 | + |
| 80 | +.md-tabs__link--active, |
| 81 | +.md-tabs__link:hover { |
| 82 | + color: white; |
| 83 | + opacity: 1; |
| 84 | +} |
| 85 | + |
| 86 | +/* Sidebar navigation */ |
| 87 | +.md-nav__link--active { |
| 88 | + color: var(--md-primary-fg-color); |
| 89 | + font-weight: 500; |
| 90 | +} |
| 91 | + |
| 92 | +.md-nav__link:hover { |
| 93 | + color: var(--md-accent-fg-color); |
| 94 | +} |
| 95 | + |
| 96 | +/* Code blocks */ |
| 97 | +.highlight { |
| 98 | + border-left: 4px solid var(--md-accent-fg-color); |
| 99 | + background-color: rgba(228, 104, 118, 0.05); |
| 100 | +} |
| 101 | + |
| 102 | +/* Admonitions */ |
| 103 | +.md-typeset .admonition.note { |
| 104 | + border-color: var(--md-primary-fg-color); |
| 105 | +} |
| 106 | + |
| 107 | +.md-typeset .admonition.note > .admonition-title { |
| 108 | + background-color: rgba(227, 75, 117, 0.1); |
| 109 | + border-color: var(--md-primary-fg-color); |
| 110 | +} |
| 111 | + |
| 112 | +.md-typeset .admonition.tip { |
| 113 | + border-color: var(--gradient-mid-1); |
| 114 | +} |
| 115 | + |
| 116 | +.md-typeset .admonition.tip > .admonition-title { |
| 117 | + background-color: rgba(229, 122, 119, 0.1); |
| 118 | + border-color: var(--gradient-mid-1); |
| 119 | +} |
| 120 | + |
| 121 | +.md-typeset .admonition.warning { |
| 122 | + border-color: var(--gradient-end); |
| 123 | +} |
| 124 | + |
| 125 | +.md-typeset .admonition.warning > .admonition-title { |
| 126 | + background-color: rgba(187, 16, 133, 0.1); |
| 127 | + border-color: var(--gradient-end); |
| 128 | +} |
| 129 | + |
| 130 | +/* Links */ |
| 131 | +.md-content a { |
| 132 | + color: var(--md-accent-fg-color); |
| 133 | +} |
| 134 | + |
| 135 | +.md-content a:hover { |
| 136 | + color: var(--gradient-end); |
| 137 | +} |
| 138 | + |
| 139 | +/* Table of contents */ |
| 140 | +.md-nav--secondary .md-nav__link--active { |
| 141 | + color: var(--md-accent-fg-color); |
| 142 | + border-left: 2px solid var(--md-accent-fg-color); |
| 143 | + padding-left: calc(1rem - 2px); |
| 144 | +} |
| 145 | + |
| 146 | +/* Footer */ |
| 147 | +.md-footer { |
| 148 | + background-color: var(--gradient-end); |
| 149 | +} |
| 150 | + |
| 151 | +/* Buttons and interactive elements */ |
| 152 | +.md-button { |
| 153 | + background: linear-gradient(135deg, var(--md-primary-fg-color), var(--md-accent-fg-color)); |
| 154 | + border: none; |
| 155 | + color: white; |
| 156 | + transition: all 0.3s ease; |
| 157 | +} |
| 158 | + |
| 159 | +.md-button:hover { |
| 160 | + transform: translateY(-2px); |
| 161 | + box-shadow: 0 4px 12px rgba(187, 16, 133, 0.3); |
| 162 | +} |
| 163 | + |
| 164 | +/* Scrollbar styling */ |
| 165 | +::-webkit-scrollbar { |
| 166 | + width: 8px; |
| 167 | +} |
| 168 | + |
| 169 | +::-webkit-scrollbar-track { |
| 170 | + background: rgba(187, 16, 133, 0.1); |
| 171 | +} |
| 172 | + |
| 173 | +::-webkit-scrollbar-thumb { |
| 174 | + background: linear-gradient( |
| 175 | + 180deg, |
| 176 | + var(--md-primary-fg-color), |
| 177 | + var(--md-accent-fg-color) |
| 178 | + ); |
| 179 | + border-radius: 4px; |
| 180 | +} |
| 181 | + |
| 182 | +::-webkit-scrollbar-thumb:hover { |
| 183 | + background: linear-gradient( |
| 184 | + 180deg, |
| 185 | + var(--md-accent-fg-color), |
| 186 | + var(--gradient-end) |
| 187 | + ); |
| 188 | +} |
| 189 | + |
| 190 | +/* Search results highlighting */ |
| 191 | +.md-search-result__title { |
39 | 192 | color: var(--md-primary-fg-color);
|
40 |
| - font-size: 0.75rem; |
41 |
| - font-weight: bold; |
| 193 | +} |
| 194 | + |
| 195 | +.md-search-result__teaser mark { |
| 196 | + background-color: rgba(224, 16, 115, 0.2); |
| 197 | + color: var(--gradient-end); |
42 | 198 | }
|
43 | 199 |
|
44 | 200 | .md-header__button.md-logo img,
|
45 | 201 | .md-header__button.md-logo svg {
|
46 |
| - height: 2rem; |
47 |
| - width: auto; |
| 202 | + height: 42px !important; /* Increase from default ~24px */ |
| 203 | + width: auto !important; |
| 204 | + max-height: none !important; |
| 205 | + padding: 0 0 0 16px !important; /* Keep left padding, remove others */ |
| 206 | + margin: 0 !important; /* Remove any margin */ |
48 | 207 | }
|
49 | 208 |
|
50 |
| -.md-header { |
51 |
| - padding: 0.2rem 0; |
| 209 | +/* Also remove padding from the logo button container except left */ |
| 210 | +.md-header__button.md-logo { |
| 211 | + padding: 0 0 0 8px !important; /* Keep some left padding on container */ |
| 212 | + margin: 0 !important; |
| 213 | + min-width: auto !important; |
52 | 214 | }
|
0 commit comments