ca403a07f33608a2d6dff82397001930a1ae69cc
[PrivacyBrowser.git] / app / src / main / assets / css / theme.css
1 /*
2  * Copyright © 2017-2020 Soren Stoutner <soren@stoutner.com>.
3  *
4  * This file is part of Privacy Browser <https://www.stoutner.com/privacy-browser>.
5  *
6  * Privacy Browser is free software: you can redistribute it and/or modify
7  * it under the terms of the GNU General Public License as published by
8  * the Free Software Foundation, either version 3 of the License, or
9  * (at your option) any later version.
10  *
11  * Privacy Browser is distributed in the hope that it will be useful,
12  * but WITHOUT ANY WARRANTY; without even the implied warranty of
13  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
14  * GNU General Public License for more details.
15  *
16  * You should have received a copy of the GNU General Public License
17  * along with Privacy Browser.  If not, see <http://www.gnu.org/licenses/>.
18  */
19
20 /* Dark colors. */
21 @media (prefers-color-scheme: dark) {
22   body {
23     color: #C1C1C1;  /* Gray 350 */
24     background-color: #303030;  /* Gray 860 */
25   }
26 }
27
28 /* Hyperlinks. */
29 a {
30   color: #1976D2;  /* Blue 700 */
31   text-decoration: none;
32 }
33
34 @media (prefers-color-scheme: dark) {
35   a {
36     color: #5785C5;  /* Violet 700 */
37   }
38 }
39
40 /* Headers. */
41 h3 {
42   color: #0D47A1;  /* Blue 900 */
43 }
44
45 @media (prefers-color-scheme: dark) {
46   h3 {
47     color: #8AB4F8;  /* Violet 500 */
48   }
49 }
50
51 /* Red bold text */
52 strong.red {
53   color: #B71C1C;  /* Red 900. */
54 }
55
56 @media (prefers-color-scheme: dark) {
57   strong.red {
58     color: #930606;  /* Red 1100. */
59   }
60 }
61
62 /* Blue bold text */
63 strong.blue {
64   color: #1565C0;  /* Blue 800. */
65 }
66
67 /* List items. */
68 item {
69   color: #1565C0;  /* Blue 800. */
70   font-weight: bold;
71 }
72
73 /* Header images do not allow the icon to be themed. */
74 img.header {
75   vertical-align: bottom;
76   height: 32;
77   width: 32;
78 }
79
80 /* Header SVGs allow the icon to be themed. */
81 svg.header {
82   vertical-align: bottom;
83   height: 32;
84   width: 32;
85   fill: #0D47A1;  /* Blue 900 */
86 }
87
88 @media (prefers-color-scheme: dark) {
89   svg.header {
90     fill: #8AB4F8;  /* Violet 500 */
91   }
92 }
93
94 /* Left aligned images do not allow the icon to be themed. */
95 img.left {
96   float: left;
97   height: 32;
98   width: 32;
99 }
100
101 /* Left aligned SVGs allow the icon to be themed. */
102 svg.left {
103   float: left;
104   height: 32;
105   width: 32;
106   fill: #000000;  /* Black */
107 }
108
109 @media (prefers-color-scheme: dark) {
110   svg.left {
111     fill: #FFFFFF;  /* White */
112   }
113 }
114
115 /* Inline images. */
116 img.inline {
117   height: 16;
118   width: 16;
119 }
120
121 /* SVG icons. */
122 svg.icon {
123   vertical-align: middle;
124   height: 32;
125   width: 32;
126   fill: #000000;  /* Black */
127 }
128
129 @media (prefers-color-scheme: dark) {
130   svg.icon {
131     fill: #FFFFFF;  /* White */
132   }
133 }
134
135 /* Centered screenshot images.  An image must be a block to be centered. */
136 img.center {
137   display: block;
138   margin-left: auto;
139   margin-right: auto;
140   height: 720;
141   width: 360;
142 }