tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

linear-widget.css (2067B)

      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 .linear-easing-function-container {
      6  height: 100%;
      7  direction: ltr;
      8 }
      9 
     10 .linear-easing-function-container .display-wrap {
     11  --chart-size: 300px;
     12  height: 100%;
     13  display: grid;
     14  grid-template-rows: var(--chart-size) 1fr;
     15  justify-items: center;
     16  align-items: center;
     17  gap: 5px;
     18 }
     19 
     20 .linear-easing-function-container svg.chart {
     21  aspect-ratio: 1 / 1;
     22  max-height: 100%;
     23 }
     24 
     25 .linear-easing-function-container .chart-grid {
     26  stroke: var(--timing-function-grid-color);
     27  pointer-events: none;
     28 }
     29 
     30 .linear-easing-function-container .chart-linear {
     31  -moz-context-properties: stroke;
     32  stroke: var(--timing-function-line-color);
     33 }
     34 
     35 .linear-easing-function-container .control-point {
     36  -moz-context-properties: fill, stroke;
     37  fill: var(--timing-function-control-point-background);
     38  cursor: pointer;
     39 }
     40 
     41 /* Timing Function Preview Widget */
     42 
     43 .linear-easing-function-container .timing-function-preview {
     44  width: var(--chart-size);
     45  /* Draw a background line */
     46  background: linear-gradient(0deg, transparent 45%, var(--timing-function-preview-scale) 45%, var(--timing-function-preview-scale) 55%, transparent 55%);
     47  /* opt-out of forced colors so we can see the "line" gradient */
     48  forced-color-adjust: none;
     49 }
     50 
     51 .linear-easing-function-container .timing-function-preview .dot::before {
     52  content: "";
     53  display: inline-block;
     54  width: 10px;
     55  height: 10px;
     56  aspect-ratio: 1 / 1;
     57  border-radius: 50%;
     58  border: 2px solid var(--timing-function-preview-dot-border);
     59  background: var(--timing-function-line-color);
     60  /* We need to opt-out of forced color as --timing-function-line-color is
     61     a registered color and gets computed to an rgb color which means the color
     62     will be forced, even if the declaration value is a system color.
     63     All the colors used here have High Contrast re-declaration so it should be fine */
     64  forced-color-adjust: none;
     65 }