SD-SimpleDesk

1) /**********************************
2) * General stuff used all around the helpdesk 	*
3) ***********************************/

4) /* SimpleDesk icons */

5) .shd_smallicon
6) {
7) 	width: 13px;
8) 	height: 13px;
9) 	margin-right: 4px;
10) }
11) .shd_icon_minihead
12) {
13) 	position: relative;
14) 	top: 3px;
15) }

16) .shd_icon
17) {
18) 	position: relative;
19) 	top: 3px;
20) }

21) .shd_tinyicon
22) {
23) 	width: 9px;
24) 	height: 9px;
25) }
26) 
27) .shd_main_hd
28) {
29) 	margin-top: -3px;
30) }
31) 

32) .shd_no_margin
33) {
34) 	margin: 0;
35) }
36) 
37) .shd_hide_bottom_border
38) {
39) 	border-bottom: 0;
40) }
41) 

42) .shd_staffresources ul
43) {
44) 	list-style-type: none;
45) 	padding: 0;
46) 	margin: 0;
47) }
48) .shd_staffresources li
49) {
50) 	margin-bottom: 3px;
51) }
52) 

53) .shd_gototicket {

54) 	display: block;
55) 	float: right;
56) 	margin-left: 1em;
57) }
58) 

59) .shd_assignees
60) {
61) 	background-color:inherit;
62) 	padding-left: 1em;
63) }
64) 
65) .shd_assignees:hover
66) {
67) 	background-color: #bbbbbb;
68) }
69) 
70) .shd_assign_button, .shd_assignees
71) {
72) 	cursor: pointer;
73) }
74) 

75) .information li dt
76) {
77) 	color: gray;
78) 	font-weight: bold;
79) 	float: left;
80) }
81) 
82) .information li dd
83) {
84) 	float: left;
85) 	margin: 0;
86) 	padding: 0 4px 0 7px;
87) }
88) 
89) dd#assigned_button
90) {
91) 	padding: 1px 0;
92) }
93) 

94) span.shd_new_tickets
95) {
96) 	margin-left: 5px;
97)     padding: 1px 5px 3px 4px;
98) }
99) 
100) /* The page index color looks ugly with our theme. */

101) .shd_cat_bar .current_page, .shd_pages .current_page

102) {
103) 	color: #fff;

104) 	padding: 0;
105) }
106) .bot_page .current_page
107) {
108) 	padding: 0;

109) }
110) 

111) /**********************************
112) * Stuff used within the actual tickets 	*
113) ***********************************/
114) 
115) /* This is done to position icons perfectly in the ticket header (i.e the navigation)*/
116) h3.ticketheader img
117) {
118) 	top: 2px;
119) 	position: relative;
120) 	margin-right: 2px;
121) }
122) 
123) /* Ticket details (Left-floated box) */

124) .shd_ticket_side_column

125) {
126) 	float: left;

127) 	width: 20%;

128) 	padding: 0 5px 5px 5px;

129) }

130) .shd_ticketdetails
131) {

132) 	overflow: auto;

133) 	float: left;

134) 	width: 100%;

135) }

136) .shd_ticketdetails .shd_smallicon
137) {
138) 	padding-top: 7px;
139) }

140) .shd_customfields
141) {
142) 	width: 66%;
143) 	margin-bottom: 0;
144) 	float: left;
145) 	margin-top: 5px;
146) }

147) .shd_additional_details
148) {
149) 	overflow: auto;

150) 	float: left;

151) 	width: 100%;

152) }

153) .shd_ticket_side_column li
154) {
155) 	line-height: 1.8em;
156) }

157) 
158) /* The ticket container */

159) form#postmodify .shd_ticket_roundframe
160) {
161) 	padding: 12px 16px;
162) }

163) .shd_ticket
164) {

165) 	min-height: 250px;

166) }

