Commit bd3e1be5 authored by Andrey Cherepanov's avatar Andrey Cherepanov

Set new design of Alterator web-interface

parent a1d404a4
components/ahttpd/images/attention.gif

1.64 KB | W: | H:

components/ahttpd/images/attention.gif

1.61 KB | W: | H:

components/ahttpd/images/attention.gif
components/ahttpd/images/attention.gif
components/ahttpd/images/attention.gif
components/ahttpd/images/attention.gif
  • 2-up
  • Swipe
  • Onion skin
components/ahttpd/images/clock-face.png

29.4 KB | W: | H:

components/ahttpd/images/clock-face.png

19.5 KB | W: | H:

components/ahttpd/images/clock-face.png
components/ahttpd/images/clock-face.png
components/ahttpd/images/clock-face.png
components/ahttpd/images/clock-face.png
  • 2-up
  • Swipe
  • Onion skin
/* 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-top: 6px;
margin-bottom: 6px;
}
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,56 @@ 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;
-moz-border-radius: 0.3em;
-webkit-border-radius: 0.3em;
-khtml-border-radius: 0.3em;
border-radius: 0.3em;
background-color: #eaecf2;
font-size: 9pt;
margin: 0px 5px 1px 5px;
padding: 2px 4px;
border: 1px solid #c4c4c4;
background-color: white;
vertical-align: middle;
}
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;
}
.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;
vertical-align: middle;
}
.btn:hover, button:hover, #main .btn, .box .btn {
font-weight: bold;
color: #FFFFFF;
background-color: #455a85;
border: 1px solid #1b2575;
}
-moz-box-shadow: 5px 5px 6px #a6a6a6;
-webkit-box-shadow: 5px 5px 6px #a6a6a6;
box-shadow: 5px 5px 6px #a6a6a6;
#main .btn:hover, .box .btn:hover {
background-color: #5b76af;
}
.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@;
div#top .btn {
width: 7em;
}
.box {
......@@ -117,8 +125,10 @@ 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 {
......@@ -167,10 +177,11 @@ 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;
min-width:10px;
......@@ -182,6 +193,10 @@ color:#@MIDDLE_LABELS_HEX@;
border-radius: 7px;
}
.alterator-attention-message a {
color: darkred;
}
.alterator-attention-message img {
vertical-align:middle;
}
......@@ -196,15 +211,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 +230,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 +242,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 +276,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 +296,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 +312,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 +343,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: 204px;
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 #306AC4;
border-spacing: 0;
}
table.alterator-listbox thead tr th, table.alterator-listbox tfoot tr th {
......@@ -395,7 +396,10 @@ table.alterator-listbox thead tr th, table.alterator-listbox tfoot tr th {
font-size: 8pt;
margin: 0px;
padding: 4px;
color: #@DARK_LABELS_HEX@;
color: #242a60;
background-color: #e6e6e6;
border: 1px solid #306AC4;
vertical-align: middle;
}
table.alterator-listbox thead tr .header {
......@@ -404,20 +408,17 @@ 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: #306ac4 solid 1px;
}
table.alterator-listbox tbody tr.odd td {
......@@ -457,7 +458,8 @@ table.alterator-listbox thead tr .headerSortDown {
}
table.alterator-listbox thead tr .headerSortDown, table.alterator-listbox thead tr .headerSortUp {
background-color: #@LIGHT_LABELS_HEX@;
color: white;
background-color: #00a5d2;
}
/* states */
......@@ -465,7 +467,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 +494,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 +517,50 @@ 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 {
border-bottom: 1px solid #36A1CC;
}
/* resizeable */
......@@ -555,51 +582,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,13 +650,12 @@ 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;
}
......@@ -695,7 +721,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 +741,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 +760,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 +786,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 +798,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;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment