variables.css (1982B)
1 /* This Source Code Form is subject to the terms of the Mozilla Public 2 * License, v. 2.0. If a copy of the MPL was not distributed with this 3 * file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */ 4 5 :root { 6 /* header height is 28px + 1px for its border */ 7 --editor-header-height: 29px; 8 /* footer height is 24px + 1px for its border */ 9 --editor-footer-height: 25px; 10 /* searchbar height is 24px + 1px for its top border */ 11 --editor-searchbar-height: 25px; 12 /* Remove once https://bugzilla.mozilla.org/show_bug.cgi?id=1520440 lands */ 13 --theme-code-line-height: calc(15 / 11); 14 /* Background and text colors and opacity for skipped breakpoint panes */ 15 --skip-pausing-background-color: var(--theme-toolbar-hover); 16 --skip-pausing-opacity: 0.6; 17 --skip-pausing-color: var(--theme-body-color); 18 --theme-inline-preview-label-pause-color: var(--paused-color); 19 --theme-inline-preview-label-pause-background: var(--paused-background-color); 20 21 --search-overlays-semitransparent: light-dark(rgba(221, 225, 228, 0.66), rgba(42, 46, 56, 0.66)); 22 --popup-shadow-color: light-dark(#d0d0d0, #5c667b); 23 --theme-inline-preview-background: light-dark(rgb(251, 247, 255), rgb(43, 38, 50)); 24 --theme-inline-preview-border-color: light-dark(#ebd1ff, #47326c); 25 --theme-inline-preview-label-trace-color: light-dark(#6300a6, #dfccff); 26 --theme-inline-preview-label-trace-background: light-dark( 27 hsl(from rgb(244, 230, 255) h s calc(l * 0.7) / 30%) /* use 30% opacity to allow showing text selection background */, 28 hsl(from #3f2e5f h s calc(l * 2) / 30%) /* dark theme requires some specific luminosity factor */ 29 ); 30 --paused-background-color: light-dark(hsl(54, 100%, 92%), hsl(42, 37%, 19%)); 31 --paused-color: light-dark(var(--theme-body-color), hsl(43, 94%, 81%)); 32 --paused-error-color: light-dark(var(--red-70), var(--red-20)); 33 } 34 35 /* Animations */ 36 37 @keyframes spin { 38 from { 39 transform: rotate(0deg); 40 } 41 to { 42 transform: rotate(360deg); 43 } 44 }