tor-browser

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

fxrui.css (2537B)


      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 @namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
      6 
      7 html,
      8 body {
      9  height: 100%;
     10 }
     11 
     12 body {
     13  display: flex;
     14  flex-direction: column;
     15 }
     16 
     17 .navbar_container {
     18  width: 100%;
     19 
     20  margin-block: 15px;
     21 
     22  display: flex;
     23  flex-direction: row;
     24 }
     25 
     26 /* Sizing and positioning properties for all icons
     27   Color is determined by enabled/disabled classes below
     28 */
     29 .icon_container {
     30  width: 44px;
     31  height: 44px;
     32  margin: 5px;
     33 
     34  border-radius: 22px;
     35  border-width: 2px;
     36  border-style: solid;
     37 
     38  background-size: 22px;
     39  background-repeat: no-repeat;
     40  background-position: center;
     41  background-color: inherit;
     42 
     43  -moz-context-properties: fill;
     44 
     45  transition-property: transform;
     46  transition-duration: 200ms;
     47 }
     48 
     49 .icon_container:hover {
     50  transform: scale(1.25);
     51 }
     52 
     53 .icon_container:disabled {
     54  transform: unset;
     55 }
     56 
     57 .icon_disabled_hide:disabled {
     58  display: none;
     59 }
     60 .icon_backward {
     61  background-image: url("assets/icon-backward.svg");
     62  margin-inline-start: 10px;
     63 }
     64 .icon_forward {
     65  background-image: url("assets/icon-forward.svg");
     66 }
     67 .icon_refresh {
     68  background-image: url("assets/icon-refresh.svg");
     69 }
     70 .icon_stop {
     71  background-image: url("assets/icon-stop-reload.svg");
     72 }
     73 .icon_home {
     74  background-image: url("assets/icon-home.svg");
     75 }
     76 .icon_prefs {
     77  background-image: url("assets/icon-settings.svg");
     78  margin-inline-end: 10px;
     79 }
     80 
     81 .urlbar_container {
     82  height: 40px;
     83  flex-grow: 1;
     84 
     85  padding: 0;
     86  margin: 5px;
     87 
     88  border-radius: 22px;
     89  border: 2px solid transparent;
     90 
     91  vertical-align: top;
     92 
     93  display: flex;
     94  flex-direction: row;
     95 }
     96 
     97 .urlbar_secure_icon {
     98  -moz-context-properties: fill;
     99 
    100  height: 32px;
    101  padding: 2px;
    102 
    103  visibility: hidden;
    104 
    105  display: inline-block;
    106 }
    107 
    108 .urlbar_input {
    109  background-color: transparent;
    110 
    111  flex-grow: 1;
    112 
    113  border: none;
    114 
    115  font-size: 18px;
    116  font-family: "Open Sans", sans-serif;
    117 
    118  mask-image: linear-gradient(to left, transparent, black 8ch);
    119 }
    120 
    121 .browser_container {
    122  width: 100%;
    123  flex-grow: 1;
    124 }
    125 
    126 .browser_instance {
    127  width: 100%;
    128  height: 100%;
    129 }
    130 
    131 /* Hide the navbar when in fullscreen so that <browser> can
    132 * fill the entire viewport
    133 */
    134 :root[inFullScreen] .navbar_container {
    135  display: none;
    136 }
    137 
    138 .browser_settings {
    139  width: 600px;
    140  height: 400px;
    141  border-radius: 20px;
    142 }
    143 
    144 .modal_mask:not([hidden]) {
    145  background-color: var(--num13_alpha);
    146 }