css cleanup
[civicrm-core.git] / css / contactSummary.css
CommitLineData
0e44568b
CW
1/* CiviCRM contact summary page styles */
2
3.crm-container .primary {
4 font-weight: bold;
5}
6
7.crm-container .upper {
8 text-transform: uppercase;
9}
10
11div#crm-contact-thumbnail {
12 padding: 4px;
13 float: right;
14}
15
16.crm-container div.contact_panel {
17 display: block;
18}
19
20.crm-container div.contact_panel td {
21 border-bottom: 1px solid #FFF;
22}
23
24#crm-container div.crm-inline-edit {
25 border: 2px dashed transparent;
26 background: none;
27 position: relative;
28}
29
30#crm-container .crm-edit-ready .crm-inline-edit:hover {
31 cursor: pointer;
32 border: 2px dashed lightgrey;
33}
34
35#crm-container div.crm-inline-edit.form {
36 cursor: default;
37 border: 2px dashed #6665BF;
38 overflow: auto;
39}
40
41#crm-container .crm-inline-edit.add-new {
42 min-height: 2.5em;
43}
44
45#crm-container div.crm-inline-edit .crm-edit-help {
46 display: none;
47 position: absolute;
b5efa2c8
CW
48 right: 0;
49 top: 0;
0e44568b
CW
50 opacity: .8;
51 padding: .4em;
52 border-bottom-left-radius: 1em;
53}
54
55#crm-container .crm-inline-edit.add-new .crm-edit-help {
56 display: block;
57 background-color: #EBEBEB;
58}
59
60#crm-container .crm-edit-ready .crm-inline-edit:hover .crm-edit-help {
61 display: block;
62 background-color: #DFE1FF;
63}
64
65#crm-container div.crm-inline-edit.form .crm-edit-help {
66 display: none !important;
67}
68
69#crm-container span.crm-custom-greeting {
70 font-size: 9px;
71}
72
73#crm-container table.crm-inline-edit-form td,
74#crm-container div.crm-inline-edit-form {
75 background-color: #efefe5;
76 white-space: nowrap;
77}
78#crm-container table.crm-inline-edit-form td.crm-label,
79#crm-container div.crm-inline-edit-form .crm-label {
80 white-space: normal;
81}
82
83#crm-container div.crm-inline-edit-field {
84 display: inline-block;
85 padding: 4px 5px;
86}
87
88#crm-container div.crm-summary-contactname-block {
89 padding-bottom: 8px;
90 margin-top: -10px;
91}
92
93#crm-container div.crm-summary-display_name {
94 font-size: 19px;
95 padding-bottom: 10px;
96}
97
98#crm-container div.contactCardLeft,
99#crm-container div#Top {
100 width: 49%;
101 display: block;
102 float: left;
103 clear: both;
104}
105
106#crm-container div.contactCardRight {
107 width: 49%;
108 display: block;
109 float: right;
110}
111
112#crm-container div.contact_panel table {
b5efa2c8 113 margin-bottom: 0;
0e44568b
CW
114}
115
116#crm-container div.contactCardLeft .label,
117#crm-container div.contactCardRight .label {
118 font-size: 11px;
119 vertical-align: top;
120 margin-right: 10px;
121}
122
123#crm-container div.contactCardLeft .grouplabel,
124#crm-container div.contactCardRight .grouplabel {
125 border-bottom: grey 1px solid;
126 width: 100%;
127 font-size: 0.95em;
128 font-weight: bold;
129 background-color: #ddd;
130}
131
132#crm-container div.contact_panel .spacer {
133 padding: 8px;
134}
135
136#crm-container div.contact_panel td {
137 padding: 4px;
138 vertical-align: top;
139 border-bottom: 1px solid #E2E2E2;
140}
141
142#crm-container div.contact_panel td.label {
143 width: 28%;
144}
145
146#crm-container div.contact_panel td.last {
b5efa2c8 147 border-bottom: 0;
0e44568b
CW
148}
149
150#crm-container #customFields {
151 width: 100%;
152}
153
154#crm-container #customFields div.contact_panel td.talabel {
155 padding: 4px 0 0 4px;
b5efa2c8 156 border: 0;
0e44568b
CW
157}
158
159#crm-container #customFields .contact_panel .customFieldGroup {
160 line-height: 1.4em;
161 padding: 4px;
162 width: 100%;
163}
164
165#crm-container div.contact_panel .crm-address-block {
166 margin-bottom: 6px;
167}
168#crm-container .crm-add-address-wrapper {
169 height: 25px;
170}
171
172.crm-container .crm-summary-row:after {
173 clear: both;
174 content: ".";
175 display: block;
176 height: 0;
177 visibility: hidden;
178}
179
180#crm-container div.crm-summary-row {
181 background-color: #F4F4ED;
182 border-top: 1px solid #ffffff;
183 margin-bottom: 1px;
184 min-height: 17px;
185}
186
187#crm-container div.crm-summary-row div.crm-label {
188 background-color: #FAFAFA;
189 color: #7A7A60;
190 text-align: left;
191 width: 122px;
192 float: left;
193 padding: 4px;
194}
195
196#crm-container div.crm-summary-row div.crm-content {
197 padding: 4px;
198 margin-left: 130px;
199}
200
201.crm-container #customFields div.contact_panel td {
202 border-bottom: 1px solid #FFFFFF;
203 padding: 4px;
204 vertical-align: top;
205}
206
207#crm-record-log {
b5efa2c8 208 padding: 0.8em 0.8em 0 0;
0e44568b
CW
209 text-align: right;
210}
211
212/* contact actions */
213
214#crm-contact-actions-list ul {
215 width: auto;
216}
217
218#crm-contact-actions-list .crm-contact_activities-list ul {
219 padding-right: 4px;
220}
221#crm-contact-actions-list .crm-contact_print-list ul,
222#crm-contact-actions-list .crm-contact_actions-list ul {
223 padding-left: 4px;
224}
225
226#crm-contact-actions-list .crm-contact_activities-list {
227 float: left;
228}
229#crm-contact-actions-list .crm-contact_print-list {
230 float: right;
231}
232#crm-contact-actions-list .crm-contact_actions-list {
233 margin-left: 160px;
234 margin-right: 161px;
235 border-left: 1px solid #a7a7a7;
236 border-right: 1px solid #a7a7a7;
237}
238
239#crm-contact-actions-wrapper {
240 position: relative;
241 float: left;
242 width: 85px;
243 /* fixes ie bug where button is toooooo long */
244}
245#crm-contact-actions-list {
246 width: 495px;
247 /* fixes ie bug caused by above*/
248}
249
250#crm-contact-actions-list .crm-contact_activities-list select {
251 margin-top: 4px;
252}
253
254#crm-contact-actions-list .crm-contact_activities-list,
255#crm-contact-actions-list .crm-contact_print-list,
256#crm-contact-actions-list .crm-contact_actions-list {
257 width: 160px;
258}
259
260#crm-contact-actions-list .icon {
261 background-image: url("../i/icons/jquery-ui-FFFFFF.png");
262}
263
b5efa2c8
CW
264.crm-container .restore-icon {
265 background-position: 0 -66px;
266}
267.crm-container .button:hover .restore-icon {
268 background-image: url("../i/icons/jquery-ui-91CE00.png");
269}
270
0e44568b
CW
271/* Responsive layout changes */
272
273#crm-container .contact_basic_information-section.narrowform table.form-layout-compressed,
274#crm-container .contact_basic_information-section.narrowform table.form-layout-compressed tbody,
275#crm-container .contact_basic_information-section.narrowform.xnarrowform table.form-layout-compressed tr {
276 display: block;
277 width: 100%;
278}
279
280#crm-container .contact_basic_information-section.narrowform table.form-layout-compressed tr {
281 display: inline-block;
282 width: 49%;
283 vertical-align: top;
284}
285
286#crm-container .contact_basic_information-section.narrowform table.form-layout-compressed td {
287 display: block;
288 clear: left;
289 vertical-align: top;
290 margin-bottom: .5ex;
291}
292
293#crm-container .contact_basic_information-section.narrowform table.form-layout-compressed td.hashelpicon {
294 position: relative;
295}
296
297#crm-container .contact_basic_information-section.narrowform table.form-layout-compressed td.hashelpicon label {
298 padding-bottom: 16px;
299}
300
301#crm-container .contact_basic_information-section.narrowform table.form-layout-compressed td .helpicon {
302 position: absolute;
303 bottom: -12px;
304 left: 2px;
305}
306
307#crm-container .contact_basic_information-section.narrowform table.form-layout-compressed td br {
308 display: none;
309}
310
311#crm-container .contact_basic_information-section.narrowform table.form-layout-compressed td label {
312 display: block;
313 box-sizing: border-box;
314 -moz-box-sizing: border-box;
315 width: 25%;
316 float: left;
317 padding-right: 1%;
318}
319
320#crm-container .contact_basic_information-section.narrowform table.form-layout-compressed td input {
321 box-sizing: border-box;
322 -moz-box-sizing: border-box;
323 width: 75%;
324}
325
326#crm-container #mainTabContainer.narrowpage #contact-summary div.customFieldGroup,
327#crm-container #mainTabContainer.narrowpage #contact-summary div.contactCardLeft,
328#crm-container #mainTabContainer.narrowpage #contact-summary div.contactCardRight {
329 box-sizing: border-box;
330 -moz-box-sizing: border-box;
331 float: none;
332 width: 100%;
333}