You are here

Home » API reference » CiviCRM Entity 8.3

civicrm_entity.form.css in CiviCRM Entity 8.3

Styles for the CiviCRM entity add/edit form.

Copied from node-module.css

File

css/civicrm_entity.form.css
View source 
  1. /**

  2.  * @file

  3.  * Styles for the CiviCRM entity add/edit form.

  4.  *

  5.  * Copied from node-module.css

  6.  */

  7. 

  8. /* Narrow screens */

  9. .layout-region {

  10.     box-sizing: border-box;

  11.   }

  12. 

  13.   .layout-region-civicrm-entity-footer__content {

  14.       border-top: 1px solid #bebfb9;

  15.       padding-top: 0.5em;

  16.       margin-top: 1.5em;

  17.   }

  18. 

  19.   /* Wide screens */

  20.   @media

  21.     screen and (min-width: 780px),

  22.     (orientation: landscape) and (min-device-height: 780px) {

  23. 

  24.     .layout-region-civicrm-entity-main,

  25.     .layout-region-civicrm-entity-footer {

  26.       float: left; /* LTR */

  27.       width: 65%;

  28.       padding-right: 2em; /* LTR */

  29.       box-sizing: border-box;

  30.     }

  31. 

  32.     .layout-region-civicrm-entity-footer__content {

  33.       margin-top: 0.5em;

  34.     }

  35. 

  36.     [dir="rtl"] .layout-region-civicrm-entity-main,

  37.     [dir="rtl"] .layout-region-civicrm-entity-footer {

  38.       float: right;

  39.       padding-left: 2em;

  40.       padding-right: 0;

  41.     }

  42. 

  43.     .layout-region-civicrm-entity-secondary {

  44.       float: right; /* LTR */

  45.       width: 35%;

  46.     }

  47. 

  48.     [dir="rtl"] .layout-region-civicrm-entity-secondary {

  49.       float: left;

  50.     }

  51. 

  52.     /* @todo File an issue to add a standard class to all text-like inputs */

  53.     .layout-region-civicrm-entity-secondary .form-autocomplete,

  54.     .layout-region-civicrm-entity-secondary .form-text,

  55.     .layout-region-civicrm-entity-secondary .form-tel,

  56.     .layout-region-civicrm-entity-secondary .form-email,

  57.     .layout-region-civicrm-entity-secondary .form-url,

  58.     .layout-region-civicrm-entity-secondary .form-search,

  59.     .layout-region-civicrm-entity-secondary .form-number,

  60.     .layout-region-civicrm-entity-secondary .form-color,

  61.     .layout-region-civicrm-entity-secondary textarea {

  62.       box-sizing:         border-box;

  63.       width: 100%;

  64.       max-width: 100%;

  65.     }

  66.   }

  67. 

  68.   /**

  69.    * The vertical toolbar mode gets triggered for narrow screens, which throws off

  70.    * the intent of media queries written for the viewport width. When the vertical

  71.    * toolbar is on, we need to suppress layout for the original media width + the

  72.    * toolbar width (240px). In this case, 240px + 780px.

  73.    */

  74.   @media

  75.     screen and (max-width: 1020px) {

  76.     .toolbar-vertical.toolbar-tray-open .layout-region-civicrm-entity-main,

  77.     .toolbar-vertical.toolbar-tray-open .layout-region-civicrm-entity-footer,

  78.     .toolbar-vertical.toolbar-tray-open .layout-region-civicrm-entity-secondary {

  79.       float: none;

  80.       width: auto;

  81.       padding-right: 0;

  82.     }

  83.   }