PluginProbe
Sharing Image / 2.0.3
Sharing Image v2.0.3
3.10 trunk 2.0 2.0.0 2.0.1 2.0.10 2.0.11 2.0.12 2.0.13 2.0.14 2.0.15 2.0.16 2.0.17 2.0.2 2.0.3 2.0.4 2.0.5 2.0.6 2.0.7 2.0.8 2.0.9 3.0 3.1 3.2 3.3 All 29 releases
sharing-image / assets / styles / settings.css

settings.css in Sharing Image 2.0.3, at assets/styles/settings.css

819 lines 40.0 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 input[type="range"] {
2 -webkit-appearance: none;
3 -moz-appearance: none;
4 appearance: none;
5 background: transparent; }
6 input[type="range"]:focus {
7 outline: none; }
8 input[type="range"]::-webkit-slider-runnable-track {
9 cursor: pointer;
10 width: 100%;
11 height: 7px;
12 background: #dddddd;
13 border-radius: 4px;
14 border: solid 1px #b7b7b7; }
15 input[type="range"]::-webkit-slider-thumb {
16 cursor: pointer;
17 -webkit-appearance: none;
18 appearance: none;
19 width: 16px;
20 height: 16px;
21 margin-top: -5.5px;
22 background: #3582c4;
23 border: 0;
24 border-radius: 50%; }
25 input[type="range"]:focus::-webkit-slider-thumb {
26 background: #2a679c; }
27 input[type="range"]:hover::-webkit-slider-runnable-track {
28 background: #d0d0d0; }
29 input[type="range"]:disabled::-webkit-slider-thumb {
30 cursor: default;
31 background-color: #d0d0d0; }
32 input[type="range"]:disabled::-webkit-slider-runnable-track {
33 cursor: default;
34 background-color: #eaeaea;
35 border: solid 1px #d0d0d0; }
36 input[type="range"]::-moz-range-thumb {
37 cursor: pointer;
38 -moz-appearance: none;
39 appearance: none;
40 width: 16px;
41 height: 16px;
42 margin-top: -5.5px;
43 background: #3582c4;
44 border: 0;
45 border-radius: 50%; }
46 input[type="range"]::-moz-range-track {
47 cursor: pointer;
48 width: 100%;
49 height: 7px;
50 background: #dddddd;
51 border-radius: 4px;
52 border: solid 1px #c4c4c4; }
53 input[type="range"]::-moz-range-progress {
54 cursor: pointer;
55 width: 100%;
56 height: 7px;
57 background: #3582c4;
58 border-radius: 4px;
59 border: solid 1px #3582c4; }
60 input[type="range"]:focus::-moz-range-thumb {
61 background: #2a679c; }
62 input[type="range"]:disabled::-moz-range-thumb {
63 cursor: default;
64 background-color: #d0d0d0; }
65 input[type="range"]:disabled::-moz-range-track {
66 cursor: default;
67 background-color: #eaeaea;
68 border: solid 1px #d0d0d0; }
69 input[type="range"]:disabled::-moz-range-progress {
70 cursor: default;
71 background-color: #eaeaea;
72 border: solid 1px #d0d0d0; }
73 input[type="range"]::-ms-track {
74 cursor: pointer;
75 width: 100%;
76 height: 7px;
77 background: #dddddd;
78 border-radius: 4px;
79 border: solid 1px #c4c4c4; }
80 input[type="range"]::-ms-thumb {
81 cursor: pointer;
82 appearance: none;
83 width: 16px;
84 height: 16px;
85 margin-top: -5.5px;
86 background: #3582c4;
87 border: 0;
88 border-radius: 50%; }
89 input[type="range"]:focus::-ms-thumb {
90 background: #2a679c; }
91 input[type="range"]:disabled::-ms-thumb {
92 cursor: default;
93 background-color: #d0d0d0; }
94 input[type="range"]:disabled::-ms-track {
95 cursor: default;
96 background-color: #eaeaea;
97 border: solid 1px #d0d0d0; }
98
99 @-webkit-keyframes rotate {
100 0% {
101 transform: rotate(0deg); }
102 100% {
103 transform: rotate(360deg); } }
104
105 @keyframes rotate {
106 0% {
107 transform: rotate(0deg); }
108 100% {
109 transform: rotate(360deg); } }
110
111 body.settings_page_sharing-image #wpcontent {
112 padding-left: 0; }
113
114 body.settings_page_sharing-image .update-nag {
115 margin: 20px; }
116 @media screen and (max-width: 782px) {
117 body.settings_page_sharing-image .update-nag {
118 margin: 10px; } }
119
120 body.settings_page_sharing-image #setting-error-sharing-image {
121 display: block;
122 order: -1;
123 width: 1060px;
124 max-width: 100%;
125 margin: 20px 0 0;
126 font-weight: 600;
127 border-top: 1px solid #dcdcde;
128 border-bottom: 1px solid #dcdcde;
129 border-radius: 3px; }
130
131 body.settings_page_sharing-image #sharing-image-settings {
132 display: block;
133 position: relative; }
134 body.settings_page_sharing-image #sharing-image-settings * {
135 box-sizing: border-box; }
136 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog {
137 display: grid;
138 grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
139 grid-gap: 20px;
140 position: relative;
141 width: 1100px;
142 max-width: 100%;
143 padding: 20px; }
144 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog .sharing-image-catalog-card {
145 display: block;
146 position: relative;
147 overflow: hidden;
148 background: #fff;
149 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.125);
150 border: 1px solid #ccd0d4;
151 border-radius: 4px; }
152 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog .sharing-image-catalog-new {
153 display: block;
154 position: relative;
155 padding-top: calc(52.5% + 44px);
156 text-decoration: none;
157 color: #666;
158 border: 2px dashed rgba(0, 0, 0, 0.125);
159 border-radius: 4px; }
160 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog .sharing-image-catalog-new h2 {
161 display: flex;
162 flex-flow: column nowrap;
163 align-items: center;
164 justify-content: center;
165 position: absolute;
166 top: 50%;
167 left: 50%;
168 margin: 0;
169 font-size: 15px;
170 font-weight: 400;
171 color: inherit;
172 transform: translate(-50%, -50%); }
173 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog .sharing-image-catalog-new h2 span {
174 display: block;
175 margin-top: 8px;
176 text-align: center;
177 font-size: 11px;
178 font-weight: normal;
179 font-style: italic; }
180 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog .sharing-image-catalog-new h2::before {
181 content: '+';
182 display: block;
183 font-size: 5rem;
184 font-weight: 400;
185 line-height: 1;
186 opacity: 0.25; }
187 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog .sharing-image-catalog-new:hover {
188 color: #eee;
189 background-color: #3582c4;
190 border: solid 2px #2a679c; }
191 @media screen and (max-width: 782px) {
192 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog .sharing-image-catalog-new {
193 padding-top: calc(52.5% + 54px); } }
194 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog .sharing-image-catalog-preview {
195 display: block;
196 position: relative;
197 margin: 0;
198 padding: 52.5% 0 0;
199 background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYGWO8d+/efwYkoKioiMRjYGBC4WHhUK6A8T8QIJt8//59ZC493AAAQssKpBK4F5AAAAAASUVORK5CYII="); }
200 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog .sharing-image-catalog-preview img {
201 display: block;
202 position: absolute;
203 top: 0;
204 left: 0;
205 width: 100%;
206 height: 100%; }
207 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog .sharing-image-catalog-footer {
208 display: flex;
209 align-items: center;
210 position: relative;
211 height: 48px;
212 padding: 0 15px; }
213 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog .sharing-image-catalog-footer h2 {
214 flex: 1 1 auto;
215 margin-right: 10px;
216 font-size: 15px;
217 overflow: hidden;
218 text-overflow: ellipsis;
219 white-space: nowrap; }
220 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog .sharing-image-catalog-footer .button {
221 margin-bottom: 0; }
222 @media screen and (max-width: 782px) {
223 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog .sharing-image-catalog-footer {
224 height: 54px; } }
225 @media screen and (max-width: 782px) {
226 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog {
227 width: 75%; } }
228 @media screen and (max-width: 600px) {
229 body.settings_page_sharing-image #sharing-image-settings .sharing-image-catalog {
230 width: 100%;
231 grid-template-columns: 1fr; } }
232 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config {
233 display: block;
234 width: 800px;
235 max-width: 100%;
236 padding: 20px; }
237 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config h2 {
238 margin: 12px 0; }
239 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config > * {
240 margin: 24px 0; }
241 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control {
242 display: grid;
243 grid-template-columns: 240px auto;
244 position: relative;
245 width: 100%;
246 max-width: 620px;
247 margin: 40px 0;
248 width: 100%;
249 margin-bottom: 24px; }
250 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control small {
251 margin-top: 6px; }
252 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control h3 {
253 grid-column: 1;
254 margin: 6px 0;
255 font-size: 14px; }
256 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control h4 {
257 margin: 0; }
258 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control h3 ~ * {
259 grid-column: 2;
260 width: 100%; }
261 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control.control-extra h3 + * {
262 margin-bottom: 20px; }
263 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-input {
264 display: block;
265 position: relative; }
266 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-input input {
267 display: block;
268 width: calc(100% - 2px); }
269 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-radio {
270 display: block;
271 position: relative;
272 margin-top: 5px; }
273 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-radio span {
274 -webkit-user-select: none;
275 -moz-user-select: none;
276 -ms-user-select: none;
277 user-select: none; }
278 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-radio input {
279 margin-right: 8px; }
280 @media screen and (max-width: 782px) {
281 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-radio {
282 margin-top: 10px; } }
283 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-select {
284 display: block;
285 position: relative;
286 flex: 1 1 100%; }
287 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-select select {
288 display: block;
289 width: calc(100% - 2px);
290 max-width: none; }
291 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-range {
292 display: block;
293 position: relative;
294 width: 100%; }
295 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-range input {
296 display: block;
297 width: 100%;
298 margin: 8px 0; }
299 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-range em {
300 display: block;
301 cursor: default;
302 position: absolute;
303 right: 2px;
304 top: 0;
305 font-size: 10px;
306 font-style: normal;
307 color: #3582c4; }
308 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-media {
309 display: flex;
310 align-items: center; }
311 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-media a {
312 margin-left: 14px; }
313 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-media button {
314 margin-bottom: 0; }
315 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control .sharing-image-config-control-media small {
316 margin-top: 10px; }
317 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config .sharing-image-config-control-fieldset {
318 display: block;
319 position: relative;
320 width: 100%;
321 margin-bottom: 10px; }
322 body.settings_page_sharing-image #sharing-image-settings .sharing-image-config ~ #setting-error-sharing-image {
323 max-width: 760px; }
324 body.settings_page_sharing-image #sharing-image-settings .sharing-image-content {
325 display: none;
326 flex-flow: column wrap;
327 align-items: center; }
328 body.settings_page_sharing-image #sharing-image-settings .sharing-image-content.content-visible {
329 display: flex; }
330 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor {
331 display: flex;
332 flex-flow: row nowrap;
333 position: relative;
334 width: 1100px;
335 max-width: 100%;
336 padding: 20px; }
337 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-fieldset {
338 display: block;
339 flex: 1 1 auto;
340 margin-right: 48px;
341 margin-bottom: 24px; }
342 @media screen and (max-width: 1023px) {
343 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-fieldset {
344 flex: 0 1 640px;
345 margin-right: 0; } }
346 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control {
347 display: flex;
348 flex-flow: column nowrap;
349 align-items: flex-start;
350 position: relative;
351 margin-bottom: 24px; }
352 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control p {
353 margin: 0 0 5px; }
354 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control p:last-child {
355 margin-bottom: 0; }
356 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control h3, body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control h4 {
357 display: block;
358 cursor: default;
359 width: 100%;
360 margin: 0 0 5px;
361 font-size: 13px;
362 font-weight: 600; }
363 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control small {
364 display: block;
365 cursor: default;
366 width: 100%;
367 margin-top: 6px;
368 font-size: 10.5px;
369 line-height: 1.5; }
370 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-hidden {
371 display: none; }
372 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-compact {
373 width: 300px;
374 max-width: 100%; }
375 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-media {
376 flex-flow: row nowrap;
377 align-items: center; }
378 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-media .button {
379 margin-right: 14px; }
380 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-media .button:disabled ~ * {
381 display: none; }
382 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-reduced {
383 margin-bottom: 14px; }
384 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-sizes {
385 flex-flow: row nowrap; }
386 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-sizes > * {
387 margin-right: 14px; }
388 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-sizes > *:nth-child(2) {
389 margin-right: 54px; }
390 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-sizes > *:last-child {
391 margin-right: 0; }
392 @media screen and (max-width: 782px) {
393 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-sizes {
394 flex-flow: row wrap; }
395 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-sizes > * {
396 width: calc(50% - 7px); }
397 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-sizes > *:first-child {
398 margin-bottom: 14px; }
399 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-sizes > *:nth-child(2) {
400 margin-right: 0;
401 margin-bottom: 14px; } }
402 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-select {
403 flex-flow: row nowrap;
404 align-items: center; }
405 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-select > * {
406 margin-right: 14px; }
407 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-select > *:last-child {
408 margin-right: 0; }
409 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-footer {
410 flex-flow: row nowrap;
411 align-items: center;
412 margin-bottom: 0;
413 padding-top: 20px;
414 border-top: solid 1px #dcdcde; }
415 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-footer > * {
416 margin-right: 28px; }
417 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-footer > *:last-child {
418 margin-right: 0; }
419 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-series {
420 flex-flow: row nowrap; }
421 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-series > *:first-child {
422 margin-right: 54px; }
423 @media screen and (max-width: 782px) {
424 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-series {
425 flex-flow: row wrap; }
426 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-series > * {
427 width: 100%; }
428 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-series > *:first-child {
429 margin-right: 0;
430 margin-bottom: 24px; } }
431 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-upload {
432 flex-flow: row wrap;
433 align-items: flex-end; }
434 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-upload > *:first-child {
435 flex: 1 1 auto;
436 margin-right: 14px; }
437 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-upload > *:nth-child(2) {
438 margin-top: 8px; }
439 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control.control-extend > * {
440 width: 100%; }
441 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-input {
442 display: block;
443 position: relative; }
444 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-input input {
445 display: block;
446 width: calc(100% - 2px); }
447 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-radio {
448 display: block;
449 position: relative;
450 margin-top: 5px; }
451 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-radio span {
452 -webkit-user-select: none;
453 -moz-user-select: none;
454 -ms-user-select: none;
455 user-select: none; }
456 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-radio input {
457 margin-right: 8px; }
458 @media screen and (max-width: 782px) {
459 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-radio {
460 margin-top: 10px; } }
461 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-select {
462 display: block;
463 position: relative;
464 flex: 1 1 100%; }
465 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-select select {
466 display: block;
467 width: calc(100% - 2px);
468 max-width: none; }
469 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-checkbox {
470 display: flex;
471 align-items: center;
472 position: relative;
473 margin-top: 5px; }
474 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-checkbox span {
475 -webkit-user-select: none;
476 -moz-user-select: none;
477 -ms-user-select: none;
478 user-select: none; }
479 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-checkbox input[type="checkbox"] {
480 margin: 0 8px 0 0; }
481 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-textarea {
482 display: block;
483 position: relative; }
484 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-textarea textarea {
485 display: block;
486 width: calc(100% - 2px);
487 min-height: 30px; }
488 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-range {
489 display: block;
490 position: relative;
491 width: 100%; }
492 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-range input {
493 display: block;
494 width: 100%;
495 margin: 8px 0; }
496 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-range em {
497 display: block;
498 cursor: default;
499 position: absolute;
500 right: 2px;
501 top: 0;
502 font-size: 10px;
503 font-style: normal;
504 color: #3582c4; }
505 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-media {
506 display: flex;
507 align-items: center; }
508 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-media a {
509 margin-left: 14px; }
510 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-media button {
511 margin-bottom: 0; }
512 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-media small {
513 margin-top: 10px; }
514 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-color {
515 display: block;
516 position: relative; }
517 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-control .sharing-image-editor-control-color input[type="color"] {
518 cursor: pointer; }
519 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-designer {
520 display: block;
521 position: relative;
522 width: 100%;
523 margin-top: -10px; }
524 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-more {
525 display: block;
526 cursor: pointer;
527 margin: 0;
528 padding: 0;
529 color: #3582c4;
530 background: transparent;
531 border: none;
532 border-bottom: solid 1px;
533 transition: border 0.25s; }
534 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-more:focus {
535 box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, 0.8);
536 outline: 1px solid transparent; }
537 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-more:hover {
538 border-bottom-color: transparent; }
539 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-delete {
540 display: block;
541 cursor: pointer;
542 margin: 0;
543 padding: 0;
544 color: #b32d2e;
545 background: transparent;
546 border: none;
547 border-bottom: solid 1px;
548 text-decoration: none;
549 transition: border 0.25s; }
550 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-delete:focus {
551 box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, 0.8);
552 outline: 1px solid transparent; }
553 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-delete:hover {
554 border-bottom-color: transparent; }
555 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-order {
556 display: block;
557 cursor: pointer;
558 position: absolute;
559 top: 4px;
560 right: 4px;
561 padding: 4px 4px 2px;
562 font-size: 16px;
563 color: #aaa;
564 background: transparent;
565 border: none;
566 transition: color 0.25s; }
567 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-order::after {
568 font-family: dashicons;
569 content: "\f342"; }
570 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-order:hover {
571 color: #777; }
572 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-order:focus {
573 border-color: #007cba;
574 color: #016087;
575 outline: none; }
576 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-layer {
577 display: block;
578 position: relative;
579 margin: 0 0 16px;
580 padding: 12px 10px 16px;
581 background-color: #fff;
582 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
583 border: 1px solid #ccd0d4;
584 border-radius: 4px; }
585 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-layer h2 {
586 display: block;
587 margin: 0 0 10px;
588 padding-right: 20px;
589 font-size: 16px;
590 font-weight: 600; }
591 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-layer h5 {
592 display: block;
593 margin: 0 10px 24px 0;
594 font-size: 13px;
595 font-weight: 400; }
596 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-layer.layer-up {
597 -webkit-animation: 0.5s raise-up;
598 animation: 0.5s raise-up; }
599 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-layer.layer-blink {
600 -webkit-animation: 0.5s blink;
601 animation: 0.5s blink; }
602 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-layer:first-child .sharing-image-editor-order {
603 display: none; }
604 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-monitor {
605 display: block;
606 flex: 0 0 480px;
607 max-width: 100%;
608 order: 2; }
609 @media screen and (max-width: 1279px) {
610 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-monitor {
611 flex: 0 0 400px; } }
612 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-viewport {
613 display: block;
614 position: -webkit-sticky;
615 position: sticky;
616 top: 52px;
617 width: 100%; }
618 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-loader {
619 display: none;
620 position: absolute;
621 top: 0;
622 left: 0;
623 z-index: 2;
624 width: 100%;
625 height: 100%;
626 background-color: rgba(0, 0, 0, 0.75); }
627 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-loader::after {
628 content: " ";
629 display: block;
630 position: absolute;
631 top: 50%;
632 left: 50%;
633 width: 40px;
634 height: 40px;
635 margin-top: -20px;
636 margin-left: -20px;
637 border: 6px solid #999;
638 border-color: #999 transparent #999 transparent;
639 border-radius: 50%;
640 -webkit-animation: rotate 1.2s linear infinite;
641 animation: rotate 1.2s linear infinite; }
642 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-preview {
643 display: block;
644 position: relative;
645 width: 100%;
646 overflow: hidden;
647 border-radius: 3px;
648 box-shadow: 0 0 3px 0 #777;
649 background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYGWO8d+/efwYkoKioiMRjYGBC4WHhUK6A8T8QIJt8//59ZC493AAAQssKpBK4F5AAAAAASUVORK5CYII="); }
650 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-preview img {
651 display: block;
652 -o-object-fit: contain;
653 object-fit: contain;
654 -o-object-position: center;
655 object-position: center;
656 width: 100%;
657 height: auto;
658 max-height: 400px; }
659 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-preview.preview-blank {
660 padding-top: 52.5%; }
661 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-preview.preview-loader .sharing-image-editor-loader {
662 display: block; }
663 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-warning {
664 display: none;
665 position: relative;
666 margin: 12px 0 -6px;
667 padding: 8px 12px;
668 background: #fff;
669 border: 1px solid #c3c4c7;
670 border-left: 4px solid #b32d2e;
671 border-radius: 3px;
672 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.125); }
673 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-warning.warning-visible {
674 display: block; }
675 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-manager {
676 display: flex;
677 align-items: center;
678 flex-flow: row wrap;
679 width: 100%;
680 margin-top: 16px; }
681 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-manager button {
682 margin-right: 14px; }
683 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-manager button:last-child {
684 margin-right: 0; }
685 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-suspend {
686 display: flex;
687 align-items: center;
688 order: 2;
689 margin: 10px 0 10px auto; }
690 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-suspend input {
691 margin: 0 8px 0 0; }
692 @media screen and (max-width: 782px) {
693 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor .sharing-image-editor-suspend {
694 order: 0;
695 width: 100%;
696 margin-bottom: 24px; } }
697 @media screen and (max-width: 1023px) {
698 body.settings_page_sharing-image #sharing-image-settings .sharing-image-editor {
699 flex-flow: row wrap; } }
700 body.settings_page_sharing-image #sharing-image-settings .sharing-image-error {
701 max-width: 760px;
702 margin: 40px auto 20px;
703 color: #b32d2e;
704 text-align: center; }
705 body.settings_page_sharing-image #sharing-image-settings .sharing-image-header {
706 display: block;
707 order: -2;
708 width: 100%;
709 background: #fff;
710 border-top: 1px solid #dcdcde;
711 border-bottom: 1px solid #dcdcde; }
712 body.settings_page_sharing-image #sharing-image-settings .sharing-image-header h1 {
713 display: block;
714 position: relative;
715 margin: 0 0 1rem;
716 padding: 16px 0 4px 0;
717 font-weight: 600;
718 font-size: 23px;
719 line-height: 1.3;
720 text-align: center; }
721 body.settings_page_sharing-image #sharing-image-settings .sharing-image-header .sharing-image-menu {
722 display: flex;
723 justify-content: center;
724 margin: 0 auto; }
725 body.settings_page_sharing-image #sharing-image-settings .sharing-image-header .sharing-image-tab {
726 display: block;
727 margin: 0 1rem;
728 padding: 0.5rem 1rem 1rem;
729 text-decoration: none;
730 color: inherit;
731 transition: box-shadow .5s ease-in-out; }
732 body.settings_page_sharing-image #sharing-image-settings .sharing-image-header .sharing-image-tab:focus-visible {
733 outline: 1px solid #787c82; }
734 body.settings_page_sharing-image #sharing-image-settings .sharing-image-header .sharing-image-tab:focus {
735 box-shadow: none; }
736 body.settings_page_sharing-image #sharing-image-settings .sharing-image-header .sharing-image-tab.active {
737 box-shadow: inset 0 -3px #3582c4;
738 font-weight: 600; }
739 @media screen and (max-width: 767px) {
740 body.settings_page_sharing-image #sharing-image-settings .sharing-image-header .sharing-image-tab {
741 margin: 0 0.5rem;
742 padding: 0.5rem 0.5rem 1rem; } }
743 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium {
744 display: block;
745 width: 800px;
746 max-width: 100%;
747 padding: 20px; }
748 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium h2 {
749 margin: 12px 0; }
750 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium ul {
751 margin-left: 40px;
752 list-style-type: disc; }
753 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium p {
754 margin: 12px 0 0; }
755 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium p:first-child {
756 margin-top: 0; }
757 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium > * {
758 margin: 24px 0; }
759 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-benefits {
760 display: block; }
761 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-gratitude {
762 display: none; }
763 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium.premium-enabled .sharing-image-premium-benefits {
764 display: none; }
765 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium.premium-enabled .sharing-image-premium-gratitude {
766 display: block; }
767 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-contacts {
768 display: block;
769 padding-top: 24px;
770 border-top: solid 1px #ccc; }
771 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-access {
772 display: block; }
773 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-access strong {
774 display: block; }
775 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-access.access-loader .spinner {
776 visibility: visible; }
777 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-verify {
778 display: flex;
779 align-items: center;
780 margin-top: 8px; }
781 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-verify input {
782 flex: 1 1 auto;
783 max-width: 320px; }
784 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-verify button {
785 margin-left: 8px;
786 margin-bottom: 0; }
787 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-verify .spinner {
788 margin: 0 0 0 8px; }
789 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-revoke {
790 display: flex;
791 flex-flow: row wrap;
792 align-items: center;
793 margin: 24px 0; }
794 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-revoke p {
795 width: 100%;
796 margin: 0 0 16px; }
797 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-revoke button {
798 color: #b32d2e;
799 border-color: #b32d2e; }
800 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-revoke .spinner {
801 margin: 0 0 0 8px; }
802 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-permit {
803 display: flex;
804 align-items: center;
805 margin: 24px 0; }
806 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-permit strong {
807 display: none;
808 margin-left: 16px; }
809 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-permit.permit-visible strong {
810 display: block; }
811 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-warning {
812 display: none;
813 position: relative;
814 color: #b32d2e; }
815 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium .sharing-image-premium-warning.warning-visible {
816 display: block; }
817 body.settings_page_sharing-image #sharing-image-settings .sharing-image-premium ~ #setting-error-sharing-image {
818 max-width: 760px; }
819