167) .shd_ticket_description
168) {

169) 	margin-left: 260px;
170) }
171) 
172) #shd_ticket_text
173) {
174) 	min-height: 100px;
175) }
176) 
177) /* The left column in the ticket display */
178) .shd_ticket_leftcolumn
179) {
180) 	width: 25%;

181) }
182) .shd_ticket_leftcolumn .roundframe {
183) 	margin: 0;

184) }
185) /* The right column in the ticket display */
186) .shd_ticket_rightcolumn
187) {
188) 	width: 75%;
189) }
190) 
191) /* The Respond, Edit, Delete etc links */
192) .shd_ticketlinks a
193) {
194) 	margin-right: 10px;
195) }
196) .shd_ticketlinks a#last
197) {
198) 	margin-right: 0px;
199) }
200) 
201) .shd_ticket_avatar
202) {
203) 	margin: 1em auto;
204) 	text-align: center;
205) }
206) 
207) .shd_modified
208) {
209) 	margin-top: 20px;
210) }
211) 
212) .postreply
213) {
214) 	margin: 0;
215) }
216) 
217) .postmodify
218) {
219) 	margin: 0;
220) }
221) 
222) /* The 'Go to the main log' link in ticket logs */
223) .shd_main_log
224) {
225) 	font-size: 80%;
226) }
227) .shd_main_log img
228) {
229) 	position: relative;
230) 	top: 3px;
231) 	margin-right: 2px;
232) }
233) #shd_ticket_log_expand
234) {
235) 	margin-top: 8px;

236) 	position: relative;
237) 	left: 4px;

238) }

239) #shd_custom_fields_swap
240) {
241) 	margin-top: 8px;
242) }

243) .shd_customfields input[type="text"]

244) {
245) 	width: 85%;
246) }

247) .shd_ticket_log_expand_container
248) {
249) 	margin-right: 3px;
250) }
251) 
252) #quickReplyExpand
253) {
254) 	margin-top: 8px;
255) }
256) 
257) /* Override editor margins */
258) #quickReplyOptions form textarea
259) {
260) 	margin-bottom: 0!important;
261) }
262) 
263) /**********************************
264)  * Huge buttons :D			 	*
265) ***********************************/
266) 
267) /* The big reply button */
268) .shd_replybutton
269) {
270) 	background: url(../images/simpledesk/respond.png) no-repeat left;
271) 	background-position: 10px;
272) 	padding: 10px;
273) 	padding-left: 40px;
274) 	padding-top: 8px;
275) 	font-weight: bold;
276) 	font-size: 100%;
277) 	margin-bottom: 10px;

278) 	border: 1px solid #ddd;
279) 	border-radius: 7px;

280) }
281) /* The big quote button */
282) .shd_quotebutton
283) {
284) 	margin-top: 10px;
285) 	height: 15px;
286) 	background: url(../images/simpledesk/quote.png) no-repeat left;
287) 	background-position: 10px;
288) 	padding: 10px;
289) 	padding-left: 40px;
290) 	padding-top: 8px;
291) 	font-weight: bold;
292) 	font-size: 100%;
293) 	margin-right: 10px;
294) }
295) /* Go advanced! */
296) .shd_advancedbutton
297) {
298) 	margin-top: 10px;
299) 	height: 15px;
300) 	background: url(../images/simpledesk/advanced.png) no-repeat left;
301) 	background-position: 10px;
302) 	padding: 10px;
303) 	padding-left: 40px;
304) 	padding-top: 8px;
305) 	font-weight: bold;
306) 	font-size: 100%;
307) 	margin-right: 10px;
308) }
309) 
310) /* Edit settings*/
311) .shd_editpreferences
312) {
313) 	height: 15px;
314) 	background: url(../images/simpledesk/edit.png) no-repeat left;
315) 	background-position: 10px;
316) 	padding: 10px;
317) 	padding-left: 40px;
318) 	padding-top: 8px;
319) 	font-weight: bold;
320) 	font-size: 100%;
321) 	margin-right: 10px;
322) }
323) 
324) /* Show tickets */
325) .shd_showtickets
326) {
327) 	height: 15px;
328) 	padding: 10px;
329) 	padding-left: 40px;
330) 	padding-top: 8px;
331) 	font-weight: bold;
332) 	font-size: 100%;
333) 	margin-right: 10px;
334) }
335) #shd_showtickets
336) {
337) 	background: url(../images/simpledesk/details.png) no-repeat left;
338) 	background-position: 10px;
339) }
340) #shd_post_proxy
341) {
342) 	background: url(../images/simpledesk/proxy.png) no-repeat left;

