|
Chris@0
|
1 /**
|
|
Chris@0
|
2 * @file
|
|
Chris@0
|
3 * Styles for administration pages.
|
|
Chris@0
|
4 */
|
|
Chris@0
|
5
|
|
Chris@0
|
6 /**
|
|
Chris@0
|
7 * Node add/edit form layout
|
|
Chris@0
|
8 */
|
|
Chris@0
|
9
|
|
Chris@0
|
10 /* Narrow screens */
|
|
Chris@0
|
11 .layout-region {
|
|
Chris@14
|
12 box-sizing: border-box;
|
|
Chris@0
|
13 }
|
|
Chris@0
|
14
|
|
Chris@0
|
15 /* Wide screens */
|
|
Chris@0
|
16 @media
|
|
Chris@0
|
17 screen and (min-width: 780px),
|
|
Chris@0
|
18 (orientation: landscape) and (min-device-height: 780px) {
|
|
Chris@0
|
19
|
|
Chris@0
|
20 .layout-region-node-main,
|
|
Chris@0
|
21 .layout-region-node-footer {
|
|
Chris@0
|
22 float: left; /* LTR */
|
|
Chris@18
|
23 box-sizing: border-box;
|
|
Chris@0
|
24 width: 65%;
|
|
Chris@0
|
25 padding-right: 2em; /* LTR */
|
|
Chris@0
|
26 }
|
|
Chris@0
|
27
|
|
Chris@0
|
28 [dir="rtl"] .layout-region-node-main,
|
|
Chris@0
|
29 [dir="rtl"] .layout-region-node-footer {
|
|
Chris@0
|
30 float: right;
|
|
Chris@18
|
31 padding-right: 0;
|
|
Chris@0
|
32 padding-left: 2em;
|
|
Chris@0
|
33 }
|
|
Chris@0
|
34
|
|
Chris@0
|
35 .layout-region-node-secondary {
|
|
Chris@0
|
36 float: right; /* LTR */
|
|
Chris@0
|
37 width: 35%;
|
|
Chris@0
|
38 }
|
|
Chris@0
|
39
|
|
Chris@0
|
40 [dir="rtl"] .layout-region-node-secondary {
|
|
Chris@0
|
41 float: left;
|
|
Chris@0
|
42 }
|
|
Chris@0
|
43
|
|
Chris@0
|
44 /* @todo File an issue to add a standard class to all text-like inputs */
|
|
Chris@0
|
45 .layout-region-node-secondary .form-autocomplete,
|
|
Chris@0
|
46 .layout-region-node-secondary .form-text,
|
|
Chris@0
|
47 .layout-region-node-secondary .form-tel,
|
|
Chris@0
|
48 .layout-region-node-secondary .form-email,
|
|
Chris@0
|
49 .layout-region-node-secondary .form-url,
|
|
Chris@0
|
50 .layout-region-node-secondary .form-search,
|
|
Chris@0
|
51 .layout-region-node-secondary .form-number,
|
|
Chris@0
|
52 .layout-region-node-secondary .form-color,
|
|
Chris@0
|
53 .layout-region-node-secondary textarea {
|
|
Chris@14
|
54 box-sizing: border-box;
|
|
Chris@0
|
55 width: 100%;
|
|
Chris@0
|
56 max-width: 100%;
|
|
Chris@0
|
57 }
|
|
Chris@0
|
58 }
|
|
Chris@0
|
59
|
|
Chris@0
|
60 /**
|
|
Chris@0
|
61 * The vertical toolbar mode gets triggered for narrow screens, which throws off
|
|
Chris@0
|
62 * the intent of media queries written for the viewport width. When the vertical
|
|
Chris@0
|
63 * toolbar is on, we need to suppress layout for the original media width + the
|
|
Chris@0
|
64 * toolbar width (240px). In this case, 240px + 780px.
|
|
Chris@0
|
65 */
|
|
Chris@0
|
66 @media
|
|
Chris@0
|
67 screen and (max-width: 1020px) {
|
|
Chris@0
|
68
|
|
Chris@0
|
69 .toolbar-vertical.toolbar-tray-open .layout-region-node-main,
|
|
Chris@0
|
70 .toolbar-vertical.toolbar-tray-open .layout-region-node-footer,
|
|
Chris@0
|
71 .toolbar-vertical.toolbar-tray-open .layout-region-node-secondary {
|
|
Chris@0
|
72 float: none;
|
|
Chris@0
|
73 width: auto;
|
|
Chris@0
|
74 padding-right: 0;
|
|
Chris@0
|
75 }
|
|
Chris@0
|
76 }
|
