Commit | Line | Data |
---|---|---|
9099c61d RK |
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/. */ | |
319c6529 | 4 | |
fa703ff4 | 5 | @import url("chrome://global/skin/in-content/common.css"); |
319c6529 | 6 | |
fa703ff4 RK |
7 | body { |
8 | display: flex; | |
9 | box-sizing: border-box; | |
10 | min-height: 100vh; | |
11 | padding: 0 48px; | |
12 | align-items: center; | |
13 | justify-content: center; | |
319c6529 RK |
14 | } |
15 | ||
fa703ff4 RK |
16 | #errorPageContainer { |
17 | position: relative; | |
18 | min-width: 320px; | |
19 | max-width: 512px; | |
319c6529 RK |
20 | } |
21 | ||
fa703ff4 RK |
22 | #errorTitle { |
23 | background: url("chrome://browser/skin/cert-error.svg") left 0 no-repeat; | |
24 | background-size: 3em; | |
25 | margin-inline-start: -5em; | |
26 | padding-inline-start: 5em; | |
319c6529 RK |
27 | } |
28 | ||
fa703ff4 RK |
29 | #errorTitle:-moz-dir(rtl) { |
30 | background-position: right 0; | |
319c6529 RK |
31 | } |
32 | ||
fa703ff4 RK |
33 | #errorTitleText { |
34 | border-bottom: 1px solid #A09090; | |
35 | padding-bottom: 0.4em; | |
319c6529 RK |
36 | } |
37 | ||
fa703ff4 RK |
38 | @media (max-width: 675px) { |
39 | #errorTitle { | |
40 | padding-top: 0; | |
41 | background-image: none; | |
42 | margin-inline-start: 0; | |
43 | padding-inline-start: 0; | |
44 | } | |
319c6529 RK |
45 | } |
46 | ||
fa703ff4 RK |
47 | #buttonContainer { |
48 | display: flex; | |
49 | flex-flow: row wrap; | |
319c6529 RK |
50 | } |
51 | ||
fa703ff4 RK |
52 | #buttonSpacer { |
53 | flex: 1; | |
319c6529 RK |
54 | } |
55 | ||
fa703ff4 RK |
56 | /* Pressing the retry button will cause the cursor to flicker from a pointer to |
57 | * not-allowed. Override the disabled cursor behaviour since we will never show | |
58 | * the button disabled as the initial state. Remove this in Bug 1219861. */ | |
59 | button:disabled { | |
60 | cursor: pointer; | |
8b5fc82e RK |
61 | } |
62 | ||
fa703ff4 RK |
63 | #returnButton { |
64 | background-color: var(--in-content-primary-button-background); | |
8d7ef0d9 | 65 | border: none; |
fa703ff4 RK |
66 | color: var(--in-content-selected-text); |
67 | min-width: 250px; | |
68 | margin-inline-start: 0; | |
69 | } | |
70 | ||
71 | #returnButton:hover { | |
72 | background-color: var(--in-content-primary-button-background-hover) !important; | |
319c6529 RK |
73 | } |
74 | ||
fa703ff4 RK |
75 | #returnButton:hover:active { |
76 | background-color: var(--in-content-primary-button-background-active) !important; | |
319c6529 RK |
77 | } |
78 | ||
fa703ff4 RK |
79 | #advancedButton { |
80 | min-width: 150px; | |
319c6529 RK |
81 | } |
82 | ||
fa703ff4 RK |
83 | /* Advanced section is hidden via inline styles until the link is clicked */ |
84 | #advancedPanel { | |
85 | background-color: #000000; | |
86 | color: var(--in-content-text-color); | |
87 | border: 1px #A09090 solid; | |
88 | /* Don't use top padding because the default p style has top padding, and it | |
89 | * makes the overall div look uneven */ | |
90 | padding: 0 12px 10px; | |
91 | margin-top: 10px; | |
92 | /* box-shadow: 0 0 4px #ddd;*/ | |
93 | font-size: 0.9em; | |
319c6529 RK |
94 | } |
95 | ||
fa703ff4 RK |
96 | .hostname { |
97 | font-weight: bold; | |
319c6529 | 98 | } |