tor-browser

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

edit-profile-card.css (1590B)

      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 @import url("chrome://browser/content/profiles/profiles-pages.css");
      6 
      7 :host(:not([iscopy])) {
      8  #profile-content {
      9    gap: var(--space-xlarge);
     10  }
     11 }
     12 
     13 #profile-content h1[data-l10n-id="edit-profile-page-header"] {
     14  margin-block: 0;
     15 }
     16 
     17 .avatar-header-content {
     18  display: flex;
     19  flex-direction: column;
     20  gap: var(--space-small);
     21  align-items: center;
     22 
     23  .avatar-selector-parent {
     24    position: relative;
     25  }
     26 
     27  profile-avatar-selector {
     28    position: absolute;
     29    inset-inline-start: -140px;
     30  }
     31 }
     32 
     33 #profile-name-area {
     34  display: flex;
     35  flex-direction: column;
     36  gap: var(--space-xsmall);
     37 }
     38 
     39 #profile-name-area label {
     40  margin-bottom: var(--space-xsmall);
     41 }
     42 
     43 #profile-name {
     44  width: min(400px, 100%);
     45  margin: 0;
     46 
     47  &:invalid {
     48    border-color: var(--outline-color-error);
     49    outline-color: var(--outline-color-error);
     50  }
     51 }
     52 
     53 .message {
     54  display: inline-flex;
     55  gap: var(--space-xsmall);
     56  padding: var(--space-xsmall);
     57 
     58  &[hidden] {
     59    display: none;
     60  }
     61 
     62  > .message-icon {
     63    -moz-context-properties: fill, stroke;
     64    fill: currentColor;
     65    stroke: currentColor;
     66    align-self: center;
     67  }
     68 }
     69 
     70 #error-icon,
     71 #error-message {
     72  color: var(--icon-color-critical);
     73 }
     74 
     75 #saved-icon {
     76  color: var(--icon-color-success);
     77 }
     78 
     79 .avatar-item {
     80  --visual-picker-item-border-radius: var(--border-radius-circle);
     81 }
     82 
     83 .theme-item {
     84  --visual-picker-item-border-radius: 10px;
     85 }