css/helpdesk.css (d9a7024) - SD-SimpleDesk · SleePy Public Git Projects

helpdesk.css

/**********************************
* General stuff used all around the helpdesk 	*
***********************************/
/* Make sure the hidden class is here */
.hidden {
	display: none;
}

/* SimpleDesk icons */
.shd_icon {
	position: relative;
	top: 3px;
}
.shd_tinyicon {
	width: 9px;
	height: 9px;
}

.shd_main_hd {
	margin-top: -3px;
}

.shd_no_margin {
	margin: 0;
}

.shd_hide_bottom_border {
	border-bottom: 0;
}

.shd_staffresources ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}
.shd_staffresources li {
	margin-bottom: 3px;
}

.shd_gototicket {
	display: block;
	float: right;
	margin-left: 1em;
}

.shd_assignees {
	background-color:inherit;
	padding-left: 1em;
}

.shd_assignees:hover {
	background-color: #bbbbbb;
}

.shd_assign_button, .shd_assignees {
	cursor: pointer;
}

.stats .shd_assignees_list {
	width: 100%;
}

.information li dt {
	color: gray;
	font-weight: bold;
	float: left;
}

.information li dd {
	float: left;
	margin: 0;
	padding: 0 4px 0 7px;
}

dd#urgency_button, dd#assigned_button {
	padding: 1px 0;
}

span.shd_new_tickets {
	margin-left: 5px;
    padding: 1px 5px 3px 4px;
}

.shd_smallicon {
	max-width: initial;
	vertical-align: middle;
}

/* The page index color looks ugly with our theme. */
.shd_cat_bar .current_page, .shd_pages .current_page {
	color: #fff;
	padding: 0;
}
.bot_page .current_page {
	padding: 0;
}

/**********************************
* Stuff used within the actual tickets 	*
***********************************/

/* This is done to position icons perfectly in the ticket header (i.e the navigation)*/
h3.ticketheader img {
	top: 2px;
	position: relative;
	margin-right: 2px;
}

#ticket img {
	vertical-align: middle;
}

/* Ticket details (Left-floated box) */
.shd_ticket_side_column {
	min-width: 23%;
	padding: 0;
}
.shd_ticketdetails {
	overflow: auto;
	float: left;
	width: 100%;
}
.shd_ticketdetails img.shd_smallicon {
	vertical-align: middle;
}
.shd_customfields {
	width: 66%;
	margin-bottom: 0;
	margin-top: 5px;
}
.shd_additional_details {
	overflow: auto;
	float: left;
	width: 100%;
}
.shd_ticket_side_column li {
	line-height: 1.8em;
}

/* The ticket container */
form#postmodify .shd_ticket_roundframe {
	padding: 12px 16px;
}
.shd_ticket {
	min-height: 250px;
	display: flex;
	gap: 20px;
}
.shd_ticket_description {
	flex-grow: 2;
}

#shd_ticket_text {
	min-height: 100px;
}

.sd_lower_columns {
	display: flex;
	margin: 15px 0 5px;
	gap: 15px;
}

/* The left column in the ticket display */
.shd_ticket_leftcolumn {
	width: 25%;
}
.shd_ticket_leftcolumn .roundframe {
	margin: 0;
}
/* The right column in the ticket display */
.shd_ticket_rightcolumn {
	width: 75%;
}
/* Notif preferences */
.sd_notif_element:not(:last-child, :first-child),
.sd_notif_element:first-child:not(:last-child) {
	border-bottom: 1px solid #ccc;
	padding-bottom: 10px;
	margin-bottom: 5px;
}

/* The Respond, Edit, Delete etc links */
.shd_ticketlinks a {
	margin-right: 10px;
}
.shd_ticketlinks a#last {
	margin-right: 0px;
}

.shd_ticket_avatar {
	margin: 1em auto;
	text-align: center;
}

.shd_modified {
	margin-top: 20px;
}

.postreply {
	margin: 0;
}

.postmodify {
	margin: 0;
}

