css/crm.designer.css

   1 .crm-profile-selector {
   2     display: none;
   3 }
   4 .crm-profile-selector-preview-pane {
   5     width: 75%;
   6     min-width: 500px;
   7     height: 20em;
   8     border: 1px solid black;
   9     padding: 4px;
  10 }
  11
  12 .crm-designer-toolbar {
  13   width: 290px;
  14   position: absolute;
  15   top: 0;
  16   right: 0;
  17 }
  18
  19 .crm-designer-toolbar hr,
  20 .crm-designer-palette-search {
  21   margin: 0.5em 0;
  22 }
  23
  24 .crm-designer-toolbar .ui-resizable-w {
  25   border-left: 4px dotted #BFBFBF;
  26   cursor: ew-resize;
  27   height: 50px;
  28   top: 45%;
  29 }
  30
  31 .crm-designer-toolbar .ui-resizable-w:hover {
  32   border-left: 4px dotted #6B6B6B;
  33 }
  34
  35 .crm-designer-palette {
  36   height: 20em;
  37 }
  38
  39 .crm-designer-palette-section > a {
  40   font-weight: bold;
  41 }
  42
  43 .crm-designer-palette .crm-designer-palette-field,
  44 .crm-designer-palette .crm-designer-palette-field.disabled:hover {
  45   padding: 1px;
  46   border: 1px dashed transparent;
  47   background-color: transparent;
  48   margin-right: 0.5em;
  49 }
  50
  51 .crm-designer-palette .crm-designer-palette-field a {
  52   cursor: move;
  53 }
  54
  55 .crm-designer-palette .crm-designer-palette-field.disabled a {
  56   cursor: default;
  57 }
  58
  59 .crm-designer-palette .crm-designer-palette-field:hover,
  60 .crm-designer-fields-region .crm-designer-row:hover,
  61 .crm-designer-open .crm-designer-row,
  62 .crm-designer-row-placeholder {
  63   border: 1px dashed gray;
  64   cursor: move;
  65   background-color: #E9E9F5;
  66 }
  67
  68 .crm-container .crm-designer-palette .crm-designer-palette-tree a {
  69   color: #222;
  70   font-style: normal;
  71 }
  72
  73 .crm-container .crm-designer-palette .disabled a,
  74 .crm-designer-palette .crm-designer-palette-tree .disabled a.jstree-search {
  75   color: #999;
  76 }
  77
  78 .crm-designer-palette .jstree-leaf ins {
  79   width: 6px;
  80 }
  81
  82 /* Cancel hovering affect from JSTree theme -- we already do this! */
  83 .crm-designer-palette .crm-designer-palette-tree .jstree-hovered {
  84   background: transparent;
  85   border: 1px transparent;
  86   padding: 1px 2px 0 2px;
  87 }
  88
  89 .crm-designer-canvas {
  90   padding-right: 1em;
  91   margin-right: 300px;
  92 }
  93
  94 .crm-designer-buttonset-region {
  95   text-align: center;
  96   margin: auto;
  97 }
  98
  99 .crm-designer-field-binding {
 100   border: 1px inset black;
 101   padding: 0.4em;
 102   background: #ccc;
 103 }
 104
 105 .crm-designer-fields {
 106   min-width:100px;
 107   /* to allow dropping in big whitespace, coordinate with min-height of dialog */
 108   min-height:500px;
 109 }
 110
 111 .crm-designer-duplicate .crm-designer-row {
 112   background: #fbb;
 113 }
 114
 115 .crm-designer-duplicate .field-location_type_id,
 116 .crm-designer-duplicate .field-phone_type_id {
 117   color: #f00;
 118 }
 119
 120 .crm-designer-row .crm-designer-buttons {
 121   right: 5px;
 122   top: 5px;
 123   position: absolute;
 124   height: 20px;
 125 }
 126
 127 .crm-designer-fields-region .crm-designer-buttons {
 128   display: none;
 129 }
 130
 131 .crm-designer-fields-region .crm-designer-open .crm-designer-buttons,
 132 .crm-designer-row:hover .crm-designer-buttons {
 133   display: block;
 134 }
 135
 136 .crm-designer-row .crm-designer-buttons a {
 137   cursor: pointer;
 138   display: inline-block;
 139   border-radius: 4px;
 140   border: 1px solid #D7D7D7;
 141 }
 142
 143 .crm-designer-row .crm-designer-buttons a:hover,
 144 .crm-designer button:hover {
 145   box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
 146 }
 147
 148 .crm-designer .crm-designer-palette-add button {
 149   font-size: .8em;
 150 }
 151
 152 .crm-designer .crm-designer-palette-add span.ui-button-text {
 153   padding: 0.4em;
 154 }
 155
 156 .ui-sortable-helper > .crm-designer-row {
 157   box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
 158   opacity: 0.75;
 159 }
 160
 161 .crm-designer-row .crm-designer-buttons a.crm-designer-action-settings:hover {
 162   background-color: #71D46E;
 163 }
 164
 165 .crm-designer-row .crm-designer-buttons a.crm-designer-action-remove:hover {
 166   background-color: #F19489;
 167 }
 168
 169 .crm-designer-row,
 170 .crm-designer-row-placeholder {
 171   border: 1px dashed transparent;
 172   padding: 0.3em;
 173   margin: auto;
 174   position: relative;
 175 }
 176
 177 .crm-designer-row-label {
 178   padding: 0.5em 0px;
 179 }
 180
 181 .crm-designer-label {
 182   font-weight: bold;
 183 }
 184
 185 .crm-designer-row-placeholder {
 186   visibility: visible !important;
 187   height: 2em;
 188 }
 189
 190 .crm-designer-dialog .description {
 191   margin: 0px 2em 0px 0px;
 192 }
 193
 194 .crm-designer-dialog .disabled .description {
 195   display: none;
 196 }
 197
 198 .crm-designer-dialog li.crm-designer-row-placeholder,
 199 .crm-designer-dialog li.ui-draggable-dragging,
 200 .crm-designer-dialog .bbf-form ul {
 201   list-style-image: none;
 202   list-style: none;
 203 }
 204
 205 .ui-dialog .crm-designer-dialog.ui-dialog-content {
 206   overflow: visible;
 207   padding-right: .25em;
 208 }
 209
 210 .crm-designer-dialog .full-height {
 211   height: 100%;
 212 }
 213
 214 .crm-designer {
 215   position: relative;
 216 }
 217
 218 .crm-profile-selector-preview-pane,
 219 .crm-designer-dialog .crm-designer .scroll {
 220   overflow-x: auto;
 221   overflow-y: scroll;
 222 }
 223
 224 .ui-dialog {
 225   border: 1px solid #444;
 226   box-shadow: 0 0 12px rgba(0, 0, 0, 0.3);
 227 }
 228
 229 /* Hide annoying 'preview' message */
 230 .crm-profile-selector-preview-pane > div.messages.status.info {
 231   display: none;
 232 }