Free cookie consent management tool by TermsFeed Policy Generator

source: branches/OaaS/HeuristicLab.Services.Optimization.Web/Content/Site.css @ 9062

Last change on this file since 9062 was 9062, checked in by fschoepp, 11 years ago

#1888:
Backend changes:

  • Simplified job state detection (only one hive call will be made to detect all states now, instead of one additional call per job)
  • Reorganized classes (moved model classes into Model folder)

Website changes:

  • Website now heavily uses JavaScript to achieve better user experience
  • JavaScript degrades gracefully, except for plots
  • Tables: Added jquery-datatable-plugin to extend tables (pagination + search functionality)
  • OaaS-Website now uses the design of the HL websites (found in WebApplication branch)
  • Added jqplot to render zoomable line plots for HL-Datatables
  • Styling.js: Plots will be generated by using an ajax call; additional jquery-styling occurs within this file.
  • Added jquery-ui-1.9.2 which is capable of handling/rendering tabs, accordions and resizers.
File size: 5.7 KB
Line 
1/*----------------------------------------------------------
2The base color for this template is #5c87b2. If you'd like
3to use a different color start by replacing all instances of
4#5c87b2 with your new color.
5----------------------------------------------------------*/
6body {
7    background-color: #5c87b2;
8    font-size: .85em;
9    font-family: "Trebuchet MS", Verdana, Helvetica, Sans-Serif;
10    margin: 0;
11    padding: 0;
12    color: #696969;
13}
14
15a:link {
16    color: #034af3;
17    text-decoration: underline;
18}
19
20a:visited {
21    color: #505abc;
22}
23
24a:hover {
25    color: #1d60ff;
26    text-decoration: none;
27}
28
29a:active {
30    color: #12eb87;
31}
32
33p, ul {
34    margin-bottom: 20px;
35    line-height: 1.6em;
36}
37
38header,
39footer,
40nav,
41section {
42    display: block;
43}
44
45/* HEADINGS   
46----------------------------------------------------------*/
47h1, h2, h3, h4, h5, h6 {
48    font-size: 1.5em;
49    color: #000;
50}
51
52h1 {
53    font-size: 2em;
54    padding-bottom: 0;
55    margin-bottom: 0;
56}
57
58h2 {
59    padding: 0 0 10px 0;
60}
61
62h3 {
63    font-size: 1.2em;
64}
65
66h4 {
67    font-size: 1.1em;
68}
69
70h5, h6 {
71    font-size: 1em;
72}
73
74/* PRIMARY LAYOUT ELEMENTS   
75----------------------------------------------------------*/
76
77/* you can specify a greater or lesser percentage for the
78page width. Or, you can specify an exact pixel width. */
79.page {
80    width: 90%;
81    margin-left: auto;
82    margin-right: auto;
83}
84
85header, #header {
86    position: relative;
87    margin-bottom: 0px;
88    color: #000;
89    padding: 0;
90}
91
92header h1, #header h1 {
93    font-weight: bold;
94    padding: 5px 0;
95    margin: 0;
96    color: #fff;
97    border: none;
98    line-height: 2em;
99    font-size: 32px !important;
100    text-shadow: 1px 1px 2px #111;
101}
102
103#main {
104    padding: 30px 30px 15px 30px;
105    background-color: #fff;
106    border-radius: 4px 0 0 0;
107    -webkit-border-radius: 4px 0 0 0;
108    -moz-border-radius: 4px 0 0 0;
109}
110
111footer,
112#footer {
113    background-color: #fff;
114    color: #999;
115    padding: 10px 0;
116    text-align: center;
117    line-height: normal;
118    margin: 0 0 30px 0;
119    font-size: .9em;
120    border-radius: 0 0 4px 4px;
121    -webkit-border-radius: 0 0 4px 4px;
122    -moz-border-radius: 0 0 4px 4px;
123}
124
125/* TAB MENU   
126----------------------------------------------------------*/
127ul#menu {
128    border-bottom: 1px #5C87B2 solid;
129    padding: 0 0 2px;
130    position: relative;
131    margin: 0;
132    text-align: right;
133}
134
135ul#menu li {
136    display: inline;
137    list-style: none;
138}
139
140ul#menu li#greeting {
141    padding: 10px 20px;
142    font-weight: bold;
143    text-decoration: none;
144    line-height: 2.8em;
145    color: #fff;
146}
147
148ul#menu li a {
149    padding: 10px 20px;
150    font-weight: bold;
151    text-decoration: none;
152    line-height: 2.8em;
153    background-color: #e8eef4;
154    color: #034af3;
155    border-radius: 4px 4px 0 0;
156    -webkit-border-radius: 4px 4px 0 0;
157    -moz-border-radius: 4px 4px 0 0;
158}
159
160ul#menu li a:hover {
161    background-color: #fff;
162    text-decoration: none;
163}
164
165ul#menu li a:active {
166    background-color: #a6e2a6;
167    text-decoration: none;
168}
169
170ul#menu li.selected a {
171    background-color: #fff;
172    color: #000;
173}
174
175/* FORM LAYOUT ELEMENTS   
176----------------------------------------------------------*/
177
178fieldset {
179    border: 1px solid #ddd;
180    padding: 0 1.4em 1.4em 1.4em;
181    margin: 0 0 1.5em 0;
182}
183
184legend {
185    font-size: 1.2em;
186    font-weight: bold;
187}
188
189textarea {
190    min-height: 75px;
191}
192
193input[type="text"],
194input[type="password"] {
195    border: 1px solid #ccc;
196    padding: 2px;
197    font-size: 1.2em;
198    color: #444;
199    width: 200px;
200}
201
202input[type="text"]
203{
204    width: 200px;
205}
206
207select {
208    border: 1px solid #ccc;
209    padding: 2px;
210    font-size: 1.2em;
211    color: #444;
212}
213
214input[type="submit"] {
215    font-size: 1.2em;
216    padding: 5px;
217}
218
219/* TABLE
220----------------------------------------------------------*/
221
222table {
223    border: solid 1px #e8eef4;
224    border-collapse: collapse;
225}
226
227table td {
228    padding: 5px;
229    border: solid 1px #e8eef4;
230}
231
232table th {
233    padding: 6px 5px;
234    text-align: left;
235    background-color: #e8eef4;
236    border: solid 1px #e8eef4;
237}
238
239/* MISC 
240----------------------------------------------------------*/
241.clear {
242    clear: both;
243}
244
245.error {
246    color: Red;
247}
248
249nav,
250#menucontainer {
251    margin-top: 40px;
252}
253
254div#title {
255    display: block;
256    float: left;
257    text-align: left;
258}
259
260#logindisplay {
261    font-size: 1.1em;
262    display: block;
263    text-align: right;
264    margin: 10px;
265    color: White;
266}
267
268#logindisplay a:link {
269    color: white;
270    text-decoration: underline;
271}
272
273#logindisplay a:visited {
274    color: white;
275    text-decoration: underline;
276}
277
278#logindisplay a:hover {
279    color: white;
280    text-decoration: none;
281}
282
283/* Styles for validation helpers
284-----------------------------------------------------------*/
285.field-validation-error {
286    color: #ff0000;
287}
288
289.field-validation-valid {
290    display: none;
291}
292
293.input-validation-error {
294    border: 1px solid #ff0000;
295    background-color: #ffeeee;
296}
297
298.validation-summary-errors {
299    font-weight: bold;
300    color: #ff0000;
301}
302
303.validation-summary-valid {
304    display: none;
305}
306
307/* Styles for editor and display helpers
308----------------------------------------------------------*/
309.display-label,
310.editor-label {
311    margin: 1em 0 0 0;
312}
313
314.display-field,
315.editor-field {
316    margin: 0.5em 0 0 0;
317}
318
319.text-box {
320    width: 30em;
321}
322
323.text-box.multi-line {
324    height: 6.5em;
325}
326
327.tri-state {
328    width: 6em;
329}
330
331div.scroll
332{
333    height: 400px;
334    width: 400px;
335    overflow: auto;
336}
Note: See TracBrowser for help on using the repository browser.