Merge pull request #2056 from kurund/overlay-css-fixes
[civicrm-core.git] / 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-tree > ul > li > 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 .ui-sortable-helper > .crm-designer-row {
149 box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
150 opacity: 0.75;
151 }
152
153 .crm-designer-row .crm-designer-buttons a.crm-designer-action-settings:hover {
154 background-color: #71D46E;
155 }
156
157 .crm-designer-row .crm-designer-buttons a.crm-designer-action-remove:hover {
158 background-color: #F19489;
159 }
160
161 .crm-designer-row,
162 .crm-designer-row-placeholder {
163 border: 1px dashed transparent;
164 padding: 0.3em;
165 margin: auto;
166 position: relative;
167 }
168
169 .crm-designer-row-label {
170 padding: 0.5em 0px;
171 }
172
173 .crm-designer-label {
174 font-weight: bold;
175 }
176
177 .crm-designer-row-placeholder {
178 visibility: visible !important;
179 height: 2em;
180 }
181
182 .crm-designer-dialog .description {
183 margin: 0px 2em 0px 0px;
184 }
185
186 .crm-designer-dialog .disabled .description {
187 display: none;
188 }
189
190 .crm-designer-dialog li.crm-designer-row-placeholder,
191 .crm-designer-dialog li.ui-draggable-dragging,
192 .crm-designer-dialog .bbf-form ul {
193 list-style-image: none;
194 list-style: none;
195 }
196
197 .ui-dialog .crm-designer-dialog.ui-dialog-content {
198 overflow: visible;
199 padding-right: .25em;
200 }
201
202 .crm-designer-dialog .full-height {
203 height: 100%;
204 }
205
206 .crm-designer {
207 position: relative;
208 }
209
210 .crm-profile-selector-preview-pane,
211 .crm-designer-dialog .crm-designer .scroll {
212 overflow-x: auto;
213 overflow-y: scroll;
214 }
215
216 .ui-dialog {
217 border: 1px solid #444;
218 box-shadow: 0 0 12px rgba(0, 0, 0, 0.3);
219 }
220
221 /* Hide annoying 'preview' message */
222 .crm-profile-selector-preview-pane > div.messages.status.info {
223 display: none;
224 }