first part of syncing both themes with toolkit windows theme changes in Mozilla 53...
[themes.git] / LCARStrek / 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 #A09090;
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 }