343) 	background-position: 10px;

344) }

345) #shd_post_ticket
346) {
347) 	background: url(../images/simpledesk/ticket.png) no-repeat left;
348) 	background-position: 10px;
349) }

350) 
351) /**********************************
352) * Ticket replies				 *
353) ***********************************/
354) .shd_posterinfo
355) {

356) 	width: 14em;

357) 	text-align: center;
358) 	margin-left: 3px;

359) 	overflow: hidden;

360) }
361) .shd_postername
362) {
363) 	font-size: 120%;
364) }
365) .shd_groupmargin
366) {
367) 	margin-bottom: 10px;
368) }
369) .shd_posteravatar img
370) {
371) 	padding: 0px;
372) 	max-width: 10.5em;
373) }
374) .shd_replyarea
375) {

376) 	padding-left: 14em;

377) 	margin-left: 10px;
378) }
379) 
380) .shd_reply .avatar
381) {
382) 	margin-bottom: 10px;
383) }
384) 

385) .shd_ajax_head
386) {
387) 	font-weight: bold;
388) }
389) .shd_ajaxnotify
390) {
391) 	width: 40%;
392) 	margin-right: 5%;
393) 	float: left;
394) }
395) 

396) /**********************************

397) * Attachment stuff				  *

398) ***********************************/
399) .shd_reply_attachments
400) {

401) 	width: 66%;

402) 	margin-bottom: 0;
403) 	float: left;
404) 	margin-top: 5px;
405) }

406) .shd_reply_attachments ul, .shd_reply_attachments li

407) {
408) 	display: block;
409) 	list-style-type: none;
410) }
411) 

412) .shd_reply_attachments li

413) {
414) 	float: left;
415) 	width: 30%;
416) }
417) 
418) .shd_attachment
419) {
420) 	padding-bottom: 5px;
421) 	font-size: 85%;
422) }
423) .shd_attachmentpreview
424) {
425) 	text-align: center;
426) }
427) .shd_attachmentpreview img
428) {
429) 	max-width: 75px;
430) 	margin: 3px;
431) 	margin-top: 6px;
432) }
433) .shd_attachmentpreview .description
434) {
435) 	padding: 0;
436) }
437) .shd_removeattachment
438) {
439) 	margin-left: -8px;
440) 	margin-right: 3px;
441) }
442) .shd_attachmentcolumn
443) {
444) 	margin-right: 20px;
445) }
446) .shd_thumb
447) {
448) 	border: 0;
449) 	display: block;
450) 	margin-left: auto;
451) 	margin-right: auto;
452) }
453) 
454) /**********************************
455) * Posting and editing tickets/replies		 *
456) ***********************************/
457) #shd_bbcbox
458) {
459)    margin: 0 0 0.5em 0;
460) }
461) #shd_bbcbox div
462) {

463) 	margin: 0.2em 0;
464) 	vertical-align: top;

465) }
466) #shd_bbcbox div img
467) {

468) 	margin: 0 1px 0 0;
469) 	vertical-align: top;

470) }
471) #shd_bbcbox select
472) {

473) 	margin: 0 2px;

474) }
475) /* The smiley strip */
476) #shd_smileybox
477) {

478) 	margin: 0.75em 0 0.5em 0;

