Chris@0
|
1 /**
|
Chris@0
|
2 * @file
|
Chris@0
|
3 * Maintenance theming.
|
Chris@0
|
4 */
|
Chris@0
|
5
|
Chris@0
|
6 .maintenance-page {
|
Chris@18
|
7 min-height: 100%;
|
Chris@0
|
8 background-color: #e0e0d8;
|
Chris@0
|
9 background-image: -webkit-radial-gradient(hsl(203, 2%, 90%), hsl(203, 2%, 95%));
|
Chris@0
|
10 background-image: radial-gradient(hsl(203, 2%, 90%), hsl(203, 2%, 95%));
|
Chris@0
|
11 background-repeat: repeat;
|
Chris@0
|
12 background-position: left top, 50% 50%; /* LTR */
|
Chris@0
|
13 }
|
Chris@0
|
14 [dir="rtl"] .maintenance-page {
|
Chris@0
|
15 background-position: right top, 50% 50%;
|
Chris@0
|
16 }
|
Chris@0
|
17
|
Chris@0
|
18 .page-title {
|
Chris@18
|
19 word-wrap: break-word;
|
Chris@18
|
20 color: #0074bd;
|
Chris@0
|
21 font-size: 2em;
|
Chris@0
|
22 line-height: 1.2em;
|
Chris@0
|
23 }
|
Chris@0
|
24
|
Chris@0
|
25 /**
|
Chris@0
|
26 * Task list & step indicator
|
Chris@0
|
27 */
|
Chris@0
|
28 @media all and (max-width: 48em) { /* 768px */
|
Chris@0
|
29 header[role="banner"] {
|
Chris@0
|
30 position: relative;
|
Chris@0
|
31 }
|
Chris@0
|
32 .step-indicator {
|
Chris@0
|
33 position: absolute;
|
Chris@0
|
34 top: 0.2em;
|
Chris@0
|
35 right: 0.5em; /* LTR */
|
Chris@18
|
36 display: block;
|
Chris@18
|
37 font-size: 1.385em;
|
Chris@0
|
38 }
|
Chris@0
|
39 [dir="rtl"] .step-indicator {
|
Chris@18
|
40 right: auto;
|
Chris@0
|
41 left: 0.5em;
|
Chris@0
|
42 }
|
Chris@0
|
43 .task-list {
|
Chris@0
|
44 display: none;
|
Chris@0
|
45 }
|
Chris@0
|
46 }
|
Chris@0
|
47
|
Chris@0
|
48 @media all and (min-width: 48em) { /* 768px */
|
Chris@0
|
49 .step-indicator {
|
Chris@0
|
50 display: none;
|
Chris@0
|
51 }
|
Chris@0
|
52 .task-list {
|
Chris@0
|
53 margin-left: 0; /* LTR */
|
Chris@18
|
54 padding-bottom: 1em;
|
Chris@18
|
55 padding-left: 0; /* LTR */
|
Chris@0
|
56 list-style-type: none;
|
Chris@0
|
57 }
|
Chris@0
|
58 [dir="rtl"] .task-list {
|
Chris@0
|
59 margin-right: 0;
|
Chris@0
|
60 padding-right: 0;
|
Chris@0
|
61 }
|
Chris@0
|
62 .task-list li {
|
Chris@0
|
63 padding: 0.5em 1em 0.5em 3.85em; /* LTR */
|
Chris@0
|
64 color: #1a1a1a;
|
Chris@0
|
65 }
|
Chris@0
|
66 [dir="rtl"] .task-list li {
|
Chris@0
|
67 padding: 0.5em 3.85em 0.5em 1em;
|
Chris@0
|
68 }
|
Chris@0
|
69 .task-list .is-active {
|
Chris@18
|
70 position: relative;
|
Chris@0
|
71 background: #ebeae4;
|
Chris@0
|
72 font-weight: normal;
|
Chris@0
|
73 }
|
Chris@0
|
74 .task-list .is-active:after {
|
Chris@18
|
75 position: absolute;
|
Chris@18
|
76 top: 50%;
|
Chris@0
|
77 left: 100%; /* LTR */
|
Chris@18
|
78 width: 0;
|
Chris@18
|
79 height: 0;
|
Chris@18
|
80 margin-top: -1.269em;
|
Chris@18
|
81 content: " ";
|
Chris@18
|
82 pointer-events: none;
|
Chris@0
|
83 border: solid transparent;
|
Chris@18
|
84 border-width: 1.269em;
|
Chris@0
|
85 border-color: rgba(235, 234, 228, 0);
|
Chris@0
|
86 border-left-color: #ebeae4; /* LTR */
|
Chris@0
|
87 }
|
Chris@0
|
88 [dir="rtl"] .task-list .is-active:after {
|
Chris@18
|
89 right: 100%;
|
Chris@0
|
90 left: auto;
|
Chris@18
|
91 border-right-color: #ebeae4;
|
Chris@0
|
92 border-left-color: transparent;
|
Chris@0
|
93 }
|
Chris@0
|
94 .task-list .done {
|
Chris@0
|
95 color: #adadad;
|
Chris@0
|
96 }
|
Chris@0
|
97 }
|
Chris@0
|
98
|
Chris@0
|
99 /**
|
Chris@0
|
100 * Layout
|
Chris@0
|
101 */
|
Chris@0
|
102 .layout-container {
|
Chris@18
|
103 width: auto;
|
Chris@18
|
104 margin-right: 1.25em;
|
Chris@18
|
105 margin-left: 1.25em;
|
Chris@0
|
106 background: #fff;
|
Chris@0
|
107 }
|
Chris@0
|
108 .layout-container:after { /* no reason for a clearfix in the markup */
|
Chris@0
|
109 display: table;
|
Chris@0
|
110 clear: both;
|
Chris@18
|
111 content: "";
|
Chris@0
|
112 }
|
Chris@14
|
113
|
Chris@0
|
114 @media all and (max-width: 48em) { /* 768px */
|
Chris@0
|
115 .layout-container {
|
Chris@0
|
116 margin: 1.25em;
|
Chris@0
|
117 padding: 10px 20px;
|
Chris@0
|
118 }
|
Chris@0
|
119 .page-title {
|
Chris@0
|
120 margin-right: 2em; /* LTR */
|
Chris@0
|
121 margin-bottom: 0.725em;
|
Chris@0
|
122 }
|
Chris@0
|
123 [dir="rtl"] .page-title {
|
Chris@0
|
124 margin-right: 0;
|
Chris@0
|
125 margin-left: 2em;
|
Chris@0
|
126 }
|
Chris@0
|
127 }
|
Chris@0
|
128
|
Chris@0
|
129 @media all and (min-width: 48em) { /* 768px */
|
Chris@0
|
130 html {
|
Chris@0
|
131 display: table;
|
Chris@0
|
132 }
|
Chris@0
|
133 .install-page,
|
Chris@0
|
134 .maintenance-page {
|
Chris@0
|
135 display: table-cell;
|
Chris@0
|
136 padding: 1em 0;
|
Chris@0
|
137 vertical-align: middle;
|
Chris@0
|
138 }
|
Chris@0
|
139 html,
|
Chris@0
|
140 .install-page,
|
Chris@0
|
141 .maintenance-page {
|
Chris@0
|
142 width: 100%;
|
Chris@0
|
143 height: 100%;
|
Chris@18
|
144 margin: 0;
|
Chris@0
|
145 }
|
Chris@0
|
146 .layout-container {
|
Chris@0
|
147 width: 75%;
|
Chris@0
|
148 max-width: 770px;
|
Chris@18
|
149 margin: 0 auto;
|
Chris@18
|
150 padding: 20px 0 40px 0;
|
Chris@0
|
151 border-radius: 5px;
|
Chris@0
|
152 box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
|
Chris@0
|
153 }
|
Chris@0
|
154
|
Chris@0
|
155 /* Positioning sidebar & content */
|
Chris@0
|
156 main {
|
Chris@18
|
157 float: left; /* LTR */
|
Chris@18
|
158 clear: none;
|
Chris@0
|
159 box-sizing: border-box;
|
Chris@18
|
160 width: 65%;
|
Chris@18
|
161 padding-right: 3.85em;
|
Chris@0
|
162 padding-left: 3.85em;
|
Chris@0
|
163 }
|
Chris@0
|
164 [dir="rtl"] main {
|
Chris@0
|
165 float: right;
|
Chris@0
|
166 }
|
Chris@0
|
167 ul {
|
Chris@18
|
168 margin: 0.25em 0;
|
Chris@0
|
169 padding: 15px;
|
Chris@0
|
170 }
|
Chris@0
|
171 [dir="rtl"] ul {
|
Chris@0
|
172 margin-right: 0; /* Overrides default [dir="rtl"] ul margin */
|
Chris@0
|
173 }
|
Chris@0
|
174 .layout-sidebar-first {
|
Chris@0
|
175 float: left; /* LTR */
|
Chris@0
|
176 width: 35%;
|
Chris@0
|
177 }
|
Chris@0
|
178 [dir="rtl"] .layout-sidebar-first {
|
Chris@0
|
179 float: right;
|
Chris@0
|
180 }
|
Chris@0
|
181
|
Chris@0
|
182 /* Margins for sitename */
|
Chris@0
|
183 .page-title {
|
Chris@0
|
184 margin: 0.75em 1.9em;
|
Chris@0
|
185 }
|
Chris@0
|
186 }
|
Chris@0
|
187
|
Chris@0
|
188 /**
|
Chris@0
|
189 * Status report customization for install and update page.
|
Chris@0
|
190 */
|
Chris@0
|
191 .system-status-report__status-title {
|
Chris@0
|
192 float: none;
|
Chris@0
|
193 width: 100%;
|
Chris@0
|
194 }
|
Chris@0
|
195 .system-status-report__entry__value {
|
Chris@0
|
196 float: none;
|
Chris@0
|
197 width: 100%;
|
Chris@18
|
198 padding-top: 0;
|
Chris@0
|
199 padding-left: 3em; /* LTR */
|
Chris@0
|
200 }
|
Chris@0
|
201 [dir="rtl"] .system-status-report__entry__value {
|
Chris@18
|
202 padding-right: 3em;
|
Chris@0
|
203 padding-left: 1em;
|
Chris@0
|
204 }
|