|
| 1 | +:root, |
| 2 | +html, |
| 3 | +body { |
| 4 | + /* Mintifier custom variables */ |
| 5 | + --mintifier-dark-1: rgb(16, 16, 19); |
| 6 | + --mintifier-dark-2: rgb(27, 28, 33); |
| 7 | + --mintifier-dark-3: rgb(40, 40, 45); |
| 8 | + --mintifier-white-1: rgb(255, 255, 255); |
| 9 | + --mintifier-white-2: rgb(200, 200, 200); |
| 10 | + --mintifier-green-1: rgb(70, 143, 74); |
| 11 | + --mintifier-green-2: rgb(91, 185, 95); |
| 12 | + --mintifier-green-3: rgb(122, 249, 129); |
| 13 | + --mintifier-green-2-20: rgba(70, 143, 74, 0.2); |
| 14 | + --mintifier-green-2-10: rgba(70, 143, 74, 0.1); |
| 15 | + --mintifier-green-2-80: rgba(70, 143, 74, 0.8); |
| 16 | + --mintifier-white-1-06: rgba(255, 255, 255, 0.06); |
| 17 | + --mintifier-white-1-10: rgba(255, 255, 255, 0.1); |
| 18 | + --mintifier-border: rgb(47, 84, 50); |
| 19 | + --mintifier-font-family: system-ui, -apple-system, "Roboto", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; |
| 20 | + |
| 21 | + /* Main UI colors */ |
| 22 | + --md-toolbar-color: var(--mintifier-dark-2) !important; |
| 23 | + --md-toolbar-text-color: var(--mintifier-white-1) !important; |
| 24 | + --md-background-color-0: var(--mintifier-dark-1) !important; |
| 25 | + --md-background-color-50: var(--mintifier-dark-1) !important; |
| 26 | + --md-background-color-100: var(--mintifier-dark-2) !important; |
| 27 | + |
| 28 | + /* Tab colors */ |
| 29 | + --md-tab-text-color: var(--mintifier-white-1) !important; |
| 30 | + --md-tab-background-text: var(--mintifier-white-1) !important; |
| 31 | + --md-tab-label-color: var(--mintifier-white-1) !important; |
| 32 | + --md-tab-label-color-inactive: var(--mintifier-white-2) !important; |
| 33 | + --md-tab-line-color: var(--mintifier-green-2) !important; |
| 34 | + --md-tab-loading-color: var(--mintifier-green-2) !important; |
| 35 | + --md-tab-background-color-hover: var(--mintifier-green-2-80) !important; |
| 36 | + --md-tab-separator-color: var(--mintifier-white-1-10) !important; |
| 37 | + |
| 38 | + /* URL/Search bar */ |
| 39 | + --md-urlbar-background-color: var(--mintifier-dark-1) !important; |
| 40 | + --md-urlbar-background-color-hover: var(--mintifier-dark-2) !important; |
| 41 | + --md-urlbar-background-color-open: var(--mintifier-dark-2) !important; |
| 42 | + --md-toolbar-field: var(--mintifier-dark-1) !important; |
| 43 | + --md-toolbar-field-text: var(--mintifier-white-1) !important; |
| 44 | + --md-input-background-color: var(--mintifier-dark-1) !important; |
| 45 | + --md-input-text-color: var(--mintifier-white-1) !important; |
| 46 | + --md-input-focus-border-color: var(--mintifier-green-2) !important; |
| 47 | + --md-toolbar-field-border-focus: var(--mintifier-green-2) !important; |
| 48 | + |
| 49 | + /* Popup and menu colors */ |
| 50 | + --md-popup-background-color: var(--mintifier-dark-2) !important; |
| 51 | + --md-popup-text-color: var(--mintifier-white-1) !important; |
| 52 | + --md-menu-background-color: var(--mintifier-dark-2) !important; |
| 53 | + --md-popup-border-color: var(--mintifier-green-1) !important; |
| 54 | + --md-popup-highlight-color: var(--mintifier-green-1) !important; |
| 55 | + --md-menu-border-color: var(--mintifier-green-2) !important; |
| 56 | + --md-menu-background-color-hover: var(--mintifier-green-2-20) !important; |
| 57 | + |
| 58 | + /* Icon colors */ |
| 59 | + --md-icon-attention-color: var(--mintifier-green-3) !important; |
| 60 | + --md-icon-color: var(--mintifier-white-1) !important; |
| 61 | + --md-icon-color-primary: var(--mintifier-white-1) !important; |
| 62 | + --md-icon-color-secondary: var(--mintifier-white-2) !important; |
| 63 | + |
| 64 | + /* Text colors */ |
| 65 | + --md-text-primary: var(--mintifier-white-1) !important; |
| 66 | + --md-text-secondary: var(--mintifier-white-2) !important; |
| 67 | + |
| 68 | + /* Accent and selection colors */ |
| 69 | + --md-accent-color: var(--mintifier-green-2) !important; |
| 70 | + --md-accent-color-hover: var(--mintifier-green-2-80) !important; |
| 71 | + --md-accent-color-transparent: var(--mintifier-green-2-10) !important; |
| 72 | + --md-accent-color-transparent-active: var(--mintifier-green-2-20) !important; |
| 73 | + --md-selection-background-color: var(--mintifier-green-2) !important; |
| 74 | + --md-selection-text-color: var(--mintifier-white-1) !important; |
| 75 | + --md-secondary-button-text: var(--mintifier-green-2) !important; |
| 76 | + |
| 77 | + /* Control and input styling */ |
| 78 | + --md-control-background-color: var(--mintifier-white-1-06) !important; |
| 79 | + --md-control-border-color: var(--mintifier-white-1-06) !important; |
| 80 | + |
| 81 | + /* Content and separator colors */ |
| 82 | + --md-content-separator-color: var(--mintifier-dark-3) !important; |
| 83 | + |
| 84 | + /* Default webpage colors */ |
| 85 | + --in-content-page-background: var(--mintifier-dark-1) !important; |
| 86 | + --in-content-box-background: var(--mintifier-dark-2) !important; |
| 87 | + --in-content-border-color: var(--mintifier-border) !important; |
| 88 | + --in-content-table-header-background: var(--mintifier-green-1) !important; |
| 89 | + --newtab-background-color-secondary: var(--mintifier-dark-3) !important; |
| 90 | +} |
| 91 | + |
| 92 | +/* Additional specificity for some problematic elements */ |
| 93 | + |
| 94 | +h1 { |
| 95 | + font-family: var(--mintifier-font-family) !important; |
| 96 | +} |
| 97 | + |
| 98 | +#urlbar-background { |
| 99 | + background-color: var(--mintifier-dark-1) !important; |
| 100 | +} |
| 101 | + |
| 102 | +.tab-background { |
| 103 | + background-color: var(--mintifier-dark-2) !important; |
| 104 | + border-top: 2px solid var(--mintifier-green-2) !important; |
| 105 | +} |
| 106 | + |
| 107 | +.tab-background[selected="true"] { |
| 108 | + background-color: var(--mintifier-dark-1) !important; |
| 109 | + border-top: 2px solid var(--mintifier-green-2) !important; |
| 110 | +} |
| 111 | + |
| 112 | +#navigator-toolbox { |
| 113 | + background-color: var(--mintifier-dark-1) !important; |
| 114 | +} |
| 115 | + |
| 116 | +.tabbrowser-tab { |
| 117 | + color: var(--mintifier-white-1) !important; |
| 118 | +} |
| 119 | + |
| 120 | +#search-box { |
| 121 | + background-color: var(--mintifier-dark-1) !important; |
| 122 | + color: var(--mintifier-white-1) !important; |
| 123 | +} |
| 124 | + |
| 125 | +.outer-wrapper { |
| 126 | + background-image: |
| 127 | + linear-gradient( |
| 128 | + to top, |
| 129 | + rgba(16, 16, 19, 1), /* Mintifier dark-1 with opacity */ |
| 130 | + rgba(16, 16, 19, 0.95) /* Mintifier dark-2 with opacity */ |
| 131 | + ), |
| 132 | + url("./images/New Tab Background.jpg") !important; |
| 133 | + background-size: cover !important; |
| 134 | + background-position: center center !important; |
| 135 | + background-repeat: no-repeat !important; |
| 136 | +} |
0 commit comments