77 lines
1.9 KiB
CSS
77 lines
1.9 KiB
CSS
/**
|
|
* @file
|
|
* Styles for administration pages.
|
|
*/
|
|
|
|
/**
|
|
* Node add/edit form layout
|
|
*/
|
|
|
|
/* Narrow screens */
|
|
.layout-region {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* Wide screens */
|
|
@media
|
|
screen and (min-width: 780px),
|
|
(orientation: landscape) and (min-device-height: 780px) {
|
|
|
|
.layout-region-node-main,
|
|
.layout-region-node-footer {
|
|
float: left; /* LTR */
|
|
box-sizing: border-box;
|
|
width: 65%;
|
|
padding-right: 2em; /* LTR */
|
|
}
|
|
|
|
[dir="rtl"] .layout-region-node-main,
|
|
[dir="rtl"] .layout-region-node-footer {
|
|
float: right;
|
|
padding-right: 0;
|
|
padding-left: 2em;
|
|
}
|
|
|
|
.layout-region-node-secondary {
|
|
float: right; /* LTR */
|
|
width: 35%;
|
|
}
|
|
|
|
[dir="rtl"] .layout-region-node-secondary {
|
|
float: left;
|
|
}
|
|
|
|
/* @todo File an issue to add a standard class to all text-like inputs */
|
|
.layout-region-node-secondary .form-autocomplete,
|
|
.layout-region-node-secondary .form-text,
|
|
.layout-region-node-secondary .form-tel,
|
|
.layout-region-node-secondary .form-email,
|
|
.layout-region-node-secondary .form-url,
|
|
.layout-region-node-secondary .form-search,
|
|
.layout-region-node-secondary .form-number,
|
|
.layout-region-node-secondary .form-color,
|
|
.layout-region-node-secondary textarea {
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
max-width: 100%;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* The vertical toolbar mode gets triggered for narrow screens, which throws off
|
|
* the intent of media queries written for the viewport width. When the vertical
|
|
* toolbar is on, we need to suppress layout for the original media width + the
|
|
* toolbar width (240px). In this case, 240px + 780px.
|
|
*/
|
|
@media
|
|
screen and (max-width: 1020px) {
|
|
|
|
.toolbar-vertical.toolbar-tray-open .layout-region-node-main,
|
|
.toolbar-vertical.toolbar-tray-open .layout-region-node-footer,
|
|
.toolbar-vertical.toolbar-tray-open .layout-region-node-secondary {
|
|
float: none;
|
|
width: auto;
|
|
padding-right: 0;
|
|
}
|
|
}
|