479) }

480) #canned_replies
481) {
482) 	float: left;
483) 	width: 66%;
484) 	margin-top: 1em;
485) }

486) 
487) /**********************************
488) * General actions				 *
489) ***********************************/
490) .pm_message
491) {
492) 	margin-top: 1ex;
493) }
494) 
495) /* The 'Empty log' link in the action log */
496) .shd_empty_log
497) {
498) 	font-size: 80%;
499) }
500) .shd_empty_log img
501) {
502) 	position: relative;
503) 	top: 3px;
504) 	margin-right: 2px;
505) }
506) 
507) /**********************************
508) * The profile				 	*
509) ***********************************/
510) .shd_profile_navigation
511) {
512) 	margin-right: 20px;
513) }
514) .shd_profile_nav_list, .shd_profile_nav_list ul, .shd_profile_nav_list li
515) {
516) 	margin: 0;
517) 	padding: 0;
518) 	list-style-type: none;
519) }
520) .shd_profile_nav_inline, .shd_profile_nav_inline ul, .shd_profile_nav_inline li
521) {
522) 	margin: 0;
523) 	padding: 0;
524) 	list-style-type: none;
525) 	float: left;
526) }
527) .shd_profile_nav_inline li
528) {
529) 	margin-right: 10px;
530) 	border-right: 1px solid #cccccc;
531) 	padding-right: 10px;
532) }
533) .shd_profile_nav_inline img
534) {
535) 	margin-left: 4px;
536) }
537) 
538) .shd_profile_nav_inline li.shd_inline_last
539) {
540) 	border-right: none;

541) }
542) 

543) /* I'm not sure about the above, I'll rewrite them later */

544) .bot_page
545) {

546) 	border: 1px solid #DDD;
547) 	border-top: none;
548) }

549) #ticket_log_header
550) {

551) 	clear: both;
552) }
553) 
554) /* Urgency stuff */

555) .generic_icons.urgency_increase
556) {

557) 	background-position: -161px -5px;
558) }

559) .generic_icons.urgency_decrease
560) {

561) 	background-position: -213px -5px;
562) }
563) 
564) /* We need some adjustments */

565) dl.stats dd span, dl.stats dt span
566) {

567) 	position: relative;

568) 	padding: 0;

569) }
570) 
571) /* We need something like winfo in helpdesk */
572) .noup {
573) 	border-top-left-radius: 0;
574) 	border-top-right-radius: 0;
575) 	margin: 0 !important;
576) }
577) 
578) .shd_icon_fullhead {
579) 	position: relative;

580) }
581) 
582) /* Something to keep it look good */
583) #replies .windowbg:last-of-type {
584) 	border-bottom-left-radius: 0;
585) 	border-bottom-right-radius: 0;

586) }
587) 

588) /* Helpdesk table-width*/
589) .shd_5 {
590) 	width: 5%;
591) }
592) .shd_10 {
593) 	width: 10%;
594) }
595) .shd_20 {
596) 	width: 20%;
597) }
598) .shd_25 {
599) 	width: 25%;
600) }
601) .shd_33 {
602) 	width: 33%;
603) }
604) .shd_50 {
605) 	width: 50%;
606) }
607) .shd_75 {
608) 	width: 75%;
609) }
610) 
611) /* Start of responsiveness */
612) /* This will be moved to its file once it gets more work on it */

613) @media (max-width: 480px) {
614) 	.shd_ticket_rightcolumn, .shd_ticket_leftcolumn {
615) 		width: 100%;
616) 		padding: 0;
617) 	}
618) 	.shd_ticket_rightcolumn {
619) 		margin-top: 10px;
620) 	}
621) 	.shd_profile_navigation {
622) 		margin-right: 0;
623) 	}
624) 	input[type="checkbox"] {
625) 		height: 15px;
626) 		width: 15px;
627) 	}