@-moz-document url-prefix(about:preferences) { /* Icons */ /* Categories */ #category-general > .category-icon { list-style-image: url(../icons/settings.svg) !important; } #category-home > .category-icon { list-style-image: url(../icons/home.svg) !important; } #category-search > .category-icon { list-style-image: url(../icons/search.svg) !important; } #category-privacy > .category-icon { list-style-image: url(../icons/lock.svg) !important; } #category-sync > .category-icon { list-style-image: url(../icons/sync.svg) !important; } .category[name="discover"] { background-image: url(../icons/star.svg) !important; } .category[name="extension"] { background-image: url(../icons/addons.svg) !important; } .category[name="theme"] { background-image: url(../icons/brush.svg) !important; } /* Permissions */ .geo-icon { list-style-image: url(../urlbar/permissions/geo.svg) !important; } .camera-icon { list-style-image: url(../urlbar/permissions/camera.svg) !important; } .microphone-icon { list-style-image: url(../urlbar/permissions/microphone.svg) !important; } .desktop-notification-icon { list-style-image: url(../urlbar/permissions/desktop-notification.svg) !important; } .autoplay-icon { list-style-image: url(../urlbar/permissions/autoplay-media.svg) !important; } .xr-icon { list-style-image: url(../urlbar/permissions/xr.svg) !important; } /* Sync Items */ .sync-engine-bookmarks .checkbox-icon, .sync-engine-bookmarks.sync-engine-image { list-style-image: url(../icons/bookmark.svg) !important; } .sync-engine-history .checkbox-icon, .sync-engine-history.sync-engine-image { list-style-image: url(../icons/history.svg) !important; } .sync-engine-tabs .checkbox-icon, .sync-engine-tabs.sync-engine-image { list-style-image: url(../icons/new-tab-image.svg) !important; } .sync-engine-passwords .checkbox-icon, .sync-engine-passwords.sync-engine-image { list-style-image: url(../icons/key.svg) !important; } .sync-engine-addons .checkbox-icon, .sync-engine-addons.sync-engine-image { list-style-image: url(../icons/addons.svg) !important; } .sync-engine-prefs .checkbox-icon, .sync-engine-prefs.sync-engine-image { list-style-image: url(../icons/settings.svg) !important; } /* Profile Picture */ .fxaProfileImage:not([style*="list-style-image"]) { list-style-image: url(../icons/profile.svg) !important; } /* links */ .preferences-icon, .page-options-menu > .more-options-button { background-image: url(../icons/settings.svg) !important; } .addons-icon { list-style-image: url(../icons/addons.svg) !important; } .textbox-search-sign { list-style-image: url(../icons/search.svg) !important; } /* Visual Ajustments */ :root { --in-content-page-background: #f7f7f7 !important; --in-content-text-color: #262626 !important; --in-content-page-color: #262626 !important; --card-background: #fff; --card-shadow: rgb(0 0 0 / 13%) 0px 1.6px 3.6px, rgb(0 0 0 / 11%) 0px 0px 2.9px !important; --sidebar-border-color: #bebebe; --category-active: #0078d4; --in-content-category-text-selected: #0078d4 !important; --category-selected: #0001; --in-content-link-color: #0078d4 !important; --section-highlight-background-color: #0078d420 !important; --search-bgcolor: #fff; --input-border-color: var(--sidebar-border-color); --input-border-color-focused: #888; --checkbox-bgcolor: #f7f7f7; --checkbox-border-color: #8D8D8D; --checkbox-hover-border-color: #666; --checkbox-fill-color: #262626; --checkbox-checked-bgcolor: #0078D4; --checkbox-checked-fill-color: #fff; } .content-blocking-category.selected { border-color: #0078d4 !important; } .content-blocking-category.expanded:not(.selected) .content-blocking-warning { background-color: #f7f7f7 !important; } @media (prefers-color-scheme: dark) { :root { --in-content-page-background: #333 !important; --in-content-text-color: #fff !important; --in-content-page-color: #fff !important; --card-background: #3b3b3b; --card-shadow: 0px 1.6px 3.6px rgb(0 0 0 / 25%), 0px 0px 2.9px rgb(0 0 0 / 22%) !important; --sidebar-border-color: #6b6b6b; --category-active: #63ade5; --in-content-category-text-selected: #63ade5 !important; --category-selected: #fff1; --in-content-link-color: #63ade5 !important; --section-highlight-background-color: #63ade520 !important; --search-bgcolor: #2b2b2b; --input-border-color-focused: #808080; --checkbox-bgcolor: #333; --checkbox-border-color: #7d7d7d; --checkbox-hover-border-color: #A4A4A4; --checkbox-fill-color: #fff; --checkbox-checked-bgcolor: #006CBE; --checkbox-checked-fill-color: #fff; } .content-blocking-category.selected { border-color: #63ade5 !important; } .content-blocking-category.expanded:not(.selected) .content-blocking-warning { background-color: #333 !important; } } /* Cards For Certain Sections */ #fxaGroup, .sync-group, #trackingGroup, #searchbarGroup, #homeContentsGroup, #permissionsGroup, #httpsOnlyBox, #applicationsGroup, #oneClickSearchProvidersGroup { padding: 12px 16px !important; background: var(--card-background) !important; box-shadow: var(--card-shadow) !important; border-radius: 4px !important; border: 0 !important; } :is(.sync-group, #trackingGroup, #searchbarGroup, #homeContentsGroup, #permissionsGroup, #httpsOnlyBox, #applicationsGroup, #oneClickSearchProvidersGroup) h2 { margin-top: 2px !important; } h1 { margin: 0 0 16px !important; font-weight: 600 !important; font-size: 20px !important; } #openChangeProfileImage { height: 64px !important; width: 64px !important; margin: 10px !important; margin-inline: 6px 20px !important; } menulist { max-width: 400px !important; } search-textbox, input[type="text"] { background-color: transparent !important; border: 1px solid var(--input-border-color) !important; transition: all .2s ease-in-out !important; } search-textbox:hover, search-textbox[focused], input[type="text"]:focus, input[type="text"]:hover { --input-border-color: var(--input-border-color-focused) !important; } search-textbox[focused], input[type="text"]:focus { box-shadow: 0 0 0 1px inset var(--input-border-color) !important; } search-textbox { background-color: var(--search-bgcolor) !important; padding: 2px 8px !important; margin: 16px 0 !important; min-height: 34px !important; } #policies-container { margin: 17px 0 17px 0 !important; position: relative !important; z-index: 99 !important; background-color: var(--in-content-page-background) !important; } button, menulist { background-color: transparent !important; border: 1px solid var(--input-border-color) !important; border-radius: 2px !important; transition: all .2s ease-in-out !important; } button:hover, menulist:hover { border-color: var(--input-border-color-focused) !important; } dropmarker { list-style-image: url(../popup/menu-right.svg) !important; transform: rotate(90deg) scale(calc(16 / 12)) !important; margin: 0 4px 0 0 !important; max-width: 12px !important; } .navigation { border-right: 1px solid var(--sidebar-border-color) !important; } .sticky-container { border-bottom: 1px solid var(--sidebar-border-color) !important; } .sticky-container::before { content: "Preferences"; font-size: 24px; font-weight: 600; position: absolute !important; min-height: 34px; top: 16px; left: 4px; } #mainPrefPane { margin-top: 16px !important; } .checkbox-check { /* Move Checkboxes to Right */ -moz-box-ordinal-group: 2 !important; width: 40px !important; height: 20px !important; padding: 4px !important; padding-inline: 0 24px !important; list-style-image: none !important; border-radius: 99px !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Ccircle cx='5' cy='5' r='5' fill='context-fill'/%3E%3C/svg%3E") !important; background-position: 4px 4px !important; background-repeat: no-repeat !important; background-size: 10px !important; transition: all 0.1s ease-in-out !important; -moz-context-properties: fill, fill-opacity !important; fill: currentColor !important; background-color: var(--checkbox-bgcolor) !important; color: var(--checkbox-fill-color) !important; border: 1px solid var(--checkbox-border-color) !important; margin: 3px 8px !important; } .indent > checkbox > .checkbox-check { margin-inline-start: 32px !important; } .checkbox-check:hover { border-color: var(--checkbox-hover-border-color) !important; } .checkbox-check[checked] { background-position: 24px 4px !important; background-color: var(--checkbox-checked-bgcolor) !important; color: var(--checkbox-checked-fill-color) !important; border-color: transparent !important; } .radio-check { background-color: var(--checkbox-bgcolor) !important; border: 1px solid var(--checkbox-border-color) !important; } .radio-check:hover { background-color: var(--checkbox-bgcolor) !important; border-color: var(--checkbox-hover-border-color) !important; } .radio-check[selected] { background-color: var(--checkbox-border-color) !important; border-color: transparent !important; color: var(--checkbox-bgcolor) !important; } .radio-check[selected]:hover { background-color: var(--checkbox-hover-border-color) !important; } #categories { padding-inline: 16px !important; margin: 16px 0 0 !important; } .category { position: relative !important; margin: 0 !important; padding-inline: 12px !important; } .sidebar-footer-link, .sidebar-footer-button > .text-link { margin-inline: 16px !important; } .sidebar-footer-icon { margin: 16px !important; height: 16px !important; width: 16px !important; } .sidebar-footer-button:last-of-type { margin-bottom: 16px !important; } @media (max-width: 830px) { :root { --in-content-sidebar-width: 80px !important; } .navigation { margin-inline-end: 16px !important; } } .category::before { content: ""; height: calc(100% - 24px) !important; position: absolute !important; top: 12px; left: 0; border-left: 3px solid transparent !important; } .category[selected]::before { border-color: var(--category-active) !important; } }