You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
492 lines
10 KiB
492 lines
10 KiB
/* These are all EXAMPLES -- they are meant to be updated/changed/modified */
|
|
body { font: 12px 'Verdana', 'Arial', 'Helvetica'; }
|
|
|
|
|
|
|
|
/* Standard HTML Form Controls */
|
|
input.button {
|
|
border: 1px solid #A1D771;
|
|
font: 11px 'Arial', 'Helvetica';
|
|
font-weight: bold; background-color: #CEFD58;
|
|
}
|
|
input.button:hover {
|
|
background-color: #fff;
|
|
}
|
|
|
|
input.textbox, textarea.textbox {
|
|
font: 1.1em 'Arial', 'Helvetica';
|
|
width: 300px;
|
|
background-color: #FCFDC3;
|
|
border: 1px solid #A1D771;
|
|
padding: 2px 3px 2px 3px;
|
|
}
|
|
textarea.textbox {
|
|
width: 400px;
|
|
height: 320px;
|
|
}
|
|
input.textbox:focus, textarea.textbox:focus {
|
|
background-color: #fff;
|
|
border-color: #A1D771;
|
|
}
|
|
|
|
select.listbox {
|
|
font: 12px 'Arial', 'Helvetica';
|
|
width: 208px;
|
|
background-color: #CEFD58;
|
|
border: 1px solid #A1D771;
|
|
}
|
|
select.listbox:focus {
|
|
background-color: #fff;
|
|
border-color: #A1D771;
|
|
}
|
|
a.listboxReset {
|
|
font-family: verdana, arial, helvetica;
|
|
font-size: 8pt;
|
|
text-decoration: none;
|
|
color: #337;
|
|
}
|
|
a.listboxReset:hover {
|
|
text-decoration:
|
|
underline;
|
|
}
|
|
|
|
/**
|
|
* Various QControl-specific Styles
|
|
*/
|
|
|
|
/* QFileAsset */
|
|
div.fileassetDbox {
|
|
border: 4px solid #333;
|
|
background-color: #fff;
|
|
padding: 20px;
|
|
width: 400px;
|
|
overflow: auto;
|
|
}
|
|
div.fileassetDbox h1 {
|
|
margin: 0;
|
|
}
|
|
div.fileassetDbox input {
|
|
padding: 3px;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
/* QDialogBox */
|
|
div.dialogbox {
|
|
border: 4px solid #333;
|
|
background-color: #fff;
|
|
padding: 20px;
|
|
width: 400px;
|
|
overflow: auto;
|
|
}
|
|
|
|
/* QDateTimePicker */
|
|
span.datetimepicker { }
|
|
span.datetimepicker select {
|
|
font: 12px 'Arial', 'Helvetica';
|
|
background-color: #CEFD58;
|
|
border: 1px solid #A1D771;
|
|
}
|
|
span.datetimepicker select:focus {
|
|
background-color: #fff;
|
|
border-color: #A1D771;
|
|
}
|
|
span.datetimepicker select.month {
|
|
width: 55px;
|
|
}
|
|
span.datetimepicker select.day {
|
|
width: 45px;
|
|
margin-left: 8px;
|
|
}
|
|
span.datetimepicker select.year {
|
|
width: 60px;
|
|
margin-left: 8px;
|
|
}
|
|
span.datetimepicker select.hour {
|
|
width: 65px;
|
|
margin-left: 12px;
|
|
margin-right: 2px;
|
|
}
|
|
span.datetimepicker select.minute {
|
|
width: 45px;
|
|
margin-left: 2px;
|
|
margin-right: 2px; }
|
|
span.datetimepicker select.second {
|
|
width: 45px;
|
|
margin-left: 2px;
|
|
}
|
|
|
|
/* QDataGrid */
|
|
table.datagrid {
|
|
border: 1px solid #A1D771;
|
|
}
|
|
table.datagrid caption, table.datagrid tfoot {
|
|
padding-bottom: 4px;
|
|
overflow: auto;
|
|
}
|
|
table.datagrid span.left {
|
|
float: left;
|
|
font-size: 10px;
|
|
display: block;
|
|
}
|
|
table.datagrid span.right {
|
|
float: right;
|
|
font-size: 10px;
|
|
display: block;
|
|
}
|
|
table.datagrid tr {
|
|
background-color: #fff;
|
|
}
|
|
table.datagrid tr.alternate {
|
|
background-color: #CEFD58;
|
|
}
|
|
table.datagrid th {
|
|
background-color: #A1D771;
|
|
padding: 3px 5px 3px 5px;
|
|
text-align: left;
|
|
}
|
|
table.datagrid th a {
|
|
color: #000;
|
|
text-decoration: none;
|
|
}
|
|
table.datagrid th a:hover {
|
|
color: #000;
|
|
text-decoration: underline;
|
|
}
|
|
table.datagrid td {
|
|
padding: 5px;
|
|
}
|
|
table.datagrid td a {
|
|
color: #000;
|
|
}
|
|
table.datagrid td a:hover {
|
|
color: #000;
|
|
text-decoration: none;
|
|
}
|
|
table.datagrid tfoot {
|
|
border-top: 1px solid #A1D771;
|
|
}
|
|
|
|
/* QPaginator */
|
|
span.paginator {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
span.paginator span {
|
|
list-style-type:none; display: inline;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
span.paginator span.page a {
|
|
text-decoration: none;
|
|
color: #000000;
|
|
padding: 0 3px 0 3px;
|
|
margin: 0 2px 0 2px;
|
|
}
|
|
span.paginator span.page a:hover {
|
|
background-color: #ccf;
|
|
}
|
|
span.paginator span.arrow {
|
|
font-weight: bold;
|
|
color: #ccc; margin: 0;
|
|
padding: 0 3px 0 3px;
|
|
}
|
|
span.paginator span.arrow a {
|
|
font-weight: bold;
|
|
color: #000;
|
|
text-decoration: none;
|
|
}
|
|
span.paginator span.selected {
|
|
font-weight: bold;
|
|
background-color: #ccf;
|
|
padding: 0 3px 0 3px;
|
|
margin: 0 2px 0 2px;
|
|
border: 1px;
|
|
border-style: solid;
|
|
}
|
|
span.paginator span.break {
|
|
color: #666;
|
|
margin: 0 5px 0 5px;
|
|
}
|
|
span.paginator span.ellipsis {
|
|
color: #666;
|
|
}
|
|
|
|
/* QCalendar */
|
|
div.calendar {
|
|
width: 200px;
|
|
border: 1px solid #337;
|
|
background-color: #ccf;
|
|
}
|
|
div.calendar div.navigator {
|
|
background-color: #337;
|
|
overflow: auto;
|
|
height: 100%;
|
|
color: #fff;
|
|
padding: 2px 6px 2px 6px;
|
|
}
|
|
div.calendar div.navigator div.left {
|
|
float: left;
|
|
}
|
|
div.calendar div.navigator div.month {
|
|
float: left;
|
|
width: 80px;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
font-size: 11px;
|
|
}
|
|
div.calendar div.navigator div.year {
|
|
float: right;
|
|
}
|
|
div.calendar div.navigator div.year span {
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
margin-left: 6px;
|
|
margin-right: 6px;
|
|
}
|
|
div.calendar div.navigator a {
|
|
color: #fff;
|
|
text-decoration: none;
|
|
}
|
|
div.calendar div.navigator a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
div.calendar table {
|
|
border: 0;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
div.calendar th {
|
|
text-align: center;
|
|
border: 0;
|
|
padding: 4px 2px 4px 2px;
|
|
font-weight: bold;
|
|
font-size: 10px;
|
|
}
|
|
div.calendar td {
|
|
text-align: center;
|
|
border-width: 0 0 1px 0;
|
|
border-style: solid;
|
|
border-color: black;
|
|
padding: 0;
|
|
}
|
|
div.calendar td.lastRow {
|
|
border-width: 0;
|
|
}
|
|
div.calendar td a {
|
|
text-decoration: none;
|
|
color: #000;
|
|
display: block;
|
|
padding: 2px 6px 2px 6px;
|
|
}
|
|
div.calendar td.today {
|
|
background-color: #bbd;
|
|
}
|
|
|
|
div.calendar td.nonMonth a {
|
|
color: #A1D771;
|
|
}
|
|
div.calendar td.selected {
|
|
background-color: #c9a;
|
|
font-weight: bold;
|
|
}
|
|
div.calendar td a:hover {
|
|
background-color: #CEFD58;
|
|
color: #000;
|
|
}
|
|
div.calendar div.options {
|
|
text-align: center;
|
|
background-color: #337;
|
|
}
|
|
div.calendar div.options a {
|
|
color: #fff;
|
|
font-size: 10px;
|
|
text-decoration: none;
|
|
}
|
|
div.calendar div.options a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
/**
|
|
* Styles for Custom Render Functions as defined in QControl.class.php
|
|
*/
|
|
|
|
div.renderWithName {
|
|
padding: 4px 0 4px 0;
|
|
overflow: auto;
|
|
height: 100%;
|
|
}
|
|
div.renderWithName div.left {
|
|
float: left;
|
|
width: 200px;
|
|
margin-right: 25px;
|
|
}
|
|
div.renderWithName div.required {
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
}
|
|
div.renderWithName div.left span.instructions {
|
|
font: 10px 'Verdana', 'Arial', 'Helvetica';
|
|
color: #999; font-style: italic;
|
|
text-transform: none;
|
|
}
|
|
|
|
div.renderWithName div.right { }
|
|
div.renderWithName div.right span.error {
|
|
margin-left: 15px;
|
|
font: 10px 'Verdana', 'Arial', 'Helvetica';
|
|
color: #600;
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
* Form and Dashboard Draft-Specific Styles
|
|
* NOTE: because these are page specific, we use element IDs instead of
|
|
* element classes for most items here
|
|
* (e.g. we will never have more than one titleBar per page)
|
|
*/
|
|
|
|
div#titleBar {
|
|
background-color: #535E14; /* olive green*/
|
|
border: 1px solid #337;
|
|
margin-bottom: 18px;
|
|
text-align: center;
|
|
}
|
|
div#titleBar h2 {
|
|
/* background-color: #535E14; /* olive green*/ */
|
|
font: 12px 'Georgia', 'Times New Roman', 'Times';
|
|
font-style: italic;
|
|
font-weight: bold;
|
|
color: #fff;
|
|
margin: 0;
|
|
padding: 2px 5px 2px 5px;
|
|
float: none;
|
|
}
|
|
div#titleBar h2#right {
|
|
float: right;
|
|
font: 10px 'Verdana', 'Arial', 'Helvetica';
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
}
|
|
div#titleBar h2#right a {
|
|
color: #fff;
|
|
text-decoration: none;
|
|
}
|
|
div#titleBar h2#right a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
div#titleBar h1 {
|
|
/* font: 28px 'Georgia', 'Times New Roman', 'Times'; */
|
|
font: 'Georgia', 'Times New Roman', 'Times';
|
|
color: #fffeee;
|
|
margin: 0;
|
|
padding: 2px 0 2px 5px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
p.create { }
|
|
p.create a {
|
|
text-decoration: none;
|
|
color: #337;
|
|
font-weight: bold;
|
|
}
|
|
p.create a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
div#draftList { }
|
|
div#draftList h1 {
|
|
margin: 0;
|
|
font: 20px 'Georgia', 'Times New Roman', 'Times';
|
|
font-weight: bold;
|
|
}
|
|
div#draftList p {
|
|
margin-top: 6px;
|
|
margin-bottom: 18px;
|
|
}
|
|
/*
|
|
div#formControls {
|
|
padding: 0 0 0 20px;
|
|
}
|
|
|
|
div#formActions {
|
|
background-color: #A1D771;
|
|
padding: 10px;
|
|
height: 20px;
|
|
margin-top: 18px;
|
|
}
|
|
div#formActions div#save {
|
|
float: left;
|
|
}
|
|
div#formActions div#cancel {
|
|
margin-left: 10px;
|
|
float: left;
|
|
}
|
|
div#formActions div#delete {
|
|
float: right;
|
|
}*/
|
|
div#dashboard { }
|
|
div#dashboard div#left {
|
|
float: left;
|
|
width: 20%;
|
|
height: 1000px;
|
|
font-size: 10px;
|
|
color: #fff;
|
|
background-color: #535E14;
|
|
border: 1px double #000;
|
|
padding: 5px;
|
|
margin-left: 1em;
|
|
}
|
|
div#dashboard div#right {
|
|
position: relative;
|
|
float: left;
|
|
margin-left: 10px;
|
|
/* width: 760px; */
|
|
width: 75%;
|
|
}
|
|
div#dashboard div#right div#pnlList {
|
|
margin-bottom: 10px;
|
|
border: 1px solid #000;
|
|
padding: 5px;
|
|
/* height: 300px; */
|
|
overflow: auto;
|
|
}
|
|
div#dashboard div#right div#pnlEdit {
|
|
border: 1px solid #000;
|
|
padding: 5px;
|
|
background-color: #CEFD58;
|
|
/* height: 240px; */
|
|
overflow: auto;
|
|
}
|
|
|
|
|
|
#classNames {
|
|
position: relative;
|
|
border-width: 0px 1px 1px 1px;
|
|
border-style: double;
|
|
width:100%;
|
|
overflow: auto;
|
|
border-color: #224499;
|
|
}
|
|
|
|
div.className {
|
|
font-style: bold;
|
|
font-size: 1.2em;
|
|
font-family: georgia, helvetica, serif;
|
|
border-top: 2px solid gray;
|
|
border-bottom: 2px solid black;
|
|
border-left: 2px solid gray;
|
|
border-right: 2px solid black;
|
|
padding: 2px;
|
|
cursor: pointer;
|
|
position: relative;
|
|
background-color: #FFD16F;
|
|
color: black;
|
|
}
|
|
div.className:hover {
|
|
border-top: 2px solid black;
|
|
border-bottom: 2px solid gray;
|
|
border-left: 2px solid black;
|
|
border-right: 2px solid gray;
|
|
}
|
|
|