| @@ -25,8 +25,11 @@ | ||
| 25 | 25 | |
| 26 | 26 | /* Sets color for yellow elements. */ |
| 27 | 27 | --yellow-color: #B58105; |
| 28 | 28 | |
| 29 | + /* Sets color for orange elements. */ | |
| 30 | + --orange-color: #c47335; | |
| 31 | + | |
| 29 | 32 | /* Sets color for red elements. */ |
| 30 | 33 | --red-color: #a00000; |
| 31 | 34 | |
| 32 | 35 | /* Sets color for blue elements. */ |
| @@ -32,18 +35,18 @@ | ||
| 32 | 35 | /* Sets color for blue elements. */ |
| 33 | 36 | --blue-color: #276F86; |
| 34 | 37 | |
| 35 | 38 | /* Sets main text color. */ |
| 36 | - --font-color: rgba( 255, 255, 255, .9 ); | |
| 39 | + --font-color: rgba(255, 255, 255, .9); | |
| 37 | 40 | |
| 38 | 41 | /* Sets text color, lighter version. */ |
| 39 | - --font-light-color: rgba( 255, 255, 255, .7 ); | |
| 42 | + --font-light-color: rgba(255, 255, 255, .7); | |
| 40 | 43 | |
| 41 | 44 | /* Sets button text color. */ |
| 42 | - --font-button-color: rgba( 255, 255, 255, 1 ); | |
| 45 | + --font-button-color: rgba(255, 255, 255, 1); | |
| 43 | 46 | |
| 44 | 47 | /* Sets section element and table borders. */ |
| 45 | - --border-color: rgba( 255, 255, 255, .1 ); | |
| 48 | + --border-color: rgba(255, 255, 255, .1); | |
| 46 | 49 | } |
| 47 | 50 | |
| 48 | 51 | /* Fix Colors */ |
| 49 | 52 | |
| @@ -54,12 +57,14 @@ | ||
| 54 | 57 | |
| 55 | 58 | .mainwp-ui.mainwp-custom-theme i.green.icon:not(.inverted) { |
| 56 | 59 | color: var(--green-color) !important; |
| 57 | 60 | } |
| 61 | + | |
| 58 | 62 | .mainwp-ui.mainwp-custom-theme .ui.green.label:not(.basic) { |
| 59 | 63 | color: var(--font-button-color) !important; |
| 60 | 64 | background-color: var(--green-color) !important; |
| 61 | 65 | } |
| 66 | + | |
| 62 | 67 | .mainwp-ui.mainwp-custom-theme .ui.green.label.basic { |
| 63 | 68 | color: var(--green-color) !important; |
| 64 | 69 | border-color: var(--green-color) !important; |
| 65 | 70 | } |
| @@ -66,8 +71,9 @@ | ||
| 66 | 71 | |
| 67 | 72 | .mainwp-ui.mainwp-custom-theme i.red.icon:not(.inverted) { |
| 68 | 73 | color: var(--red-color) !important; |
| 69 | 74 | } |
| 75 | + | |
| 70 | 76 | .mainwp-ui.mainwp-custom-theme .ui.red.label:not(.basic) { |
| 71 | 77 | color: var(--font-button-color) !important; |
| 72 | 78 | background-color: var(--red-color) !important; |
| 73 | 79 | } |
| @@ -78,8 +84,9 @@ | ||
| 78 | 84 | |
| 79 | 85 | .mainwp-ui.mainwp-custom-theme i.yellow.icon:not(.inverted) { |
| 80 | 86 | color: var(--yellow-color) !important; |
| 81 | 87 | } |
| 88 | + | |
| 82 | 89 | .mainwp-ui.mainwp-custom-theme .ui.yellow.label:not(.basic) { |
| 83 | 90 | color: var(--font-button-color) !important; |
| 84 | 91 | background-color: var(--yellow-color) !important; |
| 85 | 92 | } |
| @@ -86,8 +93,9 @@ | ||
| 86 | 93 | |
| 87 | 94 | .mainwp-ui.mainwp-custom-theme i.blue.icon:not(.inverted) { |
| 88 | 95 | color: var(--blue-color) !important; |
| 89 | 96 | } |
| 97 | + | |
| 90 | 98 | .mainwp-ui.mainwp-custom-theme .ui.blue.label:not(.basic) { |
| 91 | 99 | color: var(--font-button-color) !important; |
| 92 | 100 | background-color: var(--blue-color) !important; |
| 93 | 101 | } |
| @@ -95,16 +103,19 @@ | ||
| 95 | 103 | .mainwp-ui.mainwp-custom-theme i.green.icon.inverted { |
| 96 | 104 | color: var(--font-button-color) !important; |
| 97 | 105 | background-color: var(--green-color) !important; |
| 98 | 106 | } |
| 107 | + | |
| 99 | 108 | .mainwp-ui.mainwp-custom-theme i.red.icon.inverted { |
| 100 | 109 | color: var(--font-button-color) !important; |
| 101 | 110 | background-color: var(--red-color) !important; |
| 102 | 111 | } |
| 112 | + | |
| 103 | 113 | .mainwp-ui.mainwp-custom-theme i.yellow.icon.inverted { |
| 104 | 114 | color: var(--font-button-color) !important; |
| 105 | 115 | background-color: var(--yellow-color) !important; |
| 106 | 116 | } |
| 117 | + | |
| 107 | 118 | .mainwp-ui.mainwp-custom-theme i.blue.icon.inverted { |
| 108 | 119 | color: var(--font-button-color) !important; |
| 109 | 120 | background-color: var(--blue-color) !important; |
| 110 | 121 | } |
| @@ -109,48 +120,56 @@ | ||
| 109 | 120 | background-color: var(--blue-color) !important; |
| 110 | 121 | } |
| 111 | 122 | |
| 112 | 123 | .mainwp-ui.mainwp-custom-theme .ui.indeterminate.green.progress .bar::before, |
| 113 | -.mainwp-ui.mainwp-custom-theme .ui.green.progress .bar, .ui.progress .green.bar { | |
| 124 | +.mainwp-ui.mainwp-custom-theme .ui.green.progress .bar, | |
| 125 | +.ui.progress .green.bar { | |
| 114 | 126 | background-color: var(--green-color) !important; |
| 115 | 127 | } |
| 116 | 128 | |
| 117 | 129 | /* Invert Segments */ |
| 118 | 130 | |
| 119 | -body.mainwp-ui.mainwp-custom-theme.pushable > .pusher, | |
| 131 | +body.mainwp-ui.mainwp-custom-theme.pushable>.pusher, | |
| 120 | 132 | body.mainwp-ui.mainwp-custom-theme, |
| 121 | 133 | .mainwp-ui.mainwp-custom-theme #wpbody-content, |
| 122 | 134 | .mainwp-ui.mainwp-custom-theme .mainwp-content-wrap, |
| 123 | -.mainwp-ui.mainwp-custom-theme .ui.segment { | |
| 135 | +.mainwp-ui.mainwp-custom-theme .ui.segment { | |
| 124 | 136 | background-color: var(--background-color-2) !important; |
| 125 | 137 | color: var(--font-color); |
| 126 | 138 | } |
| 127 | 139 | |
| 128 | 140 | .mainwp-ui.mainwp-custom-theme #mainwp-top-header { |
| 129 | - background: var(--background-color-1); | |
| 130 | - color: var(--font-color); | |
| 141 | + background: var(--background-color-1) !important; | |
| 142 | + color: var(--font-color) !important; | |
| 131 | 143 | border: 0px solid var(--border-color) !important; |
| 132 | 144 | } |
| 133 | - | |
| 145 | +.mainwp-ui.mainwp-custom-theme #mainwp-top-header .ui.icon.button:not(.red, .green) { | |
| 146 | + background: var(--background-color-3) !important; | |
| 147 | + -webkit-box-shadow: inset 2px 0px 0px 1px var(--background-color-4) !important; | |
| 148 | + -moz-box-shadow: inset 0px 0px 0px 1px var(--background-color-4) !important; | |
| 149 | + box-shadow: inset 0px 0px 0px 1px var(--background-color-4) !important; | |
| 150 | + color: var(--grey-light-alt) !important; | |
| 151 | +} | |
| 134 | 152 | .mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper { |
| 135 | - background-color: var( --background-color-3 ); | |
| 153 | + background-color: var(--background-color-3); | |
| 136 | 154 | padding: 0 !important; |
| 137 | - box-shadow: 0 1px 2px 0 rgba( 0, 0, 0, .1 ) !important; | |
| 138 | - border-top: 0px solid var( --border-color ) !important; | |
| 139 | - border-bottom: 1px solid var( --border-color ) !important; | |
| 140 | - border-left: 1px solid var( --border-color ) !important; | |
| 141 | - border-right: 1px solid var( --border-color ) !important; | |
| 142 | - } | |
| 155 | + box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1) !important; | |
| 156 | + border-top: 0px solid var(--border-color) !important; | |
| 157 | + border-bottom: 1px solid var(--border-color) !important; | |
| 158 | + border-left: 0px solid var(--border-color) !important; | |
| 159 | + border-right: 1px solid var(--border-color) !important; | |
| 160 | +} | |
| 143 | 161 | |
| 144 | 162 | .mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper .menu { |
| 145 | 163 | margin-bottom: 0px !important; |
| 146 | - border-top: 1px solid var( --border-color ) !important; | |
| 147 | - border-bottom: 0px solid var( --border-color ) !important; | |
| 148 | - border-left: 1px solid var( --border-color ) !important; | |
| 149 | - border-right: 1px solid var( --border-color ) !important; | |
| 164 | + border-top: 0px solid var(--border-color) !important; | |
| 165 | + border-bottom: 0px solid var(--border-color) !important; | |
| 166 | + border-left: 0px solid var(--border-color) !important; | |
| 167 | + border-right: 1px solid var(--border-color) !important; | |
| 150 | 168 | color: var(--font-color); |
| 151 | - background-color: var( --background-color-3 ); | |
| 169 | + background-color: var(--background-color-3); | |
| 152 | 170 | } |
| 171 | + | |
| 153 | 172 | .mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper .menu .item { |
| 154 | 173 | padding: 21px; |
| 155 | 174 | color: var(--font-color); |
| 156 | 175 | } |
| @@ -156,9 +175,9 @@ | ||
| 156 | 175 | } |
| 157 | 176 | |
| 158 | 177 | .mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper .menu .item.active, |
| 159 | 178 | .mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper .menu .item:hover { |
| 160 | - background-color: var( --background-color-2 ); | |
| 179 | + background-color: var(--background-color-2); | |
| 161 | 180 | color: var(--accent-color); |
| 162 | 181 | } |
| 163 | 182 | |
| 164 | 183 | |
| @@ -163,9 +182,9 @@ | ||
| 163 | 182 | |
| 164 | 183 | |
| 165 | 184 | .mainwp-ui.mainwp-custom-theme .mainwp-actions-bar, |
| 166 | 185 | .mainwp-ui.mainwp-custom-theme .mainwp-sub-header { |
| 167 | - border-bottom: 1px solid var(--border-color); | |
| 186 | + border-bottom: 1px solid var(--border-color) !important; | |
| 168 | 187 | background: var(--background-color-2); |
| 169 | 188 | } |
| 170 | 189 | |
| 171 | 190 | .mainwp-ui.mainwp-custom-theme .mainwp-side-content, |
| @@ -176,8 +195,18 @@ | ||
| 176 | 195 | .mainwp-ui.mainwp-custom-theme #mainwp-sites-menu-sidebar .mainwp-site-menu-item .title { |
| 177 | 196 | color: var(--font-color) !important; |
| 178 | 197 | } |
| 179 | 198 | |
| 199 | +/* Flyout */ | |
| 200 | +.mainwp-ui.mainwp-custom-theme .ui.flyout { | |
| 201 | + background-color: var(--background-color-3) !important; | |
| 202 | +} | |
| 203 | +.mainwp-ui.mainwp-custom-theme .ui.flyout .content, | |
| 204 | +.mainwp-ui.mainwp-custom-theme .ui.flyout .actions, | |
| 205 | +.mainwp-ui.mainwp-custom-theme .ui.flyout .header { | |
| 206 | + background-color: var(--background-color-3) !important; | |
| 207 | +} | |
| 208 | + | |
| 180 | 209 | /* Headers */ |
| 181 | 210 | |
| 182 | 211 | .mainwp-ui.mainwp-custom-theme h2, |
| 183 | 212 | .mainwp-ui.mainwp-custom-theme h2.header { |
| @@ -182,12 +211,14 @@ | ||
| 182 | 211 | .mainwp-ui.mainwp-custom-theme h2, |
| 183 | 212 | .mainwp-ui.mainwp-custom-theme h2.header { |
| 184 | 213 | color: var(--font-color); |
| 185 | 214 | } |
| 215 | + | |
| 186 | 216 | .mainwp-ui.mainwp-custom-theme h3, |
| 187 | 217 | .mainwp-ui.mainwp-custom-theme h3.header { |
| 188 | 218 | color: var(--font-color); |
| 189 | 219 | } |
| 220 | + | |
| 190 | 221 | .mainwp-ui.mainwp-custom-theme h4, |
| 191 | 222 | .mainwp-ui.mainwp-custom-theme h4.header { |
| 192 | 223 | color: var(--font-color); |
| 193 | 224 | } |
| @@ -193,17 +224,17 @@ | ||
| 193 | 224 | } |
| 194 | 225 | |
| 195 | 226 | /* Invert Side Bar */ |
| 196 | 227 | |
| 197 | -.mainwp-ui.mainwp-custom-theme #mainwp-select-sites-header .ui.menu { | |
| 228 | +.mainwp-ui.mainwp-custom-theme .mainwp-select-sites-header .ui.menu { | |
| 198 | 229 | border-color: var(--border-color); |
| 199 | 230 | } |
| 200 | 231 | |
| 201 | -.mainwp-ui.mainwp-custom-theme #mainwp-select-sites-header .ui.menu a.item { | |
| 232 | +.mainwp-ui.mainwp-custom-theme .mainwp-select-sites-header .ui.menu a.item { | |
| 202 | 233 | color: var(--font-color); |
| 203 | 234 | } |
| 204 | 235 | |
| 205 | -.mainwp-ui.mainwp-custom-theme #mainwp-select-sites-header .ui.menu a.item.active { | |
| 236 | +.mainwp-ui.mainwp-custom-theme .mainwp-select-sites-header .ui.menu a.item.active { | |
| 206 | 237 | color: var(--accent-color); |
| 207 | 238 | } |
| 208 | 239 | |
| 209 | 240 | .mainwp-ui.mainwp-custom-theme #mainwp-select-sites .ui.divided.list .item { |
| @@ -228,9 +259,9 @@ | ||
| 228 | 259 | .mainwp-ui.mainwp-custom-theme #mainwp-select-sites .ui.divided.list .item label { |
| 229 | 260 | color: var(--font-color) !important; |
| 230 | 261 | } |
| 231 | 262 | |
| 232 | -.mainwp-ui.mainwp-custom-theme #mainwp-select-sites-select-all-actions { | |
| 263 | +.mainwp-ui.mainwp-custom-theme .mainwp-select-sites-select-all-actions { | |
| 233 | 264 | background-color: var(--border-color); |
| 234 | 265 | border-color: var(--border-color); |
| 235 | 266 | } |
| 236 | 267 | |
| @@ -292,9 +323,9 @@ | ||
| 292 | 323 | border-color: var(--border-color); |
| 293 | 324 | color: var(--font-color); |
| 294 | 325 | } |
| 295 | 326 | |
| 296 | -.mainwp-ui.mainwp-custom-theme .ui.definition.table > thead > tr > th:first-child { | |
| 327 | +.mainwp-ui.mainwp-custom-theme .ui.definition.table>thead>tr>th:first-child { | |
| 297 | 328 | background-color: var(--background-color-3); |
| 298 | 329 | border-color: var(--border-color); |
| 299 | 330 | color: var(--font-color); |
| 300 | 331 | box-shadow: none !important; |
| @@ -303,28 +334,17 @@ | ||
| 303 | 334 | .mainwp-ui.mainwp-custom-theme .ui.table tr td { |
| 304 | 335 | border-color: var(--border-color); |
| 305 | 336 | } |
| 306 | 337 | |
| 307 | -.mainwp-ui table.dataTable tbody tr > .dtfc-fixed-left, | |
| 308 | -.mainwp-ui table.dataTable tbody tr > .dtfc-fixed-right { | |
| 309 | - background-color: var( --table-background-color ) !important; | |
| 338 | +.mainwp-ui table.dataTable tbody tr>.dtfc-fixed-left, | |
| 339 | +.mainwp-ui table.dataTable tbody tr>.dtfc-fixed-right { | |
| 340 | + background-color: var(--table-background-color) !important; | |
| 310 | 341 | } |
| 311 | 342 | |
| 312 | -.mainwp-ui.mainwp-custom-theme .ui.definition.table > tbody > tr > td:first-child:not(.ignored) { | |
| 343 | +.mainwp-ui.mainwp-custom-theme .ui.definition.table>tbody>tr>td:first-child:not(.ignored) { | |
| 313 | 344 | color: var(--font-color); |
| 314 | 345 | } |
| 315 | 346 | |
| 316 | -.mainwp-ui.mainwp-custom-theme .ui.pagination.menu { | |
| 317 | - background-color: var(--background-color-3); | |
| 318 | - border-color: var(--border-color); | |
| 319 | -} | |
| 320 | - | |
| 321 | -.mainwp-ui.mainwp-custom-theme .ui.pagination.menu .item { | |
| 322 | - background-color: var(--background-color-3); | |
| 323 | - border-color: var(--border-color); | |
| 324 | - color: var(--font-color); | |
| 325 | -} | |
| 326 | - | |
| 327 | 347 | .mainwp-ui.mainwp-custom-theme .ui.table tr.hoverli { |
| 328 | 348 | background-color: var(--background-color-4) !important; |
| 329 | 349 | } |
| 330 | 350 | |
| @@ -342,9 +362,9 @@ | ||
| 342 | 362 | color: var(--font-light-color); |
| 343 | 363 | } |
| 344 | 364 | |
| 345 | 365 | .mainwp-ui.mainwp-custom-theme .alternate, |
| 346 | -.mainwp-ui.mainwp-custom-theme .striped > tbody > :nth-child(2n+1) { | |
| 366 | +.mainwp-ui.mainwp-custom-theme .striped>tbody> :nth-child(2n+1) { | |
| 347 | 367 | background-color: var(--background-color-3); |
| 348 | 368 | } |
| 349 | 369 | |
| 350 | 370 | .mainwp-ui.mainwp-custom-theme #mainwp-manage-themes-table tbody tr td:first-child, |
| @@ -354,9 +374,9 @@ | ||
| 354 | 374 | |
| 355 | 375 | .mainwp-ui.mainwp-custom-theme .ui.table tbody tr.positive, |
| 356 | 376 | .mainwp-ui.mainwp-custom-theme #mainwp-manage-themes-table tbody tr td.positive, |
| 357 | 377 | .mainwp-ui.mainwp-custom-theme #mainwp-manage-plugins-table tbody tr td.positive { |
| 358 | - background-color: rgba(127, 177, 0,.1) !important; | |
| 378 | + background-color: rgba(127, 177, 0, .1) !important; | |
| 359 | 379 | color: var(--font-color) !important; |
| 360 | 380 | } |
| 361 | 381 | |
| 362 | 382 | .mainwp-ui.mainwp-custom-theme .ui.table tbody tr.error, |
| @@ -370,9 +390,9 @@ | ||
| 370 | 390 | |
| 371 | 391 | .mainwp-ui.mainwp-custom-theme .ui.table tbody tr.warning, |
| 372 | 392 | .mainwp-ui.mainwp-custom-theme #mainwp-manage-themes-table tbody tr td.warning, |
| 373 | 393 | .mainwp-ui.mainwp-custom-theme #mainwp-manage-plugins-table tbody tr td.warning { |
| 374 | - background-color: rgba( 181, 129, 5, .1 ) !important; | |
| 394 | + background-color: rgba(181, 129, 5, .1) !important; | |
| 375 | 395 | color: var(--font-color) !important; |
| 376 | 396 | } |
| 377 | 397 | |
| 378 | 398 | .mainwp-ui.mainwp-custom-theme #mainwp-manage-updates table tr.active, |
| @@ -383,8 +403,10 @@ | ||
| 383 | 403 | .mainwp-ui.mainwp-custom-theme #mainwp-manage-updates table tr.content.active { |
| 384 | 404 | background: var(--background-color-3) !important; |
| 385 | 405 | } |
| 386 | 406 | |
| 407 | +.mainwp-ui.mainwp-custom-theme #mainwp-db-plugins-updates-table tr.active table tfoot tr th, | |
| 408 | +.mainwp-ui.mainwp-custom-theme #mainwp-db-plugins-updates-table tr.active table thead tr th, | |
| 387 | 409 | .mainwp-ui.mainwp-custom-theme #mainwp-manage-updates table tr.content.active table tfoot tr th, |
| 388 | 410 | .mainwp-ui.mainwp-custom-theme #mainwp-manage-updates table tr.content.active table thead tr th { |
| 389 | 411 | background: var(--background-color-2) !important; |
| 390 | 412 | color: var(--font-color) !important; |
| @@ -389,8 +411,9 @@ | ||
| 389 | 411 | background: var(--background-color-2) !important; |
| 390 | 412 | color: var(--font-color) !important; |
| 391 | 413 | } |
| 392 | 414 | |
| 415 | +.mainwp-ui.mainwp-custom-theme #mainwp-db-plugins-updates-table tr.active table tbody tr td, | |
| 393 | 416 | .mainwp-ui.mainwp-custom-theme #mainwp-manage-updates table tr.content.active table tbody tr td { |
| 394 | 417 | background: var(--background-color-2) !important; |
| 395 | 418 | color: var(--font-color) !important; |
| 396 | 419 | } |
| @@ -401,14 +424,26 @@ | ||
| 401 | 424 | } |
| 402 | 425 | |
| 403 | 426 | .mainwp-ui.mainwp-custom-theme #mainwp-plugins-content .mainwp-manage-plugin-item-website, |
| 404 | 427 | .mainwp-ui.mainwp-custom-theme #mainwp-themes-content .mainwp-manage-theme-item-website { |
| 405 | - background: var( --background-color-3 ) !important; | |
| 406 | - color: var( --font-color ) !important; | |
| 428 | + background: var(--background-color-3) !important; | |
| 429 | + color: var(--font-color) !important; | |
| 407 | 430 | border-bottom: 1px solid var(--border-color) !important; |
| 408 | 431 | border-top: 1px solid var(--border-color) !important; |
| 409 | 432 | } |
| 410 | 433 | |
| 434 | +.mainwp-ui.mainwp-custom-theme table.dataTable.table > tbody > tr.selected > * { | |
| 435 | + color: var(--font-color); | |
| 436 | +} | |
| 437 | + | |
| 438 | +.mainwp-ui.mainwp-custom-theme table.dataTable tr th:first-child,table.dataTable tr td:first-child { | |
| 439 | + border-left: none !important; | |
| 440 | +} | |
| 441 | + | |
| 442 | +.mainwp-ui.mainwp-custom-theme table.dataTable tr th:last-child,table.dataTable tr td:last-child { | |
| 443 | + border-right: none !important; | |
| 444 | +} | |
| 445 | + | |
| 411 | 446 | /* Invert Form Fields */ |
| 412 | 447 | |
| 413 | 448 | .mainwp-ui.mainwp-custom-theme .ui.tab textarea, |
| 414 | 449 | .mainwp-ui.mainwp-custom-theme .ui.form textarea { |
| @@ -416,9 +451,9 @@ | ||
| 416 | 451 | border-color: var(--border-color); |
| 417 | 452 | color: var(--font-color); |
| 418 | 453 | } |
| 419 | 454 | |
| 420 | -.mainwp-ui.mainwp-custom-theme .ui.input > input { | |
| 455 | +.mainwp-ui.mainwp-custom-theme .ui.input>input { | |
| 421 | 456 | background-color: var(--background-color-4); |
| 422 | 457 | border-color: var(--border-color); |
| 423 | 458 | color: var(--font-color); |
| 424 | 459 | } |
| @@ -435,8 +470,10 @@ | ||
| 435 | 470 | color: var(--font-color); |
| 436 | 471 | border-color: var(--border-color); |
| 437 | 472 | } |
| 438 | 473 | |
| 474 | + | |
| 475 | + | |
| 439 | 476 | .mainwp-ui.mainwp-custom-theme .ui.form input:focus, |
| 440 | 477 | .mainwp-ui.mainwp-custom-theme .ui.form select:focus, |
| 441 | 478 | .mainwp-ui.mainwp-custom-theme .ui.dropdown.selection:focus { |
| 442 | 479 | background-color: var(--background-color-4); |
| @@ -472,54 +509,62 @@ | ||
| 472 | 509 | color: var(--font-color); |
| 473 | 510 | background: var(--background-color-4); |
| 474 | 511 | } |
| 475 | 512 | |
| 476 | -.mainwp-ui.mainwp-custom-theme .ui.checkbox input ~ label, | |
| 477 | -.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox input ~ label { | |
| 513 | +.mainwp-ui.mainwp-custom-theme .ui.checkbox input~label, | |
| 514 | +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox input~label { | |
| 478 | 515 | color: var(--font-color) !important; |
| 479 | 516 | } |
| 480 | 517 | |
| 481 | -.mainwp-ui.mainwp-custom-theme .ui.checkbox.checked input ~ label, | |
| 482 | -.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox.checked input ~ label { | |
| 518 | +.mainwp-ui.mainwp-custom-theme .ui.checkbox.checked input~label, | |
| 519 | +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox.checked input~label { | |
| 483 | 520 | color: var(--font-color) !important; |
| 484 | 521 | } |
| 485 | 522 | |
| 486 | -.mainwp-ui.mainwp-custom-theme .ui.checkbox input ~ label::before, | |
| 487 | -.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox input ~ label::before { | |
| 523 | +.mainwp-ui.mainwp-custom-theme .ui.checkbox input~label::before, | |
| 524 | +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox input~label::before { | |
| 488 | 525 | background: var(--background-color-4) !important; |
| 489 | 526 | color: var(--font-color) !important; |
| 490 | 527 | border-color: var(--border-color); |
| 491 | 528 | } |
| 492 | 529 | |
| 493 | -.mainwp-ui.mainwp-custom-theme .ui.checkbox.checked input ~ label::before, | |
| 494 | -.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox.checked input ~ label::before { | |
| 530 | +.mainwp-ui.mainwp-custom-theme .ui.checkbox.checked input~label::before, | |
| 531 | +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox.checked input~label::before { | |
| 495 | 532 | background: var(--accent-color) !important; |
| 496 | 533 | } |
| 497 | 534 | |
| 498 | -.mainwp-ui.mainwp-custom-theme .ui.checkbox input ~ label::after, | |
| 499 | -.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox input ~ label::after { | |
| 535 | +.mainwp-ui.mainwp-custom-theme .ui.checkbox input~label::after, | |
| 536 | +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox input~label::after { | |
| 500 | 537 | color: var(--font-color) !important; |
| 501 | 538 | } |
| 502 | 539 | |
| 503 | -.mainwp-ui.mainwp-custom-theme .ui.checkbox.checked input ~ label::after, | |
| 504 | -.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox.checked input ~ label::after { | |
| 540 | +.mainwp-ui.mainwp-custom-theme .ui.checkbox.checked input~label::after, | |
| 541 | +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox.checked input~label::after { | |
| 505 | 542 | color: var(--background-color-2) !important; |
| 506 | 543 | } |
| 507 | 544 | |
| 508 | -.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox input ~ label::after { | |
| 545 | +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox input~label::after { | |
| 509 | 546 | background-color: var(--font-color) !important; |
| 510 | 547 | } |
| 511 | 548 | |
| 512 | -.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox.checked input ~ label::after { | |
| 549 | +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox.checked input~label::after { | |
| 513 | 550 | background-color: var(--background-color-2) !important; |
| 514 | 551 | } |
| 515 | 552 | |
| 516 | -.mainwp-ui.mainwp-custom-theme .ui.field input.labelauty + label { | |
| 553 | +.mainwp-ui.mainwp-custom-theme .ui.field input.labelauty+label { | |
| 517 | 554 | background-color: var(--background-color-2) !important; |
| 518 | 555 | } |
| 519 | 556 | |
| 557 | +.mainwp-ui.mainwp-custom-theme .mainwp-managesites-import-rows:nth-of-type(odd) { | |
| 558 | + background-color: rgba(255, 255, 255, .06) !important; | |
| 559 | +} | |
| 560 | + | |
| 520 | 561 | /* Invert Messages */ |
| 521 | 562 | |
| 563 | +.mainwp-ui.mainwp-custom-theme .ui.message .header { | |
| 564 | + color: var(--font-color); | |
| 565 | +} | |
| 566 | + | |
| 522 | 567 | .mainwp-ui.mainwp-custom-theme .ui.message { |
| 523 | 568 | color: var(--font-color); |
| 524 | 569 | background-color: var(--background-color-4); |
| 525 | 570 | box-shadow: none; |
| @@ -586,12 +631,44 @@ | ||
| 586 | 631 | border-top: 1px solid var(--border-color) !important; |
| 587 | 632 | color: var(--font-color); |
| 588 | 633 | } |
| 589 | 634 | |
| 635 | +.mainwp-ui.mainwp-custom-theme .ui.cards .card .extra a:not(.ui) { | |
| 636 | + color: var(--accent-color); | |
| 637 | +} | |
| 638 | + | |
| 639 | +/* Invert Steps */ | |
| 640 | + | |
| 641 | +.mainwp-ui.mainwp-custom-theme .ui.steps .step { | |
| 642 | + background-color: var(--background-color-3) !important; | |
| 643 | +} | |
| 644 | + | |
| 645 | +.mainwp-ui.mainwp-custom-theme .ui.steps .step .description { | |
| 646 | + color: var(--font-color) !important; | |
| 647 | +} | |
| 648 | + | |
| 649 | +/* Invert Feed */ | |
| 650 | + | |
| 651 | +.mainwp-ui.mainwp-custom-theme .ui.feed .summary { | |
| 652 | + color: var(--font-color) !important; | |
| 653 | +} | |
| 654 | + | |
| 655 | +.mainwp-ui.mainwp-custom-theme .ui.feed .summary .date { | |
| 656 | + color: var(--font-light-color) !important; | |
| 657 | +} | |
| 658 | + | |
| 590 | 659 | /* Invert Modal */ |
| 591 | 660 | |
| 592 | -.mainwp-ui.mainwp-custom-theme .ui.modal > .header, | |
| 593 | -.mainwp-ui.mainwp-custom-theme .ui.modal > .actions { | |
| 661 | +.mainwp-ui.mainwp-custom-theme .ui.modal i.icon.close { | |
| 662 | + top: 0.8em; | |
| 663 | + right: 0.8em; | |
| 664 | + color: #ffffff; | |
| 665 | + opacity: 1 !important; | |
| 666 | + text-shadow: none !important; | |
| 667 | +} | |
| 668 | + | |
| 669 | +.mainwp-ui.mainwp-custom-theme .ui.modal>.header, | |
| 670 | +.mainwp-ui.mainwp-custom-theme .ui.modal>.actions { | |
| 594 | 671 | background: var(--background-color-3); |
| 595 | 672 | border-color: var(--border-color); |
| 596 | 673 | color: var(--font-color); |
| 597 | 674 | } |
| @@ -596,9 +673,9 @@ | ||
| 596 | 673 | color: var(--font-color); |
| 597 | 674 | } |
| 598 | 675 | |
| 599 | 676 | .mainwp-ui.mainwp-custom-theme .ui.modal, |
| 600 | -.mainwp-ui.mainwp-custom-theme .ui.modal > .content { | |
| 677 | +.mainwp-ui.mainwp-custom-theme .ui.modal>.content { | |
| 601 | 678 | background: var(--background-color-2); |
| 602 | 679 | border-color: var(--border-color); |
| 603 | 680 | color: var(--font-color); |
| 604 | 681 | } |
| @@ -639,9 +716,9 @@ | ||
| 639 | 716 | .mainwp-ui.mainwp-custom-theme .icon { |
| 640 | 717 | color: var(--font-color); |
| 641 | 718 | } |
| 642 | 719 | |
| 643 | -.mainwp-ui.mainwp-custom-theme a:not( .button ) .icon:not( .green, .red ) { | |
| 720 | +.mainwp-ui.mainwp-custom-theme a:not(.button) .icon:not(.green, .red) { | |
| 644 | 721 | color: var(--accent-color); |
| 645 | 722 | } |
| 646 | 723 | |
| 647 | 724 | .mainwp-ui.mainwp-custom-theme .ui.button:not(.green), |
| @@ -658,9 +735,9 @@ | ||
| 658 | 735 | .mainwp-ui.mainwp-custom-theme .ui.button[disabled], |
| 659 | 736 | .mainwp-ui.mainwp-custom-theme .ui.button.disabled { |
| 660 | 737 | background-color: var(--table-background-color) !important; |
| 661 | 738 | border: none !important; |
| 662 | - color: rgba( 255,255,255,.3 ); | |
| 739 | + color: rgba(255, 255, 255, .3); | |
| 663 | 740 | box-shadow: none !important; |
| 664 | 741 | -webkit-box-shadow: none !important; |
| 665 | 742 | } |
| 666 | 743 | |
| @@ -685,8 +762,16 @@ | ||
| 685 | 762 | .mainwp-ui.mainwp-custom-theme .ui.button.red { |
| 686 | 763 | background-color: var(--red-color); |
| 687 | 764 | } |
| 688 | 765 | |
| 766 | +.mainwp-ui.mainwp-custom-theme .ui.button.yellow { | |
| 767 | + background-color: var(--yellow-color); | |
| 768 | +} | |
| 769 | + | |
| 770 | +.mainwp-ui.mainwp-custom-theme .ui.button.orange { | |
| 771 | + background-color: var(--orange-color); | |
| 772 | +} | |
| 773 | + | |
| 689 | 774 | .mainwp-ui.mainwp-custom-theme .ui.button.green.basic .icon { |
| 690 | 775 | color: var(--accent-color); |
| 691 | 776 | } |
| 692 | 777 | |
| @@ -693,17 +778,31 @@ | ||
| 693 | 778 | .mainwp-ui.mainwp-custom-theme .mainwp-nav-wrap .icon { |
| 694 | 779 | color: var(--font-color) !important; |
| 695 | 780 | } |
| 696 | 781 | |
| 697 | -/* Invert Dimmer */ | |
| 698 | 782 | |
| 783 | +.mainwp-ui.mainwp-custom-theme button.mainwp-sites-select-select-button, | |
| 784 | +.mainwp-ui.mainwp-custom-theme button.mainwp-sites-select-deselect-button { | |
| 785 | + color: var(--font-button-color); | |
| 786 | +} | |
| 787 | + | |
| 788 | +/* Dimmer & Loader */ | |
| 789 | + | |
| 790 | +.mainwp-ui.mainwp-custom-theme .ui.dimmer, | |
| 699 | 791 | .mainwp-ui.mainwp-custom-theme .ui.inverted.dimmer { |
| 700 | 792 | background: var(--background-color-2); |
| 793 | + opacity: 1; | |
| 701 | 794 | } |
| 795 | + | |
| 796 | +.mainwp-ui.mainwp-custom-theme .ui.dimmer .text, | |
| 702 | 797 | .mainwp-ui.mainwp-custom-theme .ui.inverted.dimmer .text { |
| 703 | 798 | color: var(--font-light-color); |
| 704 | 799 | } |
| 705 | 800 | |
| 801 | +.mainwp-ui.mainwp-custom-theme .ui.loader:after { | |
| 802 | + color: var(--mainwp-green) !important; | |
| 803 | +} | |
| 804 | + | |
| 706 | 805 | /* Invert Menus */ |
| 707 | 806 | |
| 708 | 807 | .mainwp-ui.mainwp-custom-theme .ui.dropdown .menu { |
| 709 | 808 | background-color: var(--background-color-4); |
| @@ -717,19 +816,42 @@ | ||
| 717 | 816 | color: var(--font-color); |
| 718 | 817 | border-color: var(--border-color) !important; |
| 719 | 818 | } |
| 720 | 819 | |
| 820 | +.mainwp-ui.mainwp-custom-theme .ui.dropdown .menu .item.active, | |
| 821 | +.mainwp-ui.mainwp-custom-theme .ui.dropdown .menu .item.selected, | |
| 822 | +.mainwp-ui.mainwp-custom-theme .ui.dropdown .menu .item:hover { | |
| 823 | + background-color: var(--background-color-3) !important; | |
| 824 | +} | |
| 825 | + | |
| 721 | 826 | .mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation { |
| 722 | 827 | background-color: var(--background-color-1); |
| 723 | 828 | } |
| 829 | + | |
| 724 | 830 | .mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation, |
| 725 | 831 | .mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu { |
| 726 | 832 | background-color: var(--background-color-3); |
| 727 | 833 | } |
| 728 | 834 | |
| 835 | +.mainwp-ui.mainwp-custom-theme #mainwp-main-menu .item { | |
| 836 | + padding: 1em !important; | |
| 837 | + background-color: var(--background-color-3) !important; | |
| 838 | +} | |
| 839 | + | |
| 840 | +.mainwp-ui.mainwp-custom-theme #mainwp-main-menu .item .menu .item { | |
| 841 | + padding: 1em 1.5em !important; | |
| 842 | +} | |
| 843 | + | |
| 844 | +.mainwp-ui.mainwp-custom-theme #mainwp-main-menu .item .item .menu.active .item, | |
| 845 | +.mainwp-ui.mainwp-custom-theme #mainwp-main-menu .item .item .menu.active .item.title, | |
| 846 | +.mainwp-ui.mainwp-custom-theme #mainwp-main-menu .item .item .menu.active .item.content { | |
| 847 | + background-color: rgba(255, 255, 255, 0.08) !important; | |
| 848 | +} | |
| 849 | + | |
| 729 | 850 | .mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.vertical.menu { |
| 730 | 851 | background-color: var(--background-color-2); |
| 731 | 852 | } |
| 853 | + | |
| 732 | 854 | .mainwp-ui.mainwp-custom-theme .ui.pointing.vertical.menu { |
| 733 | 855 | background-color: var(--background-color-3); |
| 734 | 856 | border-color: var(--border-color) !important; |
| 735 | 857 | } |
| @@ -736,8 +858,9 @@ | ||
| 736 | 858 | |
| 737 | 859 | .mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.vertical.menu .item { |
| 738 | 860 | border-bottom: 1px solid var(--border-color) !important; |
| 739 | 861 | } |
| 862 | + | |
| 740 | 863 | .mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.vertical.menu .item:last-child { |
| 741 | 864 | border-bottom: none !important; |
| 742 | 865 | } |
| 743 | 866 | |
| @@ -750,12 +873,14 @@ | ||
| 750 | 873 | .mainwp-ui.mainwp-custom-theme .ui.pointing.vertical.menu .item { |
| 751 | 874 | border-color: var(--border-color); |
| 752 | 875 | color: var(--font-color); |
| 753 | 876 | } |
| 877 | + | |
| 754 | 878 | .mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.vertical.menu .item:hover, |
| 755 | 879 | .mainwp-ui.mainwp-custom-theme .ui.pointing.vertical.menu .item:hover { |
| 756 | 880 | background-color: var(--background-color-4); |
| 757 | 881 | } |
| 882 | + | |
| 758 | 883 | .mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.vertical.menu .item.active, |
| 759 | 884 | .mainwp-ui.mainwp-custom-theme .ui.pointing.vertical.menu .item.active { |
| 760 | 885 | border-color: var(--border-color); |
| 761 | 886 | background-color: var(--background-color-4); |
| @@ -760,8 +885,9 @@ | ||
| 760 | 885 | border-color: var(--border-color); |
| 761 | 886 | background-color: var(--background-color-4); |
| 762 | 887 | color: var(--font-color); |
| 763 | 888 | } |
| 889 | + | |
| 764 | 890 | .mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.vertical.menu .item:after, |
| 765 | 891 | .mainwp-ui.mainwp-custom-theme .ui.pointing.vertical.menu .item:after { |
| 766 | 892 | display: none !important; |
| 767 | 893 | } |
| @@ -769,8 +895,24 @@ | ||
| 769 | 895 | .mainwp-ui.mainwp-custom-theme .mainwp-api-icon { |
| 770 | 896 | color: var(--accent-color); |
| 771 | 897 | } |
| 772 | 898 | |
| 899 | +.mainwp-ui.mainwp-custom-theme .ui.pagination.menu { | |
| 900 | + background-color: var(--background-color-3); | |
| 901 | + border-color: var(--border-color); | |
| 902 | +} | |
| 903 | +.mainwp-ui.mainwp-custom-theme .ui.pagination.menu .item.disabled .page-link { | |
| 904 | + color: var(--font-light-color) !important; | |
| 905 | +} | |
| 906 | +.mainwp-ui.mainwp-custom-theme .ui.pagination.menu .item:hover, | |
| 907 | +.mainwp-ui.mainwp-custom-theme .ui.pagination.menu .item.active { | |
| 908 | + background: var(--accent-color); | |
| 909 | +} | |
| 910 | +.mainwp-ui.mainwp-custom-theme .ui.pagination.menu .item:hover .page-link, | |
| 911 | +.mainwp-ui.mainwp-custom-theme .ui.pagination.menu .item.active .page-link { | |
| 912 | + color: var( --background-color-3 ); | |
| 913 | +} | |
| 914 | + | |
| 773 | 915 | /* Invert Placeholder */ |
| 774 | 916 | |
| 775 | 917 | .mainwp-ui.mainwp-custom-theme .ui.placeholder { |
| 776 | 918 | opacity: 0.02; |
| @@ -783,8 +925,9 @@ | ||
| 783 | 925 | color: var(--font-color); |
| 784 | 926 | border-color: var(--border-color) !important; |
| 785 | 927 | background-color: var(--background-color-2) !important; |
| 786 | 928 | } |
| 929 | + | |
| 787 | 930 | .mainwp-ui.mainwp-custom-theme .ui.accordion .title:hover { |
| 788 | 931 | color: var(--font-color) !important; |
| 789 | 932 | } |
| 790 | 933 | |
| @@ -805,13 +948,13 @@ | ||
| 805 | 948 | |
| 806 | 949 | /* Invert Calendar */ |
| 807 | 950 | |
| 808 | 951 | .mainwp-ui.mainwp-custom-theme .ui.calendar { |
| 809 | - background-color: var(--table-background-color) !important; | |
| 952 | + background-color: var(--table-background-color) !important; | |
| 810 | 953 | } |
| 811 | 954 | |
| 812 | 955 | .mainwp-ui.mainwp-custom-theme .ui.calendar:before { |
| 813 | - background-color: var(--table-background-color) !important; | |
| 956 | + background-color: var(--table-background-color) !important; | |
| 814 | 957 | } |
| 815 | 958 | |
| 816 | 959 | /* Yoast SEO Widget */ |
| 817 | 960 | |
| @@ -911,19 +1054,19 @@ | ||
| 911 | 1054 | color: var(--font-color) !important; |
| 912 | 1055 | border: none !important; |
| 913 | 1056 | } |
| 914 | 1057 | |
| 915 | -.mainwp-ui.mainwp-custom-theme .wf-scanner-progress > .wf-scan-step > .wf-scan-step-icon > .wf-scan-step-disabled, | |
| 916 | -.mainwp-ui.mainwp-custom-theme .wf-scanner-progress > .wf-scan-step > .wf-scan-step-icon > .wf-scan-step-premium, | |
| 917 | -.mainwp-ui.mainwp-custom-theme .wf-scanner-progress > .wf-scan-step > .wf-scan-step-icon > .wf-scan-step-pending, | |
| 918 | -.mainwp-ui.mainwp-custom-theme .wf-scanner-progress > .wf-scan-step > .wf-scan-step-icon > .wf-scan-step-running, | |
| 919 | -.mainwp-ui.mainwp-custom-theme .wf-scanner-progress > .wf-scan-step > .wf-scan-step-icon > .wf-scan-step-complete-success, | |
| 920 | -.mainwp-ui.mainwp-custom-theme .wf-scanner-progress > .wf-scan-step > .wf-scan-step-icon > .wf-scan-step-complete-warning { | |
| 1058 | +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step>.wf-scan-step-icon>.wf-scan-step-disabled, | |
| 1059 | +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step>.wf-scan-step-icon>.wf-scan-step-premium, | |
| 1060 | +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step>.wf-scan-step-icon>.wf-scan-step-pending, | |
| 1061 | +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step>.wf-scan-step-icon>.wf-scan-step-running, | |
| 1062 | +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step>.wf-scan-step-icon>.wf-scan-step-complete-success, | |
| 1063 | +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step>.wf-scan-step-icon>.wf-scan-step-complete-warning { | |
| 921 | 1064 | background-color: var(--background-color-3) !important; |
| 922 | 1065 | } |
| 923 | 1066 | |
| 924 | -.mainwp-ui.mainwp-custom-theme .wf-scanner-progress > .wf-scan-step:first-of-type, | |
| 925 | -.mainwp-ui.mainwp-custom-theme .wf-scanner-progress > .wf-scan-step:last-of-type { | |
| 1067 | +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step:first-of-type, | |
| 1068 | +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step:last-of-type { | |
| 926 | 1069 | background: var(--background-color-3) !important; |
| 927 | 1070 | } |
| 928 | 1071 | |
| 929 | 1072 | .mainwp-ui.mainwp-custom-theme .wf-issue:nth-of-type(2n), |
| @@ -938,4 +1081,43 @@ | ||
| 938 | 1081 | |
| 939 | 1082 | .mainwp-ui.mainwp-custom-theme #wf-scan-activity-log { |
| 940 | 1083 | background-color: var(--background-color-3) !important; |
| 941 | 1084 | } |
| 1085 | + | |
| 1086 | +/* dark theme */ | |
| 1087 | +.mainwp-ui.mainwp-custom-theme .dt-scroll-body tbody tr.selected .ui.red.button, | |
| 1088 | +.mainwp-ui.mainwp-custom-theme .dt-scroll-body tbody tr.selected .ui.basic.red.button, | |
| 1089 | +.mainwp-ui.mainwp-custom-theme .dt-scroll-body tbody tr.selected .ui.button.green, | |
| 1090 | +.mainwp-ui.mainwp-custom-theme .dt-scroll-body tbody tr.selected .ui.button.basic.green{ | |
| 1091 | + color: #fff !important; | |
| 1092 | +} | |
| 1093 | +/* end */ | |
| 1094 | + | |
| 1095 | + | |
| 1096 | +/******************************* | |
| 1097 | + Scrollbars | |
| 1098 | +*******************************/ | |
| 1099 | + | |
| 1100 | +/* For WebKit Browsers (e.g., Chrome, Edge, Safari) */ | |
| 1101 | +::-webkit-scrollbar { | |
| 1102 | + width: 5px; /* Width of the scrollbar */ | |
| 1103 | +} | |
| 1104 | + | |
| 1105 | +::-webkit-scrollbar-track { | |
| 1106 | + background: #1c1d1b; /* Background of the track */ | |
| 1107 | +} | |
| 1108 | + | |
| 1109 | +::-webkit-scrollbar-thumb { | |
| 1110 | + background-color: #666666; /* Color of the scrollbar thumb */ | |
| 1111 | + border-radius: 5px; /* Round edges for the thumb */ | |
| 1112 | + border: 2px solid #1c1d1b; /* Optional: creates padding between thumb and track */ | |
| 1113 | +} | |
| 1114 | + | |
| 1115 | +::-webkit-scrollbar-thumb:hover { | |
| 1116 | + background: #666666; /* Thumb color on hover */ | |
| 1117 | +} | |
| 1118 | + | |
| 1119 | +/* For Firefox (using CSS Scrollbars Module Level 1) */ | |
| 1120 | +* { | |
| 1121 | + scrollbar-width: thin; /* Options: auto, thin */ | |
| 1122 | + scrollbar-color: #666666 #1c1d1b; /* thumb color, track color */ | |
| 1123 | +} | |