/* The 'Go to the main log' link in ticket logs */
.shd_main_log {
	font-size: 80%;
}
.shd_main_log img {
	position: relative;
	top: 3px;
	margin-right: 2px;
}
#shd_ticket_log_expand {
	margin-top: 8px;
	position: relative;
	left: 4px;
}
.shd_customfields input[type="text"]
{
	width: 85%;
}
.shd_ticket_log_expand_container {
	margin-right: 3px;
}

#quickReplyExpand {
	margin-top: 8px;
}

/* Override editor margins */
#quickReplyOptions form textarea {
	margin-bottom: 0!important;
}

/**********************************
 * Huge buttons :D			 	*
***********************************/

/* The big reply button */
.shd_replybutton {
	background: url(../images/simpledesk/respond.png) no-repeat left;
	background-position: 10px;
	padding: 8px 10px 10px 40px;
	font-weight: bold;
	font-size: 100%;
	margin-bottom: 10px;
	border: 1px solid #ddd;
	border-radius: 7px;
}
/* The big quote button */
.shd_quotebutton {
	background: url(../images/simpledesk/quote.png) no-repeat left;
	background-position: 10px;
	padding: 8px 10px 10px 40px;
	font-weight: bold;
	font-size: 100%;
	margin-bottom: 10px;
	margin-right: 10px;
	border: 1px solid #ddd;
	border-radius: 7px;
}
/* Go advanced! */
.shd_advancedbutton {
	background: url(../images/simpledesk/advanced.png) no-repeat left;
	background-position: 10px;
	padding: 10px;
	padding-left: 40px;
	padding-top: 8px;
	font-weight: bold;
	font-size: 100%;
	margin-right: 10px;
	border-top: 1px solid #ddd;
	border-radius: 7px;
}

/* Edit settings*/
.shd_editpreferences {
	height: 15px;
	background: url(../images/simpledesk/edit.png) no-repeat left;
	background-position: 10px;
	padding: 10px;
	padding-left: 40px;
	padding-top: 8px;
	font-weight: bold;
	font-size: 100%;
	margin-right: 10px;
}

/* Show tickets */
.shd_showtickets {
	height: 15px;
	padding: 10px;
	padding-left: 40px;
	padding-top: 8px;
	font-weight: bold;
	font-size: 100%;
	margin-right: 10px;
}
#shd_showtickets {
	background: url(../images/simpledesk/details.png) no-repeat left;
	background-position: 10px;
}
#shd_post_proxy {
	background: url(../images/simpledesk/proxy.png) no-repeat left;
	background-position: 10px;
}
#shd_post_ticket {
	background: url(../images/simpledesk/ticket.png) no-repeat left;
	background-position: 10px;
}

/**********************************
* Ticket replies				 *
***********************************/
.ticket_replies_container {
	display: flex;
	gap: 15px;
	flex-wrap: wrap;
}
/* Something to keep it look good */
#replies .ticket_replies_container:last-of-type {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}
.ticket_replies_container .postarea {
	margin: 0;
	flex-grow: 2;
}
.shd_posterinfo {
	width: 14em;
	text-align: center;
	overflow: hidden;
}
.shd_postername {
	font-size: 120%;
}
.shd_groupmargin {
	margin-bottom: 10px;
}
.shd_posteravatar img {
	padding: 0px;
	max-width: 10.5em;
}
.shd_replyarea {
	flex-grow: 2;
}

.shd_reply .avatar {
	margin-bottom: 10px;
}

.shd_ajax_head {
	font-weight: bold;
}
.shd_ajaxnotify {
	width: 40%;
	margin-right: 5%;
	float: left;
}
dl.settings dt.shd_cust_fields_largetext, .shd_cust_fields_largetext textarea {
	width: 100%;
}

/**********************************
* Attachment stuff				  *
***********************************/
.shd_reply_attachments {
	margin-bottom: 0;
	margin-top: 5px;
}
.shd_reply_attachments ul, .shd_reply_attachments li {
	display: block;
	list-style-type: none;
}

.shd_reply_attachments li {
	float: left;
	width: 30%;
}

.shd_attachment {
	padding-bottom: 5px;
	font-size: 85%;
}
.shd_attachmentpreview {
	text-align: center;
}
.shd_attachmentpreview img {
	max-width: 75px;
	margin: 3px;
	margin-top: 6px;
}
.shd_attachmentpreview .description {
	padding: 0;
}
.shd_removeattachment {
	margin-left: -8px;
	margin-right: 3px;
}
.shd_thumb {
	border: 0;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

#shd_notifications_div {
	margin-top: 1em;
}

/**********************************
* Posting and editing tickets/replies		 *
***********************************/
#shd_bbcbox {
   margin: 0 0 0.5em 0;
}
#shd_bbcbox div {
	margin: 0.2em 0;
	vertical-align: top;
}
#shd_bbcbox div img {
	margin: 0 1px 0 0;
	vertical-align: top;
}
#shd_bbcbox select {
	margin: 0 2px;
}
/* The smiley strip */
#shd_smileybox {
	margin: 0.75em 0 0.5em 0;
}
#canned_replies {
	margin-top: 1em;
}
#canned_replies #canned_title {
	font-weight:bold;
}

/**********************************
* General actions				 *
***********************************/
.pm_message {
	margin-top: 1ex;
}

/* The 'Empty log' link in the action log */
.shd_empty_log {
	font-size: 80%;
}
.shd_empty_log img {
	position: relative;
	top: 3px;
	margin-right: 2px;
}

/**********************************
* The profile				 	*
***********************************/
.shd_profile_navigation {
	margin-right: 20px;
}
.shd_profile_nav_list, .shd_profile_nav_list ul, .shd_profile_nav_list li {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.shd_profile_nav_inline, .shd_profile_nav_inline ul, .shd_profile_nav_inline li {
	margin: 0;
	padding: 0;
	list-style-type: none;
	float: left;
}
.shd_profile_nav_inline li {
	margin-right: 10px;
	border-right: 1px solid #cccccc;
	padding-right: 10px;
}
.shd_profile_nav_inline img {
	margin-left: 4px;
}

.shd_profile_nav_inline li.shd_inline_last {
	border-right: none;
}

/* I'm not sure about the above, I'll rewrite them later */
.bot_page {
	border: 1px solid #DDD;
	border-top: none;
}
#ticket_log_header {
	clear: both;
}

/* Urgency stuff */
.generic_icons.urgency_increase::before {
	width: 16px;
	height: 16px;
	display: inline-block;
	content: '';
	background: url(../images/simpledesk/move_up.png) no-repeat;
}
.generic_icons.urgency_decrease::before {
	width: 16px;
	height: 16px;
	display: inline-block;
	content: '';
	background: url(../images/simpledesk/move_down.png) no-repeat;
}

/* We need some adjustments */
dl.stats dd span, dl.stats dt span {
	position: relative;
	padding: 0;
}

/* We need something like winfo in helpdesk */
.noup {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	margin: 0 !important;
}

.shd_icon_fullhead {
	position: relative;
}

/* Helpdesk table-width*/
.shd_5 {
	width: 5%;
}
.shd_10 {
	width: 10%;
}
.shd_20 {
	width: 20%;
}
.shd_25 {
	width: 25%;
}
.shd_33 {
	width: 33%;
}
.shd_50 {
	width: 50%;
}
.shd_75 {
	width: 75%;
}

/* Unread */
.sd_unread_title {
	display: flex;
	min-height: 35px;
	flex-wrap: wrap;
	align-items: center;
	padding: 0 4px;
}
.sd_unread_content div.sd_unread_row {
	display: flex;
	min-height: 35px;
	flex-wrap: wrap;
	align-items: center;
	padding: 0 4px;
}

.sd_unread_title span {
	flex-basis: auto;
	flex-grow: 1;
}
.sd_unread_content div.sd_unread_row span {
	flex-basis: auto;
	flex-shrink: 0;
	flex-grow: 1;
}

@media screen and (max-width: 991px) {
	.sd_unread_title span:not(:nth-child(1), :nth-child(2), :nth-child(5)),
	.sd_unread_content div.sd_unread_row span:not(:nth-child(1), :nth-child(2), :nth-child(5)) {
		display: none;
	}
}

.sd_wordbreak {
	overflow-wrap: break-word;
}

SD-SimpleDesk

Various Fixes