tor-browser

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

_ShortcutFeatureHighlight.scss (1418B)


      1 // Default overrides from Feature Highlight
      2 .shortcut-feature-highlight {
      3  .feature-highlight-modal {
      4    padding: var(--space-large);
      5    width: auto;
      6 
      7    p {
      8      margin: 0;
      9      padding-block-start: 0;
     10    }
     11 
     12    // Make sure the text is legible with dark wallpaper + light mode combo
     13    p, p:hover {
     14      color: inherit;
     15    }
     16 
     17    .message-icon {
     18      display: none;
     19    }
     20 
     21    &.inset-block-end {
     22      margin-block-start: var(--space-large);
     23      inset-inline-end: var(--space-xlarge);
     24    }
     25 
     26    // The "Dismiss" button in the top right corner of the highlight needs to be in front of the image
     27    >moz-button {
     28      position: absolute;
     29      inset-inline-end: var(--space-large);
     30      inset-block-start: var(--space-large);
     31    }
     32  }
     33 
     34  // Custom override for dismiss-contrast
     35  &.is-inverted-dark-dismiss-button {
     36    .feature-highlight-modal {
     37      @media (prefers-color-scheme: dark) {
     38 
     39        // override color so that it is visible on the image
     40        >moz-button {
     41          --button-icon-fill: var(--color-gray-70);
     42        }
     43      }
     44    }
     45  }
     46 
     47  .shortcut-feature-highlight-content {
     48    display: flex;
     49    flex-direction: column;
     50    gap: var(--space-medium);
     51  }
     52 
     53  .shortcut-feature-highlight-copy {
     54    font-size: var(--font-size-small);
     55 
     56    .title {
     57      font-weight: var(--heading-font-weight);
     58      margin-block-end: var(--space-xsmall);
     59      text-align: inherit;
     60    }
     61  }
     62 }