tor-browser

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

App.css (3512B)


      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 @property --cm-gutter-width {
      6  syntax: "<length>";
      7  inherits: true;
      8  initial-value: 20px;
      9 }
     10 
     11 @property --cm-editor-scroller-width {
     12  syntax: "<length>";
     13  inherits: true;
     14  initial-value: 20px;
     15 }
     16 
     17 * {
     18  box-sizing: border-box;
     19 }
     20 
     21 html,
     22 body {
     23  height: 100%;
     24  width: 100%;
     25  margin: 0;
     26  padding: 0;
     27 }
     28 
     29 #mount {
     30  height: 100%;
     31 }
     32 
     33 button {
     34  background: transparent;
     35  border: none;
     36  font-family: inherit;
     37  font-size: inherit;
     38 }
     39 
     40 button:hover {
     41  background-color: var(--theme-toolbar-background-hover);
     42 }
     43 
     44 .theme-dark button:hover {
     45  background-color: var(--theme-toolbar-hover);
     46 }
     47 
     48 .debugger {
     49  display: flex;
     50  flex: 1;
     51  height: 100%;
     52 }
     53 
     54 .debugger .tree-indent {
     55  width: 16px;
     56  margin-inline-start: 0;
     57  border-inline-start: 0;
     58 }
     59 
     60 .editor-pane {
     61  display: flex;
     62  position: relative;
     63  flex: 1;
     64  background-color: var(--theme-body-background);
     65  height: 100%;
     66  overflow: hidden;
     67 }
     68 
     69 .editor-container {
     70  width: 100%;
     71  display: grid;
     72  grid-template-areas:
     73    "editor-header"
     74    "editor       "
     75    "notification "
     76    "editor-footer";
     77  grid-template-rows:
     78    var(--editor-header-height)
     79    1fr
     80    auto
     81    var(--editor-footer-height);
     82  max-height: 100%;
     83  overflow-y: auto;
     84  container-type: inline-size;
     85 
     86  .source-header {
     87    width: 100cqw;
     88  }
     89 }
     90 
     91 .editor-notification-footer {
     92  background: var(--theme-warning-background);
     93  border-top: 1px solid var(--theme-warning-border);
     94  color: var(--theme-warning-color);
     95  padding: 0.5em;
     96  gap: 8px;
     97  grid-area: notification;
     98  display: flex;
     99  /* center text within the notification */
    100  align-items: center;
    101 
    102  .info.icon {
    103    align-self: normal;
    104  }
    105 
    106  .close-button {
    107    /* set a fixed height in order to avoid having it flexed to full height */
    108    height: 16px;
    109    padding: 0;
    110    /* put in top-right corner */
    111    margin-inline-start: auto;
    112    align-self: normal;
    113 
    114    &::before {
    115      display: block;
    116      width: 16px;
    117      height: 16px;
    118      content: "";
    119      background-image: url("chrome://devtools/skin/images/close.svg");
    120      fill: var(--theme-icon-color);
    121      -moz-context-properties: fill;
    122    }
    123  }
    124 }
    125 
    126 /* Utils */
    127 .d-flex {
    128  display: flex;
    129 }
    130 
    131 .align-items-center {
    132  align-items: center;
    133 }
    134 
    135 .rounded-circle {
    136  border-radius: 50%;
    137 }
    138 
    139 .text-white {
    140  color: white;
    141 }
    142 
    143 .text-center {
    144  text-align: center;
    145 }
    146 
    147 .min-width-0 {
    148  min-width: 0;
    149 }
    150 
    151 /*
    152  Prevents horizontal scrollbar from displaying when
    153  right pane collapsed (#7505)
    154 */
    155 .split-box > .splitter:last-child {
    156  display: none;
    157 }
    158 
    159 /**
    160 * In RTL layouts, the Debugger UI overlays the splitters. See Bug 1731233.
    161 * Note: we need to the `.debugger` prefix here to beat the specificity of the
    162 * general rule defined in SlitBox.css for `.split-box.vert > .splitter`.
    163 */
    164 .debugger .split-box.vert > .splitter {
    165  border-left-width: var(--devtools-splitter-inline-start-width);
    166  border-right-width: var(--devtools-splitter-inline-end-width);
    167 
    168  margin-left: calc(-1 * var(--devtools-splitter-inline-start-width) - 1px);
    169  margin-right: calc(-1 * var(--devtools-splitter-inline-end-width));
    170 }
    171 
    172 ::-webkit-scrollbar {
    173  width: 8px;
    174  height: 8px;
    175  background: transparent;
    176 }
    177 
    178 ::-webkit-scrollbar-track {
    179  border-radius: 8px;
    180  background: transparent;
    181 }
    182 
    183 ::-webkit-scrollbar-thumb {
    184  border-radius: 8px;
    185  background: rgba(113, 113, 113, 0.5);
    186 }