Fix web-interface logo and style

This commit is contained in:
Andrey Cherepanov 2013-08-07 17:11:40 +04:00
parent a048e40de6
commit 1e29a2a20f
2 changed files with 221 additions and 176 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 7.3 KiB

View File

@ -1,16 +1,16 @@
/* basic elements and widgets */
body {
background-color: #@LIGHT_COLOR_HEX@;
color: #@DARK_LABELS_HEX@;
margin: 0px;
background-color: white;
margin: 5px;
padding: 10px;
font-family : Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
font-family : "Liberation Sans", Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 9pt;
width: 85%;
}
a {
color: #@DARK_LABELS_HEX@;
color: #0088bf;
font-weight: bold;
}
@ -21,9 +21,14 @@ a {
table {
font-size: 9pt;
border-color: #@MIDDLE_COLOR_HEX@;
border-color: #306ac4;
border-spacing: 0px;
/* border-collapse: collapse;*/
border-collapse: collapse;
}
#main table {
margin: 0;
margin-bottom: 0;
}
th {
@ -45,15 +50,15 @@ hr {
h1 {
text-align: center;
margin: 0px;
color: #@DARK_LABELS_HEX@;
color: black;
}
h2 {
color: #@DARK_LABELS_HEX@;
color: black;
}
h3 {
color: #@DARK_LABELS_HEX@;
color: black;
}
@ -61,53 +66,61 @@ textarea, select, input.text {
/*border: 1px solid #e2e6eb; #MIDDLE_LABELS_HEX@;*/ /*FIX NEEDED!!!!!*/
font-size: 8pt;
margin: 1px 3px 1px 0px;
padding: 1px 3px;
border-color: #c1c3cb;
font-size: 9pt;
margin: 0px 5px 1px 5px;
padding: 2px 4px;
border: 1px solid #c4c4c4;
background-color: white;
vertical-align: middle;
}
-moz-border-radius: 0.3em;
-webkit-border-radius: 0.3em;
-khtml-border-radius: 0.3em;
border-radius: 0.3em;
background-color: #eaecf2;
select {
background-color: #e6e6e6;
}
fieldset {
border: 1px solid #c4c4c4;
margin-bottom: 6px;
}
input.text[disabled], select[disabled]{
background-color: #e2e6eb;
background-color: #e2e6eb;
}
.disabled{
color:#@MIDDLE_LABELS_HEX@;
color:#666666;
}
small {
margin-left: 5px;
margin-bottom: 3px;
}
.btn, button {
background-image: url(/design/images/button-active.png);
background-repeat:repeat-x;
color: #@DARK_LABELS_HEX@;
border: 1px solid #@MIDDLE_COLOR_HEX@;
-moz-border-radius: 0.7em;
-webkit-border-radius: 0.7em;
-khtml-border-radius: 0.7em;
border-radius: 0.7em;
color: black;
background-color: #dbeef6;
border: 1px solid #36a1cc;
cursor: pointer;
font-size: 9pt;
font-weight: bold;
padding: 2.5px 10px;
-moz-box-shadow: 5px 5px 6px #a6a6a6;
-webkit-box-shadow: 5px 5px 6px #a6a6a6;
box-shadow: 5px 5px 6px #a6a6a6;
vertical-align: middle;
}
.btn:hover, button:hover {
background-image: url(/design/images/button-passive.png);
background-repeat:repeat-x;
color: #@LIGHT_LABELS_HEX@;
border: 1px solid #@DARK_LABELS_HEX@;
.btn:hover, button:hover, #main .btn, .box .btn {
font-weight: bold;
color: #FFFFFF;
background-color: #455a85;
border: 1px solid #1b2575;
}
#main .btn:hover, .box .btn:hover {
background-color: #5b76af;
}
div#top .btn {
width: 7em;
}
.box {
@ -117,13 +130,15 @@ color:#@MIDDLE_LABELS_HEX@;
padding: 10px 20px;
padding-top: 10px;
background-color: #cfd4e3;
border: 1px solid #@SHADOW_HEX@;
background-color: #dbeef6;
border: 1px solid #36a1cc;
-moz-border-radius: 0;
-webkit-border-radius: 0;
}
.next-page-button,.prev-page-button,.first-page-button,.last-page-button {
width: 25px;
height: 20px;
width: 31px;
height: 25px;
vertical-align:middle;
cursor: pointer;
}
@ -145,8 +160,8 @@ color:#@MIDDLE_LABELS_HEX@;
}
.close-dialog-button {
width: 22px;
height: 22px;
width: 27px;
height: 27px;
border: 0px;
cursor: pointer;
background: url(/design/images/close-dialog-button.png) no-repeat;
@ -167,14 +182,15 @@ color:#@MIDDLE_LABELS_HEX@;
.alterator-attention-message {
color: darkred;
border-color: darkred;
border-color: #cf7878;
border-width: 5px;
border-style: double;
padding: 4px;
border-style: solid;
background-color: #e8cfcf;
padding: 14px;
margin: 4px;
margin-bottom: 10px;
min-width:10px;
float:left;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
@ -182,6 +198,10 @@ color:#@MIDDLE_LABELS_HEX@;
border-radius: 7px;
}
.alterator-attention-message a {
color: darkred;
}
.alterator-attention-message img {
vertical-align:middle;
}
@ -196,15 +216,16 @@ canvas.alterator-clock {
.year {
font-weight: bold;
color:#@DARK_LABELS_HEX@;
font-size:10pt;
/*background-color: #F4F8F9;*/
color: black;
font-size: 10pt;
vertical-align: middle;
}
.month {
font-weight:bold;
color:#@DARK_LABELS_HEX@;
font-size:10pt;
color: black;
font-size: 10pt;
vertical-align: middle;
}
.week {
@ -214,7 +235,7 @@ canvas.alterator-clock {
}
.today {
border: 1px solid #@DARK_LABELS_HEX@;
border: 1px solid #242a60;
cursor: pointer;
background-image: url(/design/images/button-passive.png);
@ -226,29 +247,30 @@ canvas.alterator-clock {
.day {
border-style:solid;
border-width:1px;
background-color: #@LIGHT_LABELS_HEX@;
background-color: #FFFFFF;
cursor: pointer;
}
.day:hover {
background-color: #@MIDDLE_COLOR_HEX@;
background-color: #306ac4;
}
.alterator-dateedit-calendar table {
width: 100%;
text-align: center;
background-image: url(/design/images/table-header.png);
background-repeat:repeat-x;
background-color: #ebebeb;
margin-top: 10px;
/* background-image: url(/design/images/table-header.png);
background-repeat:repeat-x;*/
-webkit-border-top-left-radius: 0.7em;
/* -webkit-border-top-left-radius: 0.7em;
-webkit-border-top-right-radius: 0.7em;
-moz-border-radius-topleft: 0.7em;
-moz-border-radius-topright: 0.7em;
border-top-left-radius: 0.7em;
border-top-right-radius: 0.7em;
/*border-width: 2px;
border-style: solid;
border-color: #242a60;*/
border-top-right-radius: 0.7em;*/
/*border: 2px solid #242a60;*/
border: 2px solid #c4c4c4;
border-collapse: collapse;
/*
@ -259,9 +281,9 @@ border-color: #242a60;*/
-webkit-border-top-right-radius: 4px;
*/
-moz-box-shadow: 0 0 8px 0.2em #a6a6a6;
/* -moz-box-shadow: 0 0 8px 0.2em #a6a6a6;
-webkit-box-shadow: 0 0 8px 0.2em #a6a6a6;
box-shadow: 0 0 8px 0.2em #a6a6a6;
box-shadow: 0 0 8px 0.2em #a6a6a6;*/
}
.alterator-dateedit-calendar td {
@ -279,13 +301,14 @@ border-color: #242a60;*/
/* main menu */
#main, #box {
margin-top: 14px;
padding: 10px 20px;
padding-top: 10px;
background-color: #cfd4e3;
border: 1px solid #@MIDDLE_COLOR_HEX@;
-moz-border-radius: 0.8em;
-webkit-border-radius: 0.8em;
background-color: #dbeef6;
border: 1px solid #36a1cc;
-moz-border-radius: 0;
-webkit-border-radius: 0;
}
#main-td {
@ -294,37 +317,30 @@ border-color: #242a60;*/
}
#menu-td {
padding-right: 10px;
padding-top: 10px;
}
#menu {
/*padding: 10px;*/
background-color: white;
border: 1px solid #c1c3cb;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
-khtml-border-radius: 7px;
border-radius: 7px;
padding: 0;
margin-right: 10px;
}
.menu-item-normal a {
font-weight: normal;
text-decoration: none;
color: #@DARK_LABELS_HEX@;
color: black;
}
.menu-item-selected a {
font-weight: bold;
text-decoration: none;
color: #@DARK_LABELS_HEX@;
color: #0088bf;
padding-top: 10px;
margin-top: 10px;
width: 200px;
}
.menu-item-normal {
padding-left: 20px;
padding-left: 10px;
width: 100%;
padding-right: 4px;
margin-top: 3px;
@ -332,58 +348,48 @@ border-color: #242a60;*/
}
.menu-item-selected {
background-image: url(/design/images/menu-selected.png);
background-repeat:repeat-y;
padding-left: 20px;
width: 80%;
color: #0088bf;
background-color: #dbeef6;
padding-left: 10px;
padding-top: 3px;
padding-bottom: 3px;
padding-right: 3px;
margin-top: 3px;
margin-bottom: 2px;
margin-right: 10px;
}
.menu-item-normal a:hover {
color: #0088bf;
}
.menu-group-name {
color: #@DARK_LABELS_HEX@;
/*background-image: url(/design/images/menu-header.png);*/
background-repeat:repeat-x;
width: 224px;
color: #0088bf;
height: 16px;
background: url(/design/images/section.png) no-repeat 0px 23px;
font-size: 10pt;
padding-top: 3px;
padding-bottom: 3px;
padding-bottom: 10px;
padding-right: 4px;
padding-left: 10px;
margin: 10px;
margin-top: 10px;
margin-bottom: 8px;
margin-right: 10px;
font-weight: bold;
border-bottom: 3px solid #6aacf1;
}
/* tables */
table.alterator-listbox {
font-family:arial;
margin:10px 0pt 15px;
/*margin:10px 0pt 15px;*/
font-size: 8pt;
width: 100%;
text-align: left;
/* border: solid 1px;*/
-webkit-border-top-left-radius: 0.7em;
-webkit-border-top-right-radius: 0.7em;
-moz-border-radius-topleft: 0.7em;
-moz-border-radius-topright: 0.7em;
border-top-left-radius: 0.7em;
border-top-right-radius: 0.7em;
border-style:solid;
border-color:#242a60;
border-width: 1px;
border-spacing:0px;
background-image: url(/design/images/table-header.png);
background-repeat:repeat-x;
border: 1px solid #808080;
border-spacing: 0;
}
table.alterator-listbox thead tr th, table.alterator-listbox tfoot tr th {
@ -395,7 +401,14 @@ table.alterator-listbox thead tr th, table.alterator-listbox tfoot tr th {
font-size: 8pt;
margin: 0px;
padding: 4px;
color: #@DARK_LABELS_HEX@;
color: black;
background-color: #e6e6e6;
border: 1px solid #808080;
vertical-align: middle;
}
table.alterator-listbox thead tr th:hover, table.alterator-listbox tfoot tr th:hover {
background-color: #d6d6d6;
}
table.alterator-listbox thead tr .header {
@ -404,24 +417,21 @@ table.alterator-listbox thead tr .header {
background-position: center right;
cursor: pointer;
padding-right: 24px;
border-right: #@MIDDLE_COLOR_HEX@ solid 1px;
}
table.alterator-listbox tbody td {
color: #@DARK_COLOR_HEX@;
color: #001056;
padding: 4px;
background-color: #@LIGHT_LABELS_HEX@;
background-color: #FFFFFF;
vertical-align: top;
/*border-left: solid 1px;
border-right: solid 1px;
border:none;*/
border-right: #@MIDDLE_COLOR_HEX@ solid 1px;
border-right: 1px solid #808080;
}
table.alterator-listbox tbody tr.odd td {
background-color:#eaecf2;
background-color:#f0f0f0;
/*border:none;*/
}
@ -457,7 +467,7 @@ table.alterator-listbox thead tr .headerSortDown {
}
table.alterator-listbox thead tr .headerSortDown, table.alterator-listbox thead tr .headerSortUp {
background-color: #@LIGHT_LABELS_HEX@;
background-color: #d6d6d6;
}
/* states */
@ -465,7 +475,7 @@ table.alterator-listbox thead tr .headerSortDown, table.alterator-listbox thead
.ui-state-disabled {
cursor: default !important;
color: #c3c7cb;
background-color: #e2e6eb;
/*background-color: #e2e6eb;*/
}
.btn.ui-state-disabled {
@ -492,16 +502,14 @@ table.alterator-listbox thead tr .headerSortDown, table.alterator-listbox thead
.ui-state-disabled {
cursor: default !important;
color: #c3c7cb;
background-color: #@LIGHT_COLOR_HEX@;
/* background-color: #F5F5F5;*/
}
.btn.ui-state-disabled {
color: #@MIDDLE_LABELS_HEX@;
background-color: #@MIDDLE_COLOR_HEX@;
}
.btn.ui-state-disabled:hover {
background-color: #@MIDDLE_COLOR_HEX@;
#main .btn.ui-state-disabled, #main .btn.ui-state-disabled:hover {
cursor: default !important;
color: #c3c7cb;
background-color: #E2E6EB;
border: 1px solid #c0c0c0;
}
/* progressbar */
@ -517,23 +525,54 @@ table.alterator-listbox thead tr .headerSortDown, table.alterator-listbox thead
/* accordion */
div.alterator-accordion h3 {
background-color: #eaecf2;
background-color: #DBEEF6;
font-size: 9pt;
padding-top: 3px;
padding-bottom: 3px;
padding-left: 24px;
margin: 2px;
margin: 0px;
border-top: 1px solid #36A1CC;
border-left: 1px solid #36A1CC;
border-right: 1px solid #36A1CC;
background-image: url(/design/images/right.gif);
background-repeat: no-repeat;
background-position: center left;
cursor: pointer;
outline: none;
}
div.alterator-accordion h3.ui-state-active {
background-image: url(/design/images/asc.gif);
color: #0088bf;
background-image: url(/design/images/bottom.gif);
background-repeat: no-repeat;
background-position: center left;
cursor: pointer;
}
/* TODO: don't work */
div.alterator-accordion .btn {
font-weight: bold;
color: black;
background-color: #dbeef6;
border: 1px solid #36a1cc;
}
div.alterator-accordion div {
padding: 10px 10px 5px 15px;
border-top: 1px solid #36A1CC;
border-left: 1px solid #36A1CC;
border-right: 1px solid #36A1CC;
}
div.alterator-accordion td {
white-space: nowrap;
}
div.alterator-accordion {
border-bottom: 1px solid #36A1CC;
}
/* resizeable */
@ -555,51 +594,51 @@ div.alterator-accordion h3.ui-state-active {
/* corner radius */
.ui-corner-tl {
-moz-border-radius-topleft: 4px;
-webkit-border-top-left-radius: 4px;
-moz-border-radius-topleft: 0px;
-webkit-border-top-left-radius: 0px;
}
.ui-corner-tr {
-moz-border-radius-topright: 4px;
-webkit-border-top-right-radius: 4px;
-moz-border-radius-topright: 0px;
-webkit-border-top-right-radius: 0px;
}
.ui-corner-bl {
-moz-border-radius-bottomleft: 4px;
-webkit-border-bottom-left-radius: 4px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-bottom-left-radius: 0px;
}
.ui-corner-br {
-moz-border-radius-bottomright: 4px;
-webkit-border-bottom-right-radius: 4px;
-moz-border-radius-bottomright: 0px;
-webkit-border-bottom-right-radius: 0px;
}
.ui-corner-top {
-moz-border-radius-topleft: 4px;
-webkit-border-top-left-radius: 4px;
-moz-border-radius-topright: 4px;
-webkit-border-top-right-radius: 4px;
-moz-border-radius-topleft: 0px;
-webkit-border-top-left-radius: 0px;
-moz-border-radius-topright: 0px;
-webkit-border-top-right-radius: 0px;
}
.ui-corner-bottom {
-moz-border-radius-bottomleft: 4px;
-webkit-border-bottom-left-radius: 4px;
-moz-border-radius-bottomright: 4px;
-webkit-border-bottom-right-radius: 4px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-bottom-left-radius: 0px;
-moz-border-radius-bottomright: 0px;
-webkit-border-bottom-right-radius: 0px;
}
.ui-corner-right {
-moz-border-radius-topright: 4px;
-webkit-border-top-right-radius: 4px;
-moz-border-radius-bottomright: 4px;
-webkit-border-bottom-right-radius: 4px;
-moz-border-radius-topright: 0px;
-webkit-border-top-right-radius: 0px;
-moz-border-radius-bottomright: 0px;
-webkit-border-bottom-right-radius: 0px;
}
.ui-corner-left {
-moz-border-radius-topleft: 4px;
-webkit-border-top-left-radius: 4px;
-moz-border-radius-bottomleft: 4px;
-webkit-border-bottom-left-radius: 4px;
-moz-border-radius-topleft: 0px;
-webkit-border-top-left-radius: 0px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-bottom-left-radius: 0px;
}
.ui-corner-all {
@ -623,16 +662,19 @@ div.alterator-accordion h3.ui-state-active {
/* dialog */
.ui-widget-content {
background-color: #@LIGHT_LABELS_HEX@;
border: 1px solid #@MIDDLE_COLOR_HEX@;
background-color: #FFFFFF;
}
.ui-widget-header {
color: #EAEDEF;
background-color: #@MIDDLE_COLOR_HEX@;
background-color: #306ac4;
font-weight: bold;
}
.ui-dialog {
border: 2px solid #c4c4c4;
}
.ui-dialog .ui-dialog-title {
float: left;
margin: .1em 0 .2em;
@ -670,14 +712,17 @@ div.alterator-accordion h3.ui-state-active {
.ui-dialog .ui-dialog-buttonpane button {
float: right;
margin: .5em .4em .5em 0;
cursor: pointer;
width:auto;
overflow:visible;
font-weight: bold;
color: #FFFFFF;
background-color: #455a85;
border: 1px solid #1b2575;
}
.ui-icon-closethick {
width: 22px;
height: 22px;
width: 27px;
height: 27px;
text-indent: -99999px;
overflow: hidden;
background: url(/design/images/close-dialog-button.png) no-repeat;
@ -695,7 +740,7 @@ div.alterator-accordion h3.ui-state-active {
/* help button */
.ui-help-button {
background-color: #@LIGHT_LABELS_HEX@;
background-color: #FFFFFF;
margin-bottom: 10px;
padding-top: 7px;
@ -715,17 +760,15 @@ div.alterator-accordion h3.ui-state-active {
#top {
text-align:left;
/*background: url(/design/images/header-gradient.png) repeat-x;*/
padding: 0em;
margin-bottom: 0px;
border-bottom: 1px solid #c1c3cb;
border-bottom: 1px solid #ebebeb;
}
#product-logo {
background: url(/design/images/product-logo.png) no-repeat;
width: 194px;
height: 56px;
width: 348px;
height: 52px;
border: 0px;
padding: 0px;
margin: 0px;
@ -736,14 +779,16 @@ div.alterator-accordion h3.ui-state-active {
padding-right: 1em;
text-align: left;
color: #@DARK_LABELS_HEX@;
color: black;
font-family: "DejaVu Sans",Verdana,Tahoma,Helvetica;
font-weight: bold;
text-decoration: none;
font-size:large;
text-transform: uppercase;
}
.top-button {
padding-right: 10px;
padding-left: 10px;
}
@ -760,7 +805,7 @@ div.alterator-accordion h3.ui-state-active {
#help-popup {
padding-left: 10px;
padding-right: -30px;
background-color: #@LIGHT_LABELS_HEX@;
background-color: #FFFFFF;
border: 1px solid #c1c3cb;
-moz-border-radius: 0.5em;
@ -772,10 +817,10 @@ div.alterator-accordion h3.ui-state-active {
.hresizeable {
width: 100%;
height: 7px;
background:#@DARK_COLOR_HEX@ url(/design/images/hgrabber.gif) no-repeat scroll 45%;
background:#001056 url(/design/images/hgrabber.gif) no-repeat scroll 45%;
cursor: s-resize;
}
.hresizeable:hover {
background-color: #@MIDDLE_COLOR_HEX@;
background-color: #306ac4;
}