shy-about.css (4939B)
1 /*== ShyFox about:something pages =================================================================================================================== 2 3 Styles for settings, Firefox View, etc. 4 5 */ 6 7 @-moz-document url-prefix("about:"), url-prefix("chrome:"){ 8 9 /* accent color */ 10 :root, panel, dialog, window{ 11 --in-content-primary-button-background-active: var(--shy-color) !important; 12 --in-content-primary-button-background-hover: var(--shy-color) !important; 13 --lwt-toolbarbutton-icon-fill-attention: var(--shy-color) !important; 14 --in-content-primary-button-background: var(--shy-color) !important; 15 --toolbarbutton-icon-fill-attention: var(--shy-color) !important; 16 --fxview-primary-action-background: var(--shy-color) !important; 17 --toolbar-field-focus-border-color: var(--shy-color) !important; 18 --button-primary-active-bgcolor: var(--shy-color) !important; 19 --button-primary-hover-bgcolor: var(--shy-color) !important; 20 --uc-checkbox-checked-bgcolor: var(--shy-color) !important; 21 --color-accent-primary-active: var(--shy-color) !important; 22 --color-accent-primary-hover: var(--shy-color) !important; 23 --checkbox-checked-bgcolor: var(--shy-color) !important; 24 --in-content-accent-color: var(--shy-color) !important; 25 --button-primary-bgcolor: var(--shy-color) !important; 26 --in-content-link-color: var(--shy-color) !important; 27 --color-accent-primary: var(--shy-color) !important; 28 --focus-outline-color: var(--shy-color) !important; 29 --input-border-color: var(--shy-color) !important; 30 } 31 32 .primary-button{ 33 --primary-button-background-color: var(--shy-color) !important; 34 --primary-button-hover-background-color: color-mix(in srgb, white 10%, var(--shy-color)) !important; 35 --primary-button-active-background-color: color-mix(in srgb, white 20%, var(--shy-color)) !important; 36 } 37 38 :is(.icon, img)[src="chrome://global/skin/icons/info-filled.svg"] {fill: var(--shy-color) !important;} 39 moz-message-bar {background-color: var(--in-content-button-background) !important;} 40 41 .cpu{ 42 background: linear-gradient( 43 to left, 44 var(--shy-color) 45 calc(var(--bar-width) * 1%), 46 transparent 47 calc(var(--bar-width) * 1%) 48 ) !important; 49 } 50 51 button[role="tab"][selected]::before {display: none !important;} 52 53 /* big rounded corners */ 54 .menupopup-arrowscrollbox, moz-message-bar, 55 .addon-detail-contribute, panel-list, 56 .trr-message-container, 57 .web-appearance-choice, body[dir], 58 .sidebar-footer-link, menupopup, 59 .info-box-container, section, 60 .sidebar-item--tall, details, 61 .info-box-content, 62 .sidebar-item, 63 .qr-code-box, select, 64 .action-box, table, 65 .dialogBox, tree, 66 .info-box, 67 .category, 68 .toolbar, 69 .modal, 70 .card, 71 72 #ping-picker, 73 #reportBox, 74 #reportBox #comments, 75 #migrationWizardDialog, 76 #translations-manage-install-list 77 78 {border-radius: var(--big-rounding) !important;} 79 80 /* small rounded corners */ 81 button:not( 82 :is( 83 [class*="devtools"], 84 [class*="search"], 85 [class*="tab"] 86 ) 87 ), 88 89 input:not([type="checkbox"]), 90 91 .search-container, 92 .study-icon, 93 94 search-textbox, 95 menulist, 96 span, 97 a, 98 99 .tooltip-container .tooltip-panel, 100 101 #activeLanguages 102 103 {border-radius: var(--rounding) !important;} 104 105 /* only top or bottom corners */ 106 .card-heading-image{ 107 border-top-left-radius: var(--big-rounding) !important; 108 border-top-right-radius: var(--big-rounding) !important; 109 } 110 111 listheader{ 112 border-top-left-radius: var(--rounding) !important; 113 border-top-right-radius: var(--rounding) !important; 114 } 115 116 richlistbox{ 117 border-bottom-left-radius: var(--rounding) !important; 118 border-bottom-right-radius: var(--rounding) !important; 119 } 120 121 /* dropdown menu margin */ 122 .tooltip-container .tooltip-panel .menuitem, 123 panel-list[role="menu"] panel-item {margin-inline: 5px} 124 125 } 126 127 /* about:debugging thin mode */ 128 @-moz-document url-prefix("about:debugging") { 129 @media (max-width: 700px) { 130 .sidebar{ 131 width: 45px !important; 132 img{margin: 0 !important;} 133 134 .sidebar-item:has(.qa-sidebar-no-devices), 135 .sidebar__adb-status, 136 .sidebar__refresh-usb, 137 .sidebar__footer__support-help span, 138 .ellipsis-text {display: none} 139 } 140 141 sidebar__footer__support-help, .sidebar-item__link{width: 23px !important;} 142 .sidebar-item:has(.sidebar__footer__support-help) {width: 14px !important;} 143 .sidebar-fixed-item__icon{margin-right: 0px !important;} 144 .app{display: flex !important;} 145 } 146 }