Skip to content
Snippets Groups Projects
Commit 0728beec authored by Peter Rotich's avatar Peter Rotich
Browse files

Merge pull request #265 from kellishaver/feature/client-side-less

Feature/client side less
parents c89eb24e 427fbb83
Branches
Tags
No related merge requests found
Showing with 1194 additions and 356 deletions
...@@ -3,3 +3,5 @@ php53.cgi ...@@ -3,3 +3,5 @@ php53.cgi
include/ost-config.php include/ost-config.php
*.sw[a-z] *.sw[a-z]
.DS_Store .DS_Store
.vagrant
Vagrantfile
Customizng Your Theme
====
When modifying the default theme, it is recommended that you do not
edit the CSS files directly. Instead, you should use the included
LESS files and recompile the CSS file with your edits.
Even if you decide to edit the CSS directly, we recommend that you
keep the LESS files, so that you can quickly rebuild the default
theme should you need to recover it, or for upgrade purposes.
*Please do not submit any CSS edits to the official branch, unless
they are done within the LESS files.*
#header, #nav, #meta, #footer, #reply, #pagination, .reload, .refresh, form, .thread, hr, #kbAttachments, .back { #header,#nav,#meta,#footer,#reply,#pagination,.reload,.refresh,form,.thread,hr,#kbAttachments,.back{display:none}th{text-align:left}a{color:#000;text-decoration:none}caption{text-align:left;padding-bottom:10px;font-weight:bold}.message,.response{border-bottom:1px solid #000;margin-bottom:20px;padding-bottom:10px}.message th,.response th{font-size:12pt;font-weight:bold;padding-bottom:5px}
display: none; \ No newline at end of file
}
th {
text-align: left;
}
a {
color: #000;
text-decoration: none;
}
caption {
text-align: left;
padding-bottom: 10px;
font-weight: bold;
}
.message, .response {
border-bottom: 1px solid #000;
margin-bottom: 20px;
padding-bottom: 10px;
}
.message th, .response th {
font-size: 12pt;
font-weight: bold;
padding-bottom: 5px;
}
/* Based on Normalize.css - with tags we won't use removed. */
html { html {
font-size: 100%; font-size: 100%;
overflow-y: scroll; overflow-y: scroll;
-webkit-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%; -ms-text-size-adjust: 100%;
} }
body { body {
margin: 0; margin: 0;
font-size: 13px; font-size: 13px;
line-height: 1.231; line-height: 1.231;
padding: 0; padding: 0;
} }
body,
body, input, select, textarea { input,
select,
textarea {
font-family: sans-serif; font-family: sans-serif;
color: #000; color: #000;
} }
b,
b, strong { strong {
font-weight: bold; font-weight: bold;
} }
blockquote { blockquote {
margin: 1em 40px; margin: 1em 40px;
} }
hr { hr {
display: block; display: block;
height: 1px; height: 1px;
...@@ -34,119 +32,120 @@ hr { ...@@ -34,119 +32,120 @@ hr {
margin: 1em 0; margin: 1em 0;
padding: 0; padding: 0;
} }
small { small {
font-size: 85%; font-size: 85%;
} }
ul,
ul, ol { ol {
margin: 1em 0; margin: 1em 0;
padding: 0 0 0 30px; padding: 0 0 0 30px;
} }
img { img {
border: 0; border: 0;
vertical-align: middle; vertical-align: middle;
} }
form { form {
margin: 0; margin: 0;
} }
fieldset { fieldset {
border: 0; border: 0;
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
label { label {
cursor: pointer; cursor: pointer;
} }
input,
input, select, textarea { select,
textarea {
font-size: 100%; font-size: 100%;
margin: 0; margin: 0;
vertical-align: baseline; vertical-align: baseline;
*vertical-align: middle; *vertical-align: middle;
} }
input { input {
line-height: normal; line-height: normal;
*overflow: visible; *overflow: visible;
} }
table input { table input {
*overflow: auto; *overflow: auto;
} }
input[type="button"],
input[type="button"], input[type="reset"], input[type="submit"] { input[type="reset"],
input[type="submit"] {
cursor: pointer; cursor: pointer;
-webkit-appearance: button; -webkit-appearance: button;
} }
input[type="checkbox"],
input[type="checkbox"], input[type="radio"] { input[type="radio"] {
box-sizing: border-box; box-sizing: border-box;
} }
input[type="search"] { input[type="search"] {
-webkit-appearance: textfield; -webkit-appearance: textfield;
-moz-box-sizing: content-box; -moz-box-sizing: content-box;
-webkit-box-sizing: content-box; -webkit-box-sizing: content-box;
box-sizing: content-box; box-sizing: content-box;
} }
textarea { textarea {
overflow: auto; overflow: auto;
vertical-align: top; vertical-align: top;
resize: vertical; resize: vertical;
} }
table { table {
border-collapse: collapse; border-collapse: collapse;
border-spacing: 0; border-spacing: 0;
} }
th,
th, td { td {
vertical-align: top; vertical-align: top;
} }
th {
th { text-align: left; font-weight: normal; } text-align: left;
font-weight: normal;
h1, h2, h3, h4, h5, h6, form, fieldset { }
h1,
h2,
h3,
h4,
h5,
h6,
form,
fieldset {
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
/* Typography */ /* Typography */
a { a {
color: #0072bc; color: #0072bc;
text-decoration: none; text-decoration: none;
} }
h1 { h1 {
color: #00AEEF; color: #00AEEF;
font-weight: normal; font-weight: normal;
font-size: 20px; font-size: 20px;
} }
h3 { h3 {
font-size: 16px; font-size: 16px;
} }
h2 { h2 {
font-size: 16px; font-size: 16px;
color: #999; color: #999;
} }
/* Helpers */ /* Helpers */
.centered { text-align: center;} .centered {
text-align: center;
.clear { clear:both; height: 1px; visibility: none;} }
.clear {
.hidden { display: none;} clear: both;
height: 1px;
.faded { color:#666;} visibility: none;
}
.hidden {
display: none;
}
.faded {
color: #666;
}
/* Pagination */ /* Pagination */
#pagination { #pagination {
border: 0; border: 0;
...@@ -161,24 +160,26 @@ h2 { ...@@ -161,24 +160,26 @@ h2 {
list-style: none; list-style: none;
display: inline; display: inline;
} }
#pagination a { #pagination li a {
margin-right: 2px; margin-right: 2px;
display: block; display: block;
float: left; float: left;
padding: 3px 6px; padding: 3px 6px;
text-decoration: none; text-decoration: none;
} }
#pagination a:hover { #pagination li a:hover {
color: #ff0084; color: #ff0084;
} }
#pagination .previousOff, #pagination .nextOff { #pagination .previousOff,
#pagination .nextOff {
color: #666; color: #666;
display: block; display: block;
float: left; float: left;
font-weight: bold; font-weight: bold;
padding: 3px 4px; padding: 3px 4px;
} }
#pagination .next a, #pagination .previous a { #pagination .next a,
#pagination .previous a {
font-weight: bold; font-weight: bold;
} }
#pagination .active { #pagination .active {
...@@ -190,16 +191,34 @@ h2 { ...@@ -190,16 +191,34 @@ h2 {
padding: 3px 6px; padding: 3px 6px;
text-decoration: none; text-decoration: none;
} }
/* Alerts & Notices */ /* Alerts & Notices */
#msg_notice {
#msg_notice { margin: 0; padding: 5px 10px 5px 36px; height: 16px; line-height: 16px; margin-bottom: 10px; border: 1px solid #0a0; background: url('../images/icons/ok.png') 10px 50% no-repeat #e0ffe0; } margin: 0;
padding: 5px 10px 5px 36px;
#msg_warning { margin: 0; padding: 5px 10px 5px 36px; height: 16px; line-height: 16px; margin-bottom: 10px; border: 1px solid #f26522; background: url('../images/icons/alert.png') 10px 50% no-repeat #ffffdd; } height: 16px;
line-height: 16px;
#msg_error { margin: 0; padding: 5px 10px 5px 36px; height: 16px; line-height: 16px; margin-bottom: 10px; border: 1px solid #a00; background: url('../images/icons/error.png') 10px 50% no-repeat #fff0f0; } margin-bottom: 10px;
border: 1px solid #0a0;
background: url('../images/icons/ok.png') 10px 50% no-repeat #e0ffe0;
}
#msg_warning {
margin: 0;
padding: 5px 10px 5px 36px;
height: 16px;
line-height: 16px;
margin-bottom: 10px;
border: 1px solid #f26522;
background: url('../images/icons/alert.png') 10px 50% no-repeat #ffffdd;
}
#msg_error {
margin: 0;
padding: 5px 10px 5px 36px;
height: 16px;
line-height: 16px;
margin-bottom: 10px;
border: 1px solid #a00;
background: url('../images/icons/error.png') 10px 50% no-repeat #fff0f0;
}
.warning { .warning {
background: #ffc; background: #ffc;
font-style: italic; font-style: italic;
...@@ -209,19 +228,64 @@ h2 { ...@@ -209,19 +228,64 @@ h2 {
color: #a00; color: #a00;
font-style: normal; font-style: normal;
} }
.error { .error {
color:#f00; color: #f00;
} }
.error input { .error input {
border:1px solid #f00;} border: 1px solid #f00;
}
/* Main layout */ .button,
.button:visited {
background: #222;
display: inline-block;
font-size: 16px;
padding: 8px 16px 6px 16px;
width: 160px;
text-align: center;
color: #fff;
font-weight: bold;
text-decoration: none;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
border-bottom: 1px solid rgba(0, 0, 0, 0.25);
position: relative;
cursor: pointer;
font-family: helvetica, arial, sans-serif;
}
.button:hover {
background-color: #111;
color: #fff;
}
.button:active {
top: 1px;
box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
}
.button,
.button:visited,
.green.button,
.green.button:visited {
background-color: #91bd09;
}
.green.button:hover {
background-color: #749a02;
}
.blue.button,
.blue.button:visited {
background-color: #00AEEF;
}
.blue.button:hover {
background-color: #0299d2;
}
body { body {
background: url('../images/page_bg.png') top left repeat-x #c8c8c8; background: url('../images/page_bg.png') top left repeat-x #c8c8c8;
} }
#container { #container {
background: #fff; background: #fff;
width: 840px; width: 840px;
...@@ -230,7 +294,6 @@ body { ...@@ -230,7 +294,6 @@ body {
-moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
} }
#header { #header {
position: relative; position: relative;
height: 71px; height: 71px;
...@@ -241,7 +304,6 @@ body { ...@@ -241,7 +304,6 @@ body {
height: 71px; height: 71px;
float: left; float: left;
} }
#header p { #header p {
width: 400px; width: 400px;
text-align: right; text-align: right;
...@@ -249,16 +311,15 @@ body { ...@@ -249,16 +311,15 @@ body {
padding: 10px 0; padding: 10px 0;
float: right; float: right;
} }
#nav { #nav {
margin: 0 20px; margin: 0 20px;
padding: 2px 10px; padding: 2px 10px;
height: 20px; height: 20px;
background: url('../images/nav_bg.png') top left repeat-x; background: url('../images/nav_bg.png') top left repeat-x;
border-top: 1px solid #aaa; border-top: 1px solid #aaa;
box-shadow:0 3px 2px rgba(0, 0, 0, 0.4); box-shadow: 0 3px 2px rgba(0, 0, 0, 0.4);
-moz-box-shadow:0 3px 2px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0 3px 2px rgba(0, 0, 0, 0.4);
-webkit-box-shadow:0 3px 2px rgba(0, 0, 0, 0.4); -webkit-box-shadow: 0 3px 2px rgba(0, 0, 0, 0.4);
} }
#nav li { #nav li {
margin: 0; margin: 0;
...@@ -282,7 +343,8 @@ body { ...@@ -282,7 +343,8 @@ body {
background-position: 10px 50%; background-position: 10px 50%;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
#nav li a.active, #nav li a:hover { #nav li a.active,
#nav li a:hover {
background-color: #dbefff; background-color: #dbefff;
color: #000; color: #000;
} }
...@@ -305,7 +367,6 @@ body { ...@@ -305,7 +367,6 @@ body {
#nav li a.tickets { #nav li a.tickets {
background-image: url('../images/icons/tix.png'); background-image: url('../images/icons/tix.png');
} }
#content { #content {
padding: 20px 0; padding: 20px 0;
margin: 0 20px; margin: 0 20px;
...@@ -313,7 +374,6 @@ body { ...@@ -313,7 +374,6 @@ body {
height: 350px; height: 350px;
min-height: 350px; min-height: 350px;
} }
#footer { #footer {
text-align: center; text-align: center;
font-size: 11px; font-size: 11px;
...@@ -322,7 +382,6 @@ body { ...@@ -322,7 +382,6 @@ body {
#footer a { #footer a {
color: #333; color: #333;
} }
#footer p { #footer p {
margin: 10px 0 0 0; margin: 10px 0 0 0;
} }
...@@ -333,45 +392,23 @@ body { ...@@ -333,45 +392,23 @@ body {
outline: none; outline: none;
text-indent: -9999px; text-indent: -9999px;
margin: 0 auto; margin: 0 auto;
background: url('../images/poweredby.png?1319571688') top left no-repeat; background: url('../images/poweredby.png') top left no-repeat;
} }
/* Landing page */
#landing_page #new_ticket { #landing_page #new_ticket {
margin-top: 40px; margin-top: 40px;
width: 295px; width: 295px;
padding-left: 75px; padding-left: 75px;
float: left; float: left;
background: url('../images/new_ticket_icon.png?1319577021') top left no-repeat; background: url('../images/new_ticket_icon.png') top left no-repeat;
}
#landing_page #new_ticket input[type=submit] {
background: url('../images/open_ticket_btn.png?1319566422') top left no-repeat;
} }
#landing_page #check_status { #landing_page #check_status {
margin-top: 40px; margin-top: 40px;
width: 295px; width: 295px;
padding-left: 75px; padding-left: 75px;
float: right; float: right;
background: url('../images/check_status_icon.png?1319577072') top left no-repeat; background: url('../images/check_status_icon.png') top left no-repeat;
}
#landing_page #check_status input[type=submit] {
background: url('../images/check_status_btn.png?1319571066') top left no-repeat;
} }
#landing_page form div { /* Landing page FAQ not yet implemented. */
margin-bottom: 20px;
height: 60px;
min-height: 60px;
}
#landing_page form input[type=submit] {
display: block;
width: 192px;
height: 38px;
border: none;
margin: 0;
padding: 0;
text-indent: -9999px;
}
#faq { #faq {
clear: both; clear: both;
margin: 0; margin: 0;
...@@ -381,136 +418,129 @@ body { ...@@ -381,136 +418,129 @@ body {
font-size: 15px; font-size: 15px;
margin-left: 0; margin-left: 0;
padding-left: 0; padding-left: 0;
border-top:1px solid #ddd; border-top: 1px solid #ddd;
} }
#faq ol li { #faq ol li {
list-style: none; list-style: none;
margin: 0; margin: 0;
padding:0; padding: 0;
color: #999; color: #999;
} }
#faq ol li a { #faq ol li a {
display:block; display: block;
padding:5px 0; padding: 5px 0;
height:auto !important; height: auto !important;
overflow:hidden; overflow: hidden;
margin:0; margin: 0;
border-bottom:1px solid #ddd; border-bottom: 1px solid #ddd;
line-height: 16px; line-height: 16px;
padding-left: 24px; padding-left: 24px;
background: url('../images/icons/page.png?1319579499') 0 50% no-repeat; background: url('../images/icons/page.png') 0 50% no-repeat;
} }
#faq ol li a:hover { #faq ol li a:hover {
background-color:#e9f5ff; background-color: #e9f5ff;
} }
#faq .article-meta {
.article-meta { padding: 5px;
padding:5px; background: #fafafa;
background:#fafafa;
} }
/* Knowledgebase */
#kb { #kb {
margin: 2px 0; margin: 2px 0;
padding: 5px; padding: 5px;
overflow: hidden; overflow: hidden;
} }
#kb > li { #kb > li {
padding:10px; padding: 10px;
height:auto !important; height: auto !important;
overflow:hidden; overflow: hidden;
margin:0; margin: 0;
background:url(../images/kb_category_bg.png) bottom left repeat-x; background: url(../images/kb_category_bg.png) bottom left repeat-x;
border-bottom:1px solid #ddd; border-bottom: 1px solid #ddd;
} }
#kb li i {
display:block;
width:32px;
height:32px;
float:left;
margin-right:6px;
background:url(../images/kb_large_folder.png) top left no-repeat;
}
#kb > li h4 { #kb > li h4 {
padding-bottom:3px; padding-bottom: 3px;
margin-bottom:3px; margin-bottom: 3px;
} }
#kb > li h4 span { #kb > li h4 span {
color:#666; color: #666;
} }
#kb > li h4 a { #kb > li h4 a {
font-size: 14px; font-size: 14px;
} }
#kb li i {
display: block;
width: 32px;
height: 32px;
float: left;
margin-right: 6px;
background: url(../images/kb_large_folder.png) top left no-repeat;
}
#kb-search { #kb-search {
padding:10px 0; padding: 10px 0;
overflow:hidden; overflow: hidden;
} }
#kb-search div { #kb-search div {
clear:both; clear: both;
overflow:hidden; overflow: hidden;
padding-top:5px; padding-top: 5px;
} }
#kb-search #query { #kb-search #query {
margin:0; margin: 0;
display:inline-block; display: inline-block;
float:left; float: left;
width:200px; width: 200px;
margin-right:5px; margin-right: 5px;
} }
#kb-search #cid { #kb-search #cid {
margin:0; margin: 0;
display:inline-block; display: inline-block;
float:left; float: left;
width:200px; width: 200px;
margin-right:5px; margin-right: 5px;
position:relative; position: relative;
top:2px; top: 2px;
} }
#kb-search #topic-id { #kb-search #topic-id {
margin:0; margin: 0;
display:inline-block; display: inline-block;
float:left; float: left;
width:410px; width: 410px;
} }
#kb-search #searchSubmit { #kb-search #searchSubmit {
margin:0; margin: 0;
display:inline-block; display: inline-block;
float:left; float: left;
position:relative; position: relative;
top:2px; top: 2px;
} }
#kb-search #breadcrumbs {
#breadcrumbs {
color: #333; color: #333;
margin-bottom: 15px; margin-bottom: 15px;
} }
#breadcrumbs a { #kb-search #breadcrumbs #breadcrumbs a {
color: #555; color: #555;
} }
#ticketForm div,
/* New Ticket & Log In Forms */ #clientLogin div {
#ticketForm div, #clientLogin div {
clear: both; clear: both;
padding: 3px 0; padding: 3px 0;
overflow: hidden; overflow: hidden;
} }
#ticketForm div label, #clientLogin div label { #ticketForm div label,
#clientLogin div label {
display: block; display: block;
width: 140px; width: 140px;
float: left; float: left;
} }
#ticketForm div input, #ticketForm div textarea, #clientLogin div input, #clientLogin div textarea { #ticketForm div label.required,
#clientLogin div label.required {
font-weight: bold;
text-align: left;
}
#ticketForm div input,
#clientLogin div input,
#ticketForm div textarea,
#clientLogin div textarea {
width: auto; width: auto;
border: 1px solid #aaa; border: 1px solid #aaa;
background: #fff; background: #fff;
...@@ -518,23 +548,40 @@ body { ...@@ -518,23 +548,40 @@ body {
display: block; display: block;
float: left; float: left;
} }
#ticketForm div input[type=file],
#ticketForm div input[type=file] { #clientLogin div input[type=file] {
border: 0; border: 0;
} }
#ticketForm div select,
#ticketForm div select, #clientLogin div select { #clientLogin div select {
display: block; display: block;
float: left; float: left;
} }
#ticketForm td textarea, #clientLogin div textarea { #ticketForm div div.captchaRow,
#clientLogin div div.captchaRow {
line-height: 31px;
}
#ticketForm div div.captchaRow input,
#clientLogin div div.captchaRow input {
position: relative;
top: 6px;
}
#ticketForm td textarea,
#clientLogin td textarea,
#ticketForm div textarea,
#clientLogin div textarea {
width: 600px; width: 600px;
} }
#ticketForm td em,
#ticketForm td em, #clientLogin div em { #clientLogin td em,
#ticketForm div em,
#clientLogin div em {
color: #777; color: #777;
} }
#ticketForm td .captcha, #clientLogin div .captcha { #ticketForm td .captcha,
#clientLogin td .captcha,
#ticketForm div .captcha,
#clientLogin div .captcha {
width: 88px; width: 88px;
height: 31px; height: 31px;
background: #000; background: #000;
...@@ -542,44 +589,31 @@ body { ...@@ -542,44 +589,31 @@ body {
float: left; float: left;
margin-right: 20px; margin-right: 20px;
} }
#ticketForm td label.inline, #clientLogin div label.inline { #ticketForm td label.inline,
#clientLogin td label.inline,
#ticketForm div label.inline,
#clientLogin div label.inline {
width: auto; width: auto;
padding: 0 10px; padding: 0 10px;
} }
#ticketForm div.error input,
#ticketTable table tr th { #clientLogin div.error input {
border: 1px solid #a00;
}
#ticketForm div.error label,
#clientLogin div.error label {
color: #a00;
}
#ticketTable th {
width: 160px; width: 160px;
font-weight: normal; font-weight: normal;
text-align: left; text-align: left;
} }
#ticketTable th.required,
#ticketForm table th.required, #ticketForm table td.required, #clientLogin div label.required { #ticketTable td.required {
font-weight: bold; font-weight: bold;
text-align: left; text-align: left;
} }
#ticketForm tr.captchaRow, #clientLogin div.captchaRow {
line-height: 31px;
}
.captchaRow td input, #clientLogin div.captchaRow input {
position: relative;
top: 6px;
}
#ticketForm div.error input, #clientLogin div.error input {
border: 1px solid #a00;
}
#ticketForm div.error label, #clientLogin div.error label {
color: #a00;
}
#clientLogin p {
clear: both;
text-align: center;
}
#clientLogin { #clientLogin {
width: 400px; width: 400px;
margin-top: 20px; margin-top: 20px;
...@@ -587,6 +621,10 @@ body { ...@@ -587,6 +621,10 @@ body {
border: 1px solid #ccc; border: 1px solid #ccc;
background: url('../images/lock.png?1319655200') 440px 50% no-repeat #f6f6f6; background: url('../images/lock.png?1319655200') 440px 50% no-repeat #f6f6f6;
} }
#clientLogin p {
clear: both;
text-align: center;
}
#clientLogin strong { #clientLogin strong {
font-size: 11px; font-size: 11px;
color: #d00; color: #d00;
...@@ -601,59 +639,89 @@ body { ...@@ -601,59 +639,89 @@ body {
width: 120px; width: 120px;
margin-right: 0; margin-right: 0;
} }
#reply {
/* Ticket List */ margin-top: 20px;
padding: 10px 5px;
background: #f9f9f9;
border: 1px solid #ccc;
}
#reply h2 {
margin-bottom: 10px;
}
#reply table {
width: 800px;
}
#reply table td {
vertical-align: top;
}
#reply textarea {
width: 628px !important;
}
#reply input[type=text],
#reply #response_options textarea {
border: 1px solid #aaa;
background: #fff;
}
#reply .attachments .uploads div {
display: inline-block;
padding-right: 20px;
}
#reply .file {
display: inline-block;
padding-left: 20px;
margin-right: 20px;
background: url('../images/icons/file.gif') 0 50% no-repeat;
}
.uploads {
display: inline-block;
padding-right: 20px;
}
.uploads label {
padding: 3px;
padding-right: 10px;
width: auto !important;
}
/* Ticket icons */
.Icon { .Icon {
width: auto; width: auto;
padding-left: 20px; padding-left: 20px;
background-position: left center; background-position: top left;
background-repeat: no-repeat; background-repeat: no-repeat;
color: #006699; color: #006699;
text-decoration: none; text-decoration: none;
} }
a.Icon:hover {
text-decoration: underline;
}
.Icon.Ticket { .Icon.Ticket {
background: url('../images/icons/ticket.gif?1319654018') 0 0 no-repeat; background-image: url('../images/icons/ticket.gif');
} }
.Icon.webTicket { .Icon.webTicket {
background: url('../images/icons/ticket_source_web.gif?1319654283') 0 0 no-repeat; background-image: url('../images/icons/ticket_source_web.gif');
} }
.Icon.emailTicket { .Icon.emailTicket {
background: url('../images/icons/ticket_source_email.gif?1319654484') 0 0 no-repeat; background-image: url('../images/icons/ticket_source_email.gif');
} }
.Icon.phoneTicket { .Icon.phoneTicket {
background: url('../images/icons/ticket_source_phone.gif?1319654401') 0 0 no-repeat; background-image: url('../images/icons/ticket_source_phone.gif');
} }
.Icon.otherTicket { .Icon.otherTicket {
background: url('../images/icons/ticket_source_other.gif?1319654433') 0 0 no-repeat; background-image: url('../images/icons/ticket_source_other.gif');
} }
.Icon.attachment { .Icon.attachment {
background-image: url('../images/icons/attachment.gif?1319556657'); background-image: url('../images/icons/attachment.gif');
} }
.Icon.file { .Icon.file {
background-image: url('../images/icons/attachment.gif?1319556657'); background-image: url('../images/icons/attachment.gif');
} }
.Icon.refresh { .Icon.refresh {
background-image: url('../images/icons/refresh.gif?1319556657'); background-image: url('../images/icons/refresh.gif');
} }
.Icon.thread { .Icon.thread {
font-weight: bold; font-weight: bold;
font-size: 1em; font-size: 1em;
background-image: url('../images/icons/thread.gif?1319556657'); background-image: url('../images/icons/thread.gif?1319556657');
} }
.Icon:hover {
text-decoration: underline;
}
#ticketTable { #ticketTable {
border: 1px solid #aaa; border: 1px solid #aaa;
border-left: none; border-left: none;
...@@ -688,13 +756,11 @@ a.Icon:hover { ...@@ -688,13 +756,11 @@ a.Icon:hover {
#ticketTable tr.alt td { #ticketTable tr.alt td {
background: #f9f9f9; background: #f9f9f9;
} }
#ticketSearchForm { #ticketSearchForm {
display: inline-block; display: inline-block;
float: left; float: left;
padding: 0 0 5px 0; padding: 0 0 5px 0;
} }
a.refresh { a.refresh {
display: block; display: block;
width: auto; width: auto;
...@@ -708,16 +774,14 @@ a.refresh { ...@@ -708,16 +774,14 @@ a.refresh {
color: #333; color: #333;
background-position: 5px 50%; background-position: 5px 50%;
background-repeat: no-repeat; background-repeat: no-repeat;
background-image: url('../images/icons/refresh.png?1319653435'); background-image: url('../images/icons/refresh.png');
} }
.infoTable { .infoTable {
background: #F4FAFF; background: #F4FAFF;
} }
.infoTable th { .infoTable th {
text-align: left; text-align: left;
} }
#ticketThread table { #ticketThread table {
margin-top: 10px; margin-top: 10px;
border: 1px solid #aaa; border: 1px solid #aaa;
...@@ -729,13 +793,11 @@ a.refresh { ...@@ -729,13 +793,11 @@ a.refresh {
font-size: 12px; font-size: 12px;
padding: 5px; padding: 5px;
} }
#ticketThread table th span { #ticketThread table th span {
font-weight:normal; font-weight: normal;
color:#888; color: #888;
padding-left:20px; padding-left: 20px;
} }
#ticketThread table td { #ticketThread table td {
padding: 5px; padding: 5px;
} }
...@@ -761,76 +823,3 @@ a.refresh { ...@@ -761,76 +823,3 @@ a.refresh {
background-position: 0 50%; background-position: 0 50%;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
#reply {
margin-top: 20px;
padding: 10px 5px;
background: #f9f9f9;
border: 1px solid #ccc;
}
#reply h2 {
margin-bottom: 10px;
}
#reply table {
width: 800px;
}
#reply table td {
vertical-align: top;
}
#reply textarea {
width: 628px !important;
}
#reply input[type=text], #reply #response_options textarea {
border: 1px solid #aaa;
background: #fff;
}
#reply .attachments .uploads div {
display: inline-block;
padding-right: 20px;
}
#reply .file {
display: inline-block;
padding-left: 20px;
margin-right: 20px;
background: url('../images/icons/file.gif') 0 50% no-repeat;
}
.button, .button:visited {
background: #222;
display: inline-block;
font-size: 16px;
padding: 8px 16px 6px 16px;
width:160px;
text-align:center;
color: #fff;
font-weight:bold;
text-decoration: none;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
border-bottom: 1px solid rgba(0,0,0,0.25);
position: relative;
cursor: pointer;
font-family:helvetica, arial, sans-serif;
}
.uploads {
display:inline-block;
padding-right:20px;
}
.uploads label { padding:3px; padding-right:10px; width: auto !important }
.button:hover { background-color: #111; color: #fff; }
.button:active { top: 1px; box-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none; }
.button, .button:visited,
.green.button, .green.button:visited { background-color: #91bd09; }
.green.button:hover { background-color: #749a02; }
.blue.button, .blue.button:visited { background-color: #00AEEF; }
.blue.button:hover { background-color: #0299d2; }
html{font-size:100%;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0;font-size:13px;line-height:1.231;padding:0}body,input,select,textarea{font-family:sans-serif;color:#000}b,strong{font-weight:bold}blockquote{margin:1em 40px}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}small{font-size:85%}ul,ol{margin:1em 0;padding:0 0 0 30px}img{border:0;vertical-align:middle}form{margin:0}fieldset{border:0;margin:0;padding:0}label{cursor:pointer}input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle}input{line-height:normal;*overflow:visible}table input{*overflow:auto}input[type="button"],input[type="reset"],input[type="submit"]{cursor:pointer;-webkit-appearance:button}input[type="checkbox"],input[type="radio"]{box-sizing:border-box}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}textarea{overflow:auto;vertical-align:top;resize:vertical}table{border-collapse:collapse;border-spacing:0}th,td{vertical-align:top}th{text-align:left;font-weight:normal}h1,h2,h3,h4,h5,h6,form,fieldset{margin:0;padding:0}a{color:#0072bc;text-decoration:none}h1{color:#00aeef;font-weight:normal;font-size:20px}h3{font-size:16px}h2{font-size:16px;color:#999}.centered{text-align:center}.clear{clear:both;height:1px;visibility:none}.hidden{display:none}.faded{color:#666}#pagination{border:0;margin:0 0 40px 0;padding:0}#pagination li{border:0;margin:0;padding:0;font-size:11px;list-style:none;display:inline}#pagination li a{margin-right:2px;display:block;float:left;padding:3px 6px;text-decoration:none}#pagination li a:hover{color:#ff0084}#pagination .previousOff,#pagination .nextOff{color:#666;display:block;float:left;font-weight:bold;padding:3px 4px}#pagination .next a,#pagination .previous a{font-weight:bold}#pagination .active{color:#000;font-weight:bold;margin-right:2px;display:block;float:left;padding:3px 6px;text-decoration:none}#msg_notice{margin:0;padding:5px 10px 5px 36px;height:16px;line-height:16px;margin-bottom:10px;border:1px solid #0a0;background:url('../images/icons/ok.png') 10px 50% no-repeat #e0ffe0}#msg_warning{margin:0;padding:5px 10px 5px 36px;height:16px;line-height:16px;margin-bottom:10px;border:1px solid #f26522;background:url('../images/icons/alert.png') 10px 50% no-repeat #ffd}#msg_error{margin:0;padding:5px 10px 5px 36px;height:16px;line-height:16px;margin-bottom:10px;border:1px solid #a00;background:url('../images/icons/error.png') 10px 50% no-repeat #fff0f0}.warning{background:#ffc;font-style:italic}.warning strong{text-transform:uppercase;color:#a00;font-style:normal}.error{color:#f00}.error input{border:1px solid #f00}.button,.button:visited{background:#222;display:inline-block;font-size:16px;padding:8px 16px 6px 16px;width:160px;text-align:center;color:#fff;font-weight:bold;text-decoration:none;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;box-shadow:0 1px 3px rgba(0,0,0,0.5);-moz-box-shadow:0 1px 3px rgba(0,0,0,0.5);-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.5);text-shadow:0 -1px 1px rgba(0,0,0,0.25);border-bottom:1px solid rgba(0,0,0,0.25);position:relative;cursor:pointer;font-family:helvetica,arial,sans-serif}.button:hover{background-color:#111;color:#fff}.button:active{top:1px;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none}.button,.button:visited,.green.button,.green.button:visited{background-color:#91bd09}.green.button:hover{background-color:#749a02}.blue.button,.blue.button:visited{background-color:#00aeef}.blue.button:hover{background-color:#0299d2}body{background:url('../images/page_bg.png') top left repeat-x #c8c8c8}#container{background:#fff;width:840px;margin:0 auto;box-shadow:0 0 6px rgba(0,0,0,0.5);-moz-box-shadow:0 0 6px rgba(0,0,0,0.5);-webkit-box-shadow:0 0 6px rgba(0,0,0,0.5)}#header{position:relative;height:71px;padding:0 20px}#header #logo{width:220px;height:71px;float:left}#header p{width:400px;text-align:right;margin:0;padding:10px 0;float:right}#nav{margin:0 20px;padding:2px 10px;height:20px;background:url('../images/nav_bg.png') top left repeat-x;border-top:1px solid #aaa;box-shadow:0 3px 2px rgba(0,0,0,0.4);-moz-box-shadow:0 3px 2px rgba(0,0,0,0.4);-webkit-box-shadow:0 3px 2px rgba(0,0,0,0.4)}#nav li{margin:0;padding:0;list-style:none;display:inline}#nav li a{display:block;width:auto;float:left;height:20px;line-height:20px;text-align:center;padding:0 10px 0 32px;margin-left:10px;color:#333;border-radius:20px;-webkit-border-radius:20px;-moz-border-radius:20px;background-position:10px 50%;background-repeat:no-repeat}#nav li a.active,#nav li a:hover{background-color:#dbefff;color:#000}#nav li a:hover{background-color:#ededed;color:#0054a6}#nav li a.home{background-image:url('../images/icons/home.png')}#nav li a.kb{background-image:url('../images/icons/kb.png')}#nav li a.new{background-image:url('../images/icons/new.png')}#nav li a.status{background-image:url('../images/icons/status.png')}#nav li a.tickets{background-image:url('../images/icons/tix.png')}#content{padding:20px 0;margin:0 20px;height:auto!important;height:350px;min-height:350px}#footer{text-align:center;font-size:11px;color:#333}#footer a{color:#333}#footer p{margin:10px 0 0 0}#footer #poweredBy{display:block;width:126px;height:23px;outline:0;text-indent:-9999px;margin:0 auto;background:url('../images/poweredby.png') top left no-repeat}#landing_page #new_ticket{margin-top:40px;width:295px;padding-left:75px;float:left;background:url('../images/new_ticket_icon.png') top left no-repeat}#landing_page #check_status{margin-top:40px;width:295px;padding-left:75px;float:right;background:url('../images/check_status_icon.png') top left no-repeat}#faq{clear:both;margin:0;padding:5px}#faq ol{font-size:15px;margin-left:0;padding-left:0;border-top:1px solid #ddd}#faq ol li{list-style:none;margin:0;padding:0;color:#999}#faq ol li a{display:block;padding:5px 0;height:auto!important;overflow:hidden;margin:0;border-bottom:1px solid #ddd;line-height:16px;padding-left:24px;background:url('../images/icons/page.png') 0 50% no-repeat}#faq ol li a:hover{background-color:#e9f5ff}#faq .article-meta{padding:5px;background:#fafafa}#kb{margin:2px 0;padding:5px;overflow:hidden}#kb>li{padding:10px;height:auto!important;overflow:hidden;margin:0;background:url(../images/kb_category_bg.png) bottom left repeat-x;border-bottom:1px solid #ddd}#kb>li h4{padding-bottom:3px;margin-bottom:3px}#kb>li h4 span{color:#666}#kb>li h4 a{font-size:14px}#kb li i{display:block;width:32px;height:32px;float:left;margin-right:6px;background:url(../images/kb_large_folder.png) top left no-repeat}#kb-search{padding:10px 0;overflow:hidden}#kb-search div{clear:both;overflow:hidden;padding-top:5px}#kb-search #query{margin:0;display:inline-block;float:left;width:200px;margin-right:5px}#kb-search #cid{margin:0;display:inline-block;float:left;width:200px;margin-right:5px;position:relative;top:2px}#kb-search #topic-id{margin:0;display:inline-block;float:left;width:410px}#kb-search #searchSubmit{margin:0;display:inline-block;float:left;position:relative;top:2px}#kb-search #breadcrumbs{color:#333;margin-bottom:15px}#kb-search #breadcrumbs #breadcrumbs a{color:#555}#ticketForm div,#clientLogin div{clear:both;padding:3px 0;overflow:hidden}#ticketForm div label,#clientLogin div label{display:block;width:140px;float:left}#ticketForm div label.required,#clientLogin div label.required{font-weight:bold;text-align:left}#ticketForm div input,#clientLogin div input,#ticketForm div textarea,#clientLogin div textarea{width:auto;border:1px solid #aaa;background:#fff;margin-right:10px;display:block;float:left}#ticketForm div input[type=file],#clientLogin div input[type=file]{border:0}#ticketForm div select,#clientLogin div select{display:block;float:left}#ticketForm div div.captchaRow,#clientLogin div div.captchaRow{line-height:31px}#ticketForm div div.captchaRow input,#clientLogin div div.captchaRow input{position:relative;top:6px}#ticketForm td textarea,#clientLogin td textarea,#ticketForm div textarea,#clientLogin div textarea{width:600px}#ticketForm td em,#clientLogin td em,#ticketForm div em,#clientLogin div em{color:#777}#ticketForm td .captcha,#clientLogin td .captcha,#ticketForm div .captcha,#clientLogin div .captcha{width:88px;height:31px;background:#000;display:block;float:left;margin-right:20px}#ticketForm td label.inline,#clientLogin td label.inline,#ticketForm div label.inline,#clientLogin div label.inline{width:auto;padding:0 10px}#ticketForm div.error input,#clientLogin div.error input{border:1px solid #a00}#ticketForm div.error label,#clientLogin div.error label{color:#a00}#ticketTable th{width:160px;font-weight:normal;text-align:left}#ticketTable th.required,#ticketTable td.required{font-weight:bold;text-align:left}#clientLogin{width:400px;margin-top:20px;padding:10px 100px 10px 10px;border:1px solid #ccc;background:url('../images/lock.png?1319655200') 440px 50% no-repeat #f6f6f6}#clientLogin p{clear:both;text-align:center}#clientLogin strong{font-size:11px;color:#d00;display:block;padding-left:140px}#clientLogin #email{width:250px;margin-right:0}#clientLogin #ticketno{width:120px;margin-right:0}#reply{margin-top:20px;padding:10px 5px;background:#f9f9f9;border:1px solid #ccc}#reply h2{margin-bottom:10px}#reply table{width:800px}#reply table td{vertical-align:top}#reply textarea{width:628px!important}#reply input[type=text],#reply #response_options textarea{border:1px solid #aaa;background:#fff}#reply .attachments .uploads div{display:inline-block;padding-right:20px}#reply .file{display:inline-block;padding-left:20px;margin-right:20px;background:url('../images/icons/file.gif') 0 50% no-repeat}.uploads{display:inline-block;padding-right:20px}.uploads label{padding:3px;padding-right:10px;width:auto!important}.Icon{width:auto;padding-left:20px;background-position:top left;background-repeat:no-repeat;color:#069;text-decoration:none}.Icon.Ticket{background-image:url('../images/icons/ticket.gif')}.Icon.webTicket{background-image:url('../images/icons/ticket_source_web.gif')}.Icon.emailTicket{background-image:url('../images/icons/ticket_source_email.gif')}.Icon.phoneTicket{background-image:url('../images/icons/ticket_source_phone.gif')}.Icon.otherTicket{background-image:url('../images/icons/ticket_source_other.gif')}.Icon.attachment{background-image:url('../images/icons/attachment.gif')}.Icon.file{background-image:url('../images/icons/attachment.gif')}.Icon.refresh{background-image:url('../images/icons/refresh.gif')}.Icon.thread{font-weight:bold;font-size:1em;background-image:url('../images/icons/thread.gif?1319556657')}.Icon:hover{text-decoration:underline}#ticketTable{border:1px solid #aaa;border-left:none;border-bottom:0}#ticketTable caption{padding:5px;text-align:left;color:#000;background:#ddd;border:1px solid #aaa;border-bottom:0;font-weight:bold}#ticketTable th{height:24px;line-height:24px;background:#e1f2ff;border:1px solid #aaa;border-right:0;border-top:0}#ticketTable th a{color:#000}#ticketTable td{padding:2px;border:1px solid #aaa;border-right:0;border-top:0}#ticketTable tr.alt td{background:#f9f9f9}#ticketSearchForm{display:inline-block;float:left;padding:0 0 5px 0}a.refresh{display:block;width:auto;float:right;height:20px;line-height:20px;text-align:center;padding:0 10px 0 28px;border:1px solid #aaa;margin-left:10px;color:#333;background-position:5px 50%;background-repeat:no-repeat;background-image:url('../images/icons/refresh.png')}.infoTable{background:#f4faff}.infoTable th{text-align:left}#ticketThread table{margin-top:10px;border:1px solid #aaa;border-bottom:2px solid #aaa}#ticketThread table th{text-align:left;border-bottom:1px solid #aaa;font-size:12px;padding:5px}#ticketThread table th span{font-weight:normal;color:#888;padding-left:20px}#ticketThread table td{padding:5px}#ticketThread .message th{background:#d8efff}#ticketThread .response th{background:#ddd}#ticketThread .info{padding:2px;background:#f9f9f9;border-top:1px solid #ddd;height:16px;line-height:16px}#ticketThread .info a{display:inline-block;margin:5px 10px 5px 0;padding-left:24px;height:16px;line-height:16px;background-position:0 50%;background-repeat:no-repeat}
\ No newline at end of file
/* Typography */
a {
color: #0072bc;
text-decoration: none;
}
h1 {
color: #00AEEF;
font-weight: normal;
font-size: 20px;
}
h3 {
font-size: 16px;
}
h2 {
font-size: 16px;
color: #999;
}
/* Helpers */
.centered { text-align: center;}
.clear { clear:both; height: 1px; visibility: none;}
.hidden { display: none;}
.faded { color:#666;}
/* Pagination */
#pagination {
border: 0;
margin: 0 0 40px 0;
padding: 0;
li {
border: 0;
margin: 0;
padding: 0;
font-size: 11px;
list-style: none;
display: inline;
a {
margin-right: 2px;
display: block;
float: left;
padding: 3px 6px;
text-decoration: none;
}
a:hover {
color: #ff0084;
}
}
.previousOff, .nextOff {
color: #666;
display: block;
float: left;
font-weight: bold;
padding: 3px 4px;
}
.next a, .previous a {
font-weight: bold;
}
.active {
color: #000;
font-weight: bold;
margin-right: 2px;
display: block;
float: left;
padding: 3px 6px;
text-decoration: none;
}
}
/* Alerts & Notices */
#msg_notice { margin: 0; padding: 5px 10px 5px 36px; height: 16px; line-height: 16px; margin-bottom: 10px; border: 1px solid #0a0; background: url('../images/icons/ok.png') 10px 50% no-repeat #e0ffe0; }
#msg_warning { margin: 0; padding: 5px 10px 5px 36px; height: 16px; line-height: 16px; margin-bottom: 10px; border: 1px solid #f26522; background: url('../images/icons/alert.png') 10px 50% no-repeat #ffffdd; }
#msg_error { margin: 0; padding: 5px 10px 5px 36px; height: 16px; line-height: 16px; margin-bottom: 10px; border: 1px solid #a00; background: url('../images/icons/error.png') 10px 50% no-repeat #fff0f0; }
.warning {
background: #ffc;
font-style: italic;
strong {
text-transform: uppercase;
color: #a00;
font-style: normal;
}
}
.error {
color:#f00;
input {
border:1px solid #f00;
}
}
.button, .button:visited {
background: #222;
display: inline-block;
font-size: 16px;
padding: 8px 16px 6px 16px;
width:160px;
text-align:center;
color: #fff;
font-weight:bold;
text-decoration: none;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
border-bottom: 1px solid rgba(0,0,0,0.25);
position: relative;
cursor: pointer;
font-family:helvetica, arial, sans-serif;
}
.button:hover { background-color: #111; color: #fff; }
.button:active { top: 1px; box-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none; }
.button, .button:visited,
.green.button, .green.button:visited { background-color: #91bd09; }
.green.button:hover { background-color: #749a02; }
.blue.button, .blue.button:visited { background-color: #00AEEF; }
.blue.button:hover { background-color: #0299d2; }
#kb {
margin: 2px 0;
padding: 5px;
overflow: hidden;
> li {
padding:10px;
height:auto !important;
overflow:hidden;
margin:0;
background:url(../images/kb_category_bg.png) bottom left repeat-x;
border-bottom:1px solid #ddd;
h4 {
padding-bottom:3px;
margin-bottom:3px;
span {
color:#666;
}
a {
font-size: 14px;
}
}
}
li {
i {
display:block;
width:32px;
height:32px;
float:left;
margin-right:6px;
background:url(../images/kb_large_folder.png) top left no-repeat;
}
}
}
#kb-search {
padding:10px 0;
overflow:hidden;
div {
clear:both;
overflow:hidden;
padding-top:5px;
}
#query {
margin:0;
display:inline-block;
float:left;
width:200px;
margin-right:5px;
}
#cid {
margin:0;
display:inline-block;
float:left;
width:200px;
margin-right:5px;
position:relative;
top:2px;
}
#topic-id {
margin:0;
display:inline-block;
float:left;
width:410px;
}
#searchSubmit {
margin:0;
display:inline-block;
float:left;
position:relative;
top:2px;
}
#breadcrumbs {
color: #333;
margin-bottom: 15px;
#breadcrumbs a {
color: #555;
}
}
}
#landing_page {
#new_ticket {
margin-top: 40px;
width: 295px;
padding-left: 75px;
float: left;
background: url('../images/new_ticket_icon.png') top left no-repeat;
}
#check_status {
margin-top: 40px;
width: 295px;
padding-left: 75px;
float: right;
background: url('../images/check_status_icon.png') top left no-repeat;
}
}
/* Landing page FAQ not yet implemented. */
#faq {
clear: both;
margin: 0;
padding: 5px;
ol {
font-size: 15px;
margin-left: 0;
padding-left: 0;
border-top:1px solid #ddd;
li {
list-style: none;
margin: 0;
padding:0;
color: #999;
a {
display:block;
padding:5px 0;
height:auto !important;
overflow:hidden;
margin:0;
border-bottom:1px solid #ddd;
line-height: 16px;
padding-left: 24px;
background: url('../images/icons/page.png') 0 50% no-repeat;
}
a:hover {
background-color:#e9f5ff;
}
}
}
.article-meta {
padding:5px;
background:#fafafa;
}
}
body {
background: url('../images/page_bg.png') top left repeat-x #c8c8c8;
}
#container {
background: #fff;
width: 840px;
margin: 0 auto;
box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
}
#header {
position: relative;
height: 71px;
padding: 0 20px;
#logo {
width: 220px;
height: 71px;
float: left;
}
p {
width: 400px;
text-align: right;
margin: 0;
padding: 10px 0;
float: right;
}
}
#nav {
margin: 0 20px;
padding: 2px 10px;
height: 20px;
background: url('../images/nav_bg.png') top left repeat-x;
border-top: 1px solid #aaa;
box-shadow:0 3px 2px rgba(0, 0, 0, 0.4);
-moz-box-shadow:0 3px 2px rgba(0, 0, 0, 0.4);
-webkit-box-shadow:0 3px 2px rgba(0, 0, 0, 0.4);
li {
margin: 0;
padding: 0;
list-style: none;
display: inline;
a {
display: block;
width: auto;
float: left;
height: 20px;
line-height: 20px;
text-align: center;
padding: 0 10px 0 32px;
margin-left: 10px;
color: #333;
border-radius: 20px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
background-position: 10px 50%;
background-repeat: no-repeat;
}
a.active, a:hover {
background-color: #dbefff;
color: #000;
}
a:hover {
background-color: #ededed;
color: #0054a6;
}
a.home { background-image: url('../images/icons/home.png'); }
a.kb { background-image: url('../images/icons/kb.png'); }
a.new { background-image: url('../images/icons/new.png'); }
a.status { background-image: url('../images/icons/status.png'); }
a.tickets { background-image: url('../images/icons/tix.png'); }
}
}
#content {
padding: 20px 0;
margin: 0 20px;
height: auto !important;
height: 350px;
min-height: 350px;
}
#footer {
text-align: center;
font-size: 11px;
color: #333;
a {
color: #333;
}
p {
margin: 10px 0 0 0;
}
#poweredBy {
display: block;
width: 126px;
height: 23px;
outline: none;
text-indent: -9999px;
margin: 0 auto;
background: url('../images/poweredby.png') top left no-repeat;
}
}
\ No newline at end of file
#header, #nav, #meta, #footer, #reply, #pagination, .reload, .refresh, form, .thread, hr, #kbAttachments, .back {
display: none;
}
th {
text-align: left;
}
a {
color: #000;
text-decoration: none;
}
caption {
text-align: left;
padding-bottom: 10px;
font-weight: bold;
}
.message, .response {
border-bottom: 1px solid #000;
margin-bottom: 20px;
padding-bottom: 10px;
th {
font-size: 12pt;
font-weight: bold;
padding-bottom: 5px;
}
}
html {
font-size: 100%;
overflow-y: scroll;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
body {
margin: 0;
font-size: 13px;
line-height: 1.231;
padding: 0;
}
body, input, select, textarea {
font-family: sans-serif;
color: #000;
}
b, strong {
font-weight: bold;
}
blockquote {
margin: 1em 40px;
}
hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
margin: 1em 0;
padding: 0;
}
small {
font-size: 85%;
}
ul, ol {
margin: 1em 0;
padding: 0 0 0 30px;
}
img {
border: 0;
vertical-align: middle;
}
form {
margin: 0;
}
fieldset {
border: 0;
margin: 0;
padding: 0;
}
label {
cursor: pointer;
}
input, select, textarea {
font-size: 100%;
margin: 0;
vertical-align: baseline;
*vertical-align: middle;
}
input {
line-height: normal;
*overflow: visible;
}
table input {
*overflow: auto;
}
input[type="button"], input[type="reset"], input[type="submit"] {
cursor: pointer;
-webkit-appearance: button;
}
input[type="checkbox"], input[type="radio"] {
box-sizing: border-box;
}
input[type="search"] {
-webkit-appearance: textfield;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
textarea {
overflow: auto;
vertical-align: top;
resize: vertical;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
th, td {
vertical-align: top;
}
th { text-align: left; font-weight: normal; }
h1, h2, h3, h4, h5, h6, form, fieldset {
margin: 0;
padding: 0;
}
\ No newline at end of file
@import 'reset';
@import 'base';
@import 'main-layout';
@import 'landing-page';
@import 'kb';
@import 'ticket-forms';
@import 'ticket';
#ticketForm, #clientLogin {
div {
clear: both;
padding: 3px 0;
overflow: hidden;
label {
display: block;
width: 140px;
float: left;
}
label.required {
font-weight: bold;
text-align: left;
}
input, textarea {
width: auto;
border: 1px solid #aaa;
background: #fff;
margin-right: 10px;
display: block;
float: left;
}
input[type=file] {
border: 0;
}
select {
display: block;
float: left;
}
div.captchaRow {
line-height: 31px;
input {
position: relative;
top: 6px;
}
}
}
td, div {
textarea {
width: 600px;
}
em {
color: #777;
}
.captcha {
width: 88px;
height: 31px;
background: #000;
display: block;
float: left;
margin-right: 20px;
}
label.inline {
width: auto;
padding: 0 10px;
}
}
div.error {
input {
border: 1px solid #a00;
}
label {
color: #a00;
}
}
}
#ticketTable {
th {
width: 160px;
font-weight: normal;
text-align: left;
}
th.required, td.required {
font-weight: bold;
text-align: left;
}
}
#clientLogin {
width: 400px;
margin-top: 20px;
padding: 10px 100px 10px 10px;
border: 1px solid #ccc;
background: url('../images/lock.png?1319655200') 440px 50% no-repeat #f6f6f6;
p {
clear: both;
text-align: center;
}
strong {
font-size: 11px;
color: #d00;
display: block;
padding-left: 140px;
}
#email {
width: 250px;
margin-right: 0;
}
#ticketno {
width: 120px;
margin-right: 0;
}
}
#reply {
margin-top: 20px;
padding: 10px 5px;
background: #f9f9f9;
border: 1px solid #ccc;
h2 {
margin-bottom: 10px;
}
table {
width: 800px;
td {
vertical-align: top;
}
}
textarea {
width: 628px !important;
}
input[type=text], #response_options textarea {
border: 1px solid #aaa;
background: #fff;
}
.attachments .uploads div {
display: inline-block;
padding-right: 20px;
}
.file {
display: inline-block;
padding-left: 20px;
margin-right: 20px;
background: url('../images/icons/file.gif') 0 50% no-repeat;
}
}
.uploads {
display:inline-block;
padding-right:20px;
label {
padding:3px;
padding-right:10px;
width: auto !important
}
}
\ No newline at end of file
/* Ticket icons */
.Icon {
width: auto;
padding-left: 20px;
background-position: top left;
background-repeat: no-repeat;
color: #006699;
text-decoration: none;
}
.Icon.Ticket { background-image: url('../images/icons/ticket.gif') }
.Icon.webTicket { background-image: url('../images/icons/ticket_source_web.gif'); }
.Icon.emailTicket { background-image: url('../images/icons/ticket_source_email.gif'); }
.Icon.phoneTicket { background-image: url('../images/icons/ticket_source_phone.gif'); }
.Icon.otherTicket { background-image: url('../images/icons/ticket_source_other.gif'); }
.Icon.attachment { background-image: url('../images/icons/attachment.gif'); }
.Icon.file { background-image: url('../images/icons/attachment.gif'); }
.Icon.refresh { background-image: url('../images/icons/refresh.gif'); }
.Icon.thread {
font-weight: bold;
font-size: 1em;
background-image: url('../images/icons/thread.gif?1319556657');
}
.Icon:hover {
text-decoration: underline;
}
#ticketTable {
border: 1px solid #aaa;
border-left: none;
border-bottom: none;
caption {
padding: 5px;
text-align: left;
color: #000;
background: #ddd;
border: 1px solid #aaa;
border-bottom: none;
font-weight: bold;
}
th {
height: 24px;
line-height: 24px;
background: #e1f2ff;
border: 1px solid #aaa;
border-right: none;
border-top: none;
a {
color: #000;
}
}
td {
padding: 2px;
border: 1px solid #aaa;
border-right: none;
border-top: none;
}
tr.alt td {
background: #f9f9f9;
}
}
#ticketSearchForm {
display: inline-block;
float: left;
padding: 0 0 5px 0;
}
a.refresh {
display: block;
width: auto;
float: right;
height: 20px;
line-height: 20px;
text-align: center;
padding: 0 10px 0 28px;
border: 1px solid #aaa;
margin-left: 10px;
color: #333;
background-position: 5px 50%;
background-repeat: no-repeat;
background-image: url('../images/icons/refresh.png');
}
.infoTable {
background: #F4FAFF;
th {
text-align: left;
}
}
#ticketThread {
table {
margin-top: 10px;
border: 1px solid #aaa;
border-bottom: 2px solid #aaa;
th {
text-align: left;
border-bottom: 1px solid #aaa;
font-size: 12px;
padding: 5px;
span {
font-weight:normal;
color:#888;
padding-left:20px;
}
}
td {
padding: 5px;
}
}
.message th { background: #d8efff; }
.response th { background: #ddd; }
.info {
padding: 2px;
background: #f9f9f9;
border-top: 1px solid #ddd;
height: 16px;
line-height: 16px;
a {
display: inline-block;
margin: 5px 10px 5px 0;
padding-left: 24px;
height: 16px;
line-height: 16px;
background-position: 0 50%;
background-repeat: no-repeat;
}
}
}
...@@ -10,7 +10,7 @@ header("Content-Type: text/html; charset=UTF-8\r\n"); ...@@ -10,7 +10,7 @@ header("Content-Type: text/html; charset=UTF-8\r\n");
<meta name="description" content="customer support platform"> <meta name="description" content="customer support platform">
<meta name="keywords" content="osTicket, Customer support system, support ticket system"> <meta name="keywords" content="osTicket, Customer support system, support ticket system">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="<?php echo ASSETS_PATH; ?>css/theme.css" media="screen"> <link rel="stylesheet" href="<?php echo ASSETS_PATH; ?>css/theme.min.css" media="screen">
<link rel="stylesheet" href="<?php echo ASSETS_PATH; ?>css/print.css" media="print"> <link rel="stylesheet" href="<?php echo ASSETS_PATH; ?>css/print.css" media="print">
<script src="<?php echo ROOT_PATH; ?>js/jquery-1.7.2.min.js"></script> <script src="<?php echo ROOT_PATH; ?>js/jquery-1.7.2.min.js"></script>
<script src="<?php echo ROOT_PATH; ?>js/jquery.multifile.js"></script> <script src="<?php echo ROOT_PATH; ?>js/jquery.multifile.js"></script>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment