EarlyBlue/global/in-content/info-pages.css

   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://global/skin/in-content/common.css");
   6 /* Body and container */
   7 body {
   8   display: flex;
   9   flex-direction: column;
  10   box-sizing: border-box;
  11   min-height: 100vh;
  12   padding-top: 0;
  13   padding-bottom: 0;
  14   padding-inline-start: calc(48px + 4.6em);
  15   padding-inline-end: 48px;
  16   align-items: center;
  17   justify-content: center;
  18 }
  19
  20 .container {
  21   min-width: 13em;
  22   max-width: 52em;
  23 }
  24
  25 .container.restore-chosen {
  26   display: flex;
  27   flex-direction: column;
  28   flex-grow: 1;
  29   margin: 10vh 0;
  30 }
  31
  32 /* Typography */
  33 .title {
  34   background-image: url("chrome://global/skin/icons/info.svg");
  35   background-position: left 0;
  36   background-repeat: no-repeat;
  37   background-size: 1.6em;
  38   margin-inline-start: -2.3em;
  39   padding-inline-start: 2.3em;
  40   font-size: 2.5em;
  41 }
  42
  43 .title:dir(rtl) {
  44   background-position: right 0;
  45 }
  46
  47 .title-text {
  48   border-bottom: 1px solid #666699;
  49   font-size: inherit;
  50   padding-bottom: 0.4em;
  51 }
  52
  53 @media (max-width: 675px) {
  54   body {
  55     padding: 0 48px;
  56   }
  57
  58   .title {
  59     background-image: none !important;
  60     padding-inline-start: 0;
  61     margin-inline-start: 0;
  62   }
  63
  64   .title-text {
  65     padding-top: 0;
  66   }
  67 }
  68
  69 ul, ol {
  70   margin: 0;
  71   padding: 0;
  72   margin-inline-start: 1em;
  73 }
  74
  75 ul > li, ol > li {
  76   margin-bottom: .5em;
  77 }
  78
  79 ul {
  80   list-style: disc;
  81 }
  82
  83 /* Buttons */
  84 .button-container {
  85   margin-top: 1.2em;
  86 }
  87
  88 .button-container > button {
  89   min-width: 150px;
  90 }
  91
  92 .button-container > button:first-child {
  93   margin-inline-start: 0;
  94 }
  95
  96 /* Trees */
  97 .tree-container {
  98   margin-top: 1.2em;
  99   flex-grow: 1;
 100   min-height: 12em;
 101 }
 102
 103 .tree-container > tree {
 104   height: 100%;
 105 }
 106
 107 tree {
 108   width: 100%;
 109 }