www.aleph1.co.uk Git - yaffs-website/blob - web/core/modules/outside_in/css/outside_in.form.css

   1 /**
   2  * @file
   3  * Visual styling for forms in the Settings Tray module's off canvas tray.
   4  */
   5
   6 .ui-dialog-outside-in label {
   7   line-height: normal;
   8   font-size: 12px;
   9   font-weight: normal;
  10   color: #ddd;
  11 }
  12 .ui-dialog-outside-in .description,
  13 .ui-dialog-outside-in .form-item .description,
  14 .ui-dialog-outside-in .details-description {
  15   color: #ddd;
  16   margin-top: 5px;
  17   font-size: 12px;
  18   font-style: normal;
  19 }
  20 .ui-dialog-outside-in .details-wrapper .description {
  21   color: #bbb;
  22 }
  23 .ui-dialog-outside-in .form-item {
  24   margin-bottom: 10px;
  25   margin-top: 10px;
  26 }
  27 /* Set size and position for all inputs. */
  28 .ui-dialog-outside-in .form-select,
  29 .ui-dialog-outside-in .form-text,
  30 .ui-dialog-outside-in .form-tel,
  31 .ui-dialog-outside-in .form-email,
  32 .ui-dialog-outside-in .form-url,
  33 .ui-dialog-outside-in .form-search,
  34 .ui-dialog-outside-in .form-number,
  35 .ui-dialog-outside-in .form-color,
  36 .ui-dialog-outside-in .form-file,
  37 .ui-dialog-outside-in .form-textarea,
  38 .ui-dialog-outside-in .form-date,
  39 .ui-dialog-outside-in .form-time {
  40   box-sizing: border-box;
  41   max-width: 100%;
  42   padding: 6px;
  43   margin-top: 5px;
  44   margin-right: 0;
  45   margin-bottom: 0;
  46   margin-left: 0;
  47   border-width: 1px;
  48   border-radius: 2px;
  49   outline: 0;
  50   display: block;
  51   font-size: 14px;
  52   line-height: 16px;
  53   cursor: pointer;
  54 }
  55 /* Reduce contrast for fields against dark backround. */
  56 .ui-dialog-outside-in .form-text,
  57 .ui-dialog-outside-in .form-tel,
  58 .ui-dialog-outside-in .form-email,
  59 .ui-dialog-outside-in .form-url,
  60 .ui-dialog-outside-in .form-search,
  61 .ui-dialog-outside-in .form-number,
  62 .ui-dialog-outside-in .form-color,
  63 .ui-dialog-outside-in .form-file,
  64 .ui-dialog-outside-in .form-textarea,
  65 .ui-dialog-outside-in .form-date,
  66 .ui-dialog-outside-in .form-time {
  67   box-shadow: inset 0 1px 2px rgba(0, 0, 0, .125);
  68   background-color: #eee;
  69   border-color: #333;
  70   color: #595959;
  71 }
  72 .ui-dialog-outside-in .form-text:focus,
  73 .ui-dialog-outside-in .form-tel:focus,
  74 .ui-dialog-outside-in .form-email:focus,
  75 .ui-dialog-outside-in .form-url:focus,
  76 .ui-dialog-outside-in .form-search:focus,
  77 .ui-dialog-outside-in .form-number:focus,
  78 .ui-dialog-outside-in .form-color:focus,
  79 .ui-dialog-outside-in .form-file:focus,
  80 .ui-dialog-outside-in .form-textarea:focus,
  81 .ui-dialog-outside-in .form-date:focus,
  82 .ui-dialog-outside-in .form-time:focus {
  83   border-color: #40b6ff;
  84   box-shadow: inset 0 1px 3px rgba(0, 0, 0, .125), 0 0 8px #40b6ff;
  85   background-color: #fff;
  86 }
  87 .ui-dialog-outside-in input[type="checkbox"],
  88 .ui-dialog-outside-in .checkbox,
  89 .ui-dialog-outside-in input[type="radio"],
  90 .ui-dialog-outside-in .radio {
  91   position: static;
  92   margin: 0;
  93 }
  94 .ui-dialog-outside-in td .checkbox {
  95   display: table-cell;
  96   line-height: normal;
  97   vertical-align: middle;
  98 }
  99 .ui-dialog-outside-in .form-checkbox,
 100 .ui-dialog-outside-in .form-radio {
 101   /* Add contrast for dark background. */
 102   box-shadow: 0 0 2px 1px #000;
 103 }
 104 .ui-dialog-outside-in input[type="radio"] {
 105   /* Add full circular radius. */
 106   border-radius: 50%;
 107 }
 108 .ui-dialog-outside-in .form-actions {
 109   text-align: center;
 110 }