5 #afGuiEditor #afGuiEditor-palette
{
10 #afGuiEditor #afGuiEditor-canvas
{
15 #afGuiEditor .panel-body
{
20 #afGuiEditor fieldset legend
{
23 margin-bottom: 5px !important
;
26 #afGuiEditor-palette fieldset legend
{
35 #afGuiEditor #afGuiEditor-palette-tabs li
{
39 #afGuiEditor #afGuiEditor-palette-tabs li
> a
{
44 #afGuiEditor .af-gui-columns
{
49 #afGuiEditor .af-gui-columns
> * {
54 #afGuiEditor .af-gui-remove-entity
{
60 #afGuiEditor .crm-editable-enabled
,
61 #afGuiEditor-palette-tabs > li
> a
> span
{
62 display: inline-block
;
63 padding: 0 4px !important
;
64 border: 2px solid transparent
!important
;
66 #afGuiEditor .crm-editable-enabled:hover:not
(:focus
) {
67 border: 2px dashed grey
!important
;
69 #afGuiEditor .crm-editable-enabled:before
,
70 #afGuiEditor .crm-editable-enabled:after
{
75 #afGuiEditor-palette-config .af-gui-entity-values
.form-inline
{
79 #afGuiEditor-palette-config .form-inline label
{
83 #afGuiEditor-palette-config .af-gui-entity-palette
[type
=search
] {
85 padding: 3px 3px 3px 5px;
93 #afGuiEditor input
[type
=search
]::placeholder
{
94 font-family: FontAwesome
;
97 #afGuiEditor input
[type
=search
]:-ms-input-placeholder
{
98 font-family: FontAwesome
;
101 #afGuiEditor input
[type
=search
]::-ms-input-placeholder
{
102 font-family: FontAwesome
;
106 #afGuiEditor .af-gui-bar
{
110 transition: opacity
1s 2s;
112 font-family: "Courier New", Courier
, monospace
;
115 #afGuiEditor [ui-sortable
] .af-gui-bar
{
117 background-color: #f2f2f2;
123 #afGuiEditor-canvas:hover
.af-gui-bar
{
125 transition: opacity
.2s;
128 #afGuiEditor .af-gui-bar
.btn
.active
{
129 background-color: #b3b3b3;
132 #afGuiEditor .af-gui-element
{
138 #afGuiEditor .af-gui-container
{
139 border: 2px dashed transparent
;
141 padding: 22px 3px 3px;
146 #afGuiEditor af-gui-markup
,
147 #afGuiEditor af-gui-field
{
151 #afGuiEditor .af-gui-container-type-fieldset
{
152 box-shadow: 0 0 5px #bbbbbb;
155 #afGuiEditor .af-gui-container:hover
{
156 border: 2px dashed
#757575;
159 #afGuiEditor .af-gui-markup
{
160 padding: 22px 3px 3px;
164 #afGuiEditor div
.af-gui-markup-content
{
167 padding: 0 !important
;
170 #afGuiEditor .af-gui-markup-content-overlay
{
178 #afGuiEditor .af-gui-markup-content:hover
.af-gui-markup-content-overlay
{
179 background-color: rgba
(255, 255, 255, .2);
182 #afGuiEditor #afGuiEditor-canvas
.af-entity-selected
{
183 border: 2px dashed
#0071bd;
185 #afGuiEditor #afGuiEditor-canvas
.af-entity-selected
> .af-gui-bar
{
186 background-color: #0071bd;
188 transition: opacity
0s;
190 #afGuiEditor #afGuiEditor-canvas
.af-entity-selected
> .af-gui-bar
> .form-inline
> button
> span
,
191 #afGuiEditor #afGuiEditor-canvas
.af-entity-selected
> .af-gui-bar
> .form-inline
> span
{
194 #afGuiEditor #afGuiEditor-canvas
.af-entity-selected
> .af-gui-bar
> .form-inline
> button:hover
> span
,
195 #afGuiEditor #afGuiEditor-canvas
.af-entity-selected
> .af-gui-bar
> .open
> button
> span
,
196 #afGuiEditor #afGuiEditor-canvas
.af-entity-selected
> .af-gui-bar
> .form-inline
> button:focus
> span
{
200 #afGuiEditor [ui-sortable
] {
204 #afGuiEditor .af-gui-entity-palette-select-list
{
209 #afGuiEditor .af-gui-entity-palette-select-list
[ui-sortable
] > div
{
214 #afGuiEditor .af-gui-entity-palette-select-list
[ui-sortable
] > div
.disabled
{
217 #afGuiEditor .af-gui-entity-palette-select-list
[ui-sortable
] > div:not
(.disabled
):hover
{
218 background-color: #efefef;
221 #afGuiEditor [ui-sortable
] .af-gui-bar:before
,
222 #afGuiEditor .af-gui-entity-palette-select-list
[ui-sortable
] > div:not
(.disabled
):hover:before
,
223 #afGuiEditor [af-gui-edit-options
] [ui-sortable
] li:before
{
224 background-size: cover
;
225 background: url
("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1IiBoZWlnaHQ9IjUiPgo8cmVjdCB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSIjODg4Ij48L3JlY3Q+Cjwvc3ZnPg==");
234 #afGuiEditor .af-gui-add-element-button
{
235 background-color: transparent
;
237 #afGuiEditor .af-gui-add-element-button span
{
238 display: inline-block
;
244 #afGuiEditor .af-gui-layout-icon
{
248 background-image: url
('../images/icons.png');
249 background-repeat: no-repeat
;
252 #afGuiEditor .af-gui-layout-icon
.af-layout-cols
{
253 background-position: -12px 0;
255 #afGuiEditor .af-gui-layout-icon
.af-layout-rows
{
256 background-position: -24px 0;
259 #afGuiEditor .af-gui-layout
.af-layout-cols
{
262 #afGuiEditor .af-gui-layout
.af-layout-cols
> div
{
265 #afGuiEditor .af-gui-layout
.af-layout-inline
> div
{
266 display: inline-block
;
270 #afGuiEditor .af-gui-button
{
274 #afGuiEditor .af-gui-button
> .btn
.disabled
{
275 cursor: default
!important
;
276 color: white
!important
;
278 #afGuiEditor .af-gui-button
> .btn
.disabled
.crm-editable-enabled:hover:not
(:focus
) {
279 border-color: #f4f4f4 !important
;
282 #afGuiEditor .af-gui-button
> .btn-default
.disabled
{
283 background-color: lightgrey
!important
;
286 #afGuiEditor .af-gui-node-title
{
292 #afGuiEditor .af-gui-field-required:after
{
299 #afGuiEditor .dropdown-menu li
{
303 #afGuiEditor .dropdown-menu li
.af-gui-field-select-in-dropdown
{
304 padding: 2px 19px 2px 21px;
307 line-height: 1.5384615385;
312 #afGuiEditor .dropdown-menu li
> * > label
{
317 #afGuiEditor .dropdown-menu li
.af-gui-field-select-in-dropdown
> select
{
323 #afGuiEditor li
.af-gui-field-select-in-dropdown input
[type
=color
] {
328 #afGuiEditor li
.af-gui-field-select-in-dropdown input
[type
=number
] {
333 /* For editing field placeholder text */
334 #afGuiEditor .af-gui-field-input input
[type
=text
].form-control
{
338 #afGuiEditor .af-gui-field-input-type-number input
[type
=text
].form-control
{
339 background-image: url
('../images/number.png');
340 background-repeat: no-repeat
;
341 background-position: center right
6px;
344 #afGuiEditor .af-gui-field-input input
.crm-form-date
{
348 #afGuiEditor .af-gui-field-input input
.crm-form-time
{
352 #afGuiEditor .af-gui-field-input-type-radio label
.radio
{
356 #afGuiEditor .af-gui-field-input-type-radio label
.radio input
[type
=radio
] {
359 #afGuiEditor .af-gui-field-input-type-select
.input-group-btn
{
362 #afGuiEditor .af-gui-field-input-type-chainselect
.input-group
.dropdown-toggle
,
363 #afGuiEditor .af-gui-field-input-type-select
.input-group
.dropdown-toggle
{
366 #afGuiEditor .af-gui-field-input-type-select
.input-group
.dropdown-menu
{
370 #afGuiEditor .af-gui-field-input-type-select
.input-group
.dropdown-menu a
{
374 #afGuiEditor .af-gui-text-h1
{
379 #afGuiEditor .af-gui-text-h2
{
384 #afGuiEditor .af-gui-text-legend
,
385 #afGuiEditor .af-gui-text-h3
{
390 #afGuiEditor .af-gui-text-legend
{
391 text-decoration: underline
;
394 #afGuiEditor .af-gui-text-h4
{
398 #afGuiEditor .af-gui-text-h5
{
402 #afGuiEditor .af-gui-text-h6
{
406 #afGuiEditor .af-gui-field-help
{
410 #afGuiEditor.af-gui-editing-content
{
411 pointer-events: none
;
414 #afGuiEditor.af-gui-editing-content
.panel-heading
,
415 #afGuiEditor.af-gui-editing-content
.af-gui-element
,
416 #afGuiEditor.af-gui-editing-content
.af-gui-markup-content
,
417 .af-gui-editing-content #afGuiEditor-palette .panel-body > * {
420 #afGuiEditor.af-gui-editing-content
.af-gui-container
{
421 border: 2px solid transparent
;
423 #afGuiEditor.af-gui-editing-content
.af-gui-bar
{
426 #afGuiEditor.af-gui-editing-content
.af-gui-bar:before
{
430 #afGuiEditor .af-gui-content-editing-area
{
431 pointer-events: auto
;
437 #afGuiEditor [af-gui-edit-options
] {
438 border: 2px solid
#0071bd;
441 #afGuiEditor .af-gui-content-editing-area
.af-gui-edit-options-bar
{
443 font-family: "Courier New", Courier
, monospace
;
446 background-color: #f2f2f2;
452 #afGuiEditor .af-gui-edit-options-bar
.btn-group-sm
{
457 #afGuiEditor [af-gui-edit-options
] ul
[ui-sortable
] {
460 #afGuiEditor [af-gui-edit-options
] ul
[ui-sortable
] li
{
464 background-color:#e7ecf1;
467 #afGuiEditor [af-gui-edit-options
] ul
[ui-sortable
] li:nth-child
(even
) {
468 background-color:#f2f2f2;
470 #afGuiEditor [af-gui-edit-options
] ul
[ui-sortable
] li
> div
{
471 width: calc
(100% - 30px);
472 display: inline-block
;
474 #afGuiEditor [af-gui-edit-options
] ul
.af-gui-edit-options-deleted li
> div
{
475 text-decoration: line-through
;
477 #afGuiEditor [af-gui-edit-options
] ul
[ui-sortable
] li
.btn-xs
{
480 #afGuiEditor [af-gui-edit-options
] h5
{
484 #afGuiEditor .af-gui-dropzone
{
485 background-color: #e9eeff;
486 border: 2px solid
#0071bd;