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