aleph1.co.uk Git - yaffs-website/blob - web/core/themes/stable/css/node/node.module.css

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