tor-browser

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

accessibility-color-contrast.css (2170B)

      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 /* Classes used to style the color contrast section in the Accessibility
      6 * Checks panel and color picker tooltip across the Inspector panel.
      7 *
      8 * The section consists of:
      9 *   - contrast ratio value (numeric + score badge (AA/AAA/FAIL)):
     10 *       Only shows up if contrast ratio can be calculated.
     11 *   - large text indicator badge:
     12 *       Only shows up if the selected text node contains large text.
     13 */
     14 .accessibility-color-contrast {
     15  position: relative;
     16  display: flex;
     17  cursor: default;
     18  height: inherit;
     19  align-items: baseline;
     20 }
     21 
     22 .accessibility-color-contrast .accessibility-contrast-value:empty:after {
     23  display: none;
     24 }
     25 
     26 .accessibility-color-contrast .accessibility-contrast-value:after {
     27  margin-inline-start: 4px;
     28 }
     29 
     30 .accessibility-color-contrast .accessibility-contrast-value.AA:after,
     31 .accessibility-color-contrast .accessibility-contrast-value.AAA:after {
     32  color: var(--theme-highlight-green);
     33 }
     34 
     35 .accessibility-color-contrast .accessibility-contrast-value.FAIL:after {
     36  color: var(--theme-icon-error-color);
     37  display: inline-block;
     38  width: 12px;
     39  height: 12px;
     40  content: "";
     41  vertical-align: -2px;
     42  background-image: url(resource://devtools-shared-images/error-small.svg);
     43  background-position: center;
     44  background-repeat: no-repeat;
     45  -moz-context-properties: fill;
     46  fill: currentColor;
     47 }
     48 
     49 .accessibility-color-contrast .accessibility-contrast-value.AA:after {
     50  content: "AA\2713";
     51  unicode-bidi: isolate;
     52 }
     53 
     54 .accessibility-color-contrast .accessibility-contrast-value.AAA:after {
     55  content: "AAA\2713";
     56  unicode-bidi: isolate;
     57 }
     58 
     59 .accessibility-color-contrast .accessibility-color-contrast-separator:before {
     60  content: "–";
     61  margin-inline-start: 4px;
     62 }
     63 
     64 .accessibility-color-contrast-large-text {
     65  background-color: var(--badge-background-color);
     66  color: var(--badge-color);
     67  outline: 1px solid var(--badge-border-color);
     68  padding: 0 2px;
     69  margin-inline-start: 6px;
     70  line-height: initial;
     71  user-select: none;
     72 }