19
a:link, a:visited, a:hover, a:active, a.fakelink {
21
text-decoration: none;
24
a:hover, a.fakelink:hover {
25
text-decoration: underline;
43
margin: 0.5em 0 0.5em 0.5em;
22
a:hover, a:active, a:focus {
51
30
/** Special styles for header section **/
54
33
position: absolute;
55
background-color: #abf;
56
background-image: url(../ivle.webapp.core/images/chrome/topbar-slashes.png);
57
background-repeat: repeat-x;
34
background-color: #fea;
59
36
border-bottom: 1px solid black;
60
/* IMPORTANT: This 2em is hard-coded elsewhere in this file. Search for
37
/* IMPORTANT: This 5.3em is hard-coded elsewhere in this file. Search for
61
38
* #ivleheader.height to update it. */
65
42
z-index: 1; /* Background to all, but the body */
68
/* Now we have lots of breadcrumb styles.
69
The breadcrumbs are <li>s in a <ul>. Each <li> has either an <a> or
70
a <span> inside it, with the label of the breadcrumb. <li>s may also
71
have an <ul> inside them, which is a menu that pops up on hover.
76
list-style-type: none;
79
ul#ivle_breadcrumbs > li {
80
background: url(../ivle.webapp.core/images/chrome/breadcrumb-chevron.png) scroll no-repeat right;
87
ul#ivle_breadcrumbs > li > a {
91
vertical-align: middle;
92
text-decoration: none;
96
ul#ivle_breadcrumbs > li > a > img {
97
vertical-align: middle;
100
/* There is no breadcrumb to the left of the first one, so there is no margin.
101
We add a special one. */
102
ul#ivle_breadcrumbs > li:first-child > a {
106
ul#ivle_breadcrumbs > li > span {
110
vertical-align: middle;
113
ul#ivle_breadcrumbs > li > a:hover {
114
text-decoration: underline;
117
ul#ivle_breadcrumbs > li > ul {
119
list-style-type: none;
124
left: -21px; /* Just meets the chevron on the left. */
128
border: 1px solid #dee4ff;
132
ul#ivle_breadcrumbs > li:first-child > ul {
133
left: 0; /* Don't want the IVLE menu to run off the LHS. */
136
ul#ivle_breadcrumbs > li:hover > ul {
140
ul#ivle_breadcrumbs > li > ul > li {
144
/* The IVLE crumb's menu items are extra high, with icons. */
145
ul#ivle_breadcrumbs > li:first-child > ul > li > a {
147
vertical-align: middle;
151
ul#ivle_breadcrumbs > li > ul > li > a {
155
ul#ivle_breadcrumbs > li > ul > li:hover {
159
ul#ivle_breadcrumbs > li.crumbmenu > a {
160
background: url(../ivle.webapp.core/images/chrome/drop-down.png) scroll no-repeat right;
164
45
#ivleheader_text {
46
/* Pad left and right. */
165
47
position: absolute;
51
z-index: 3; /* In front */
54
/* Special "IVLE" and "Informatics Virtual Learning Environment" titles */
171
73
/* Note: The body has NO PADDING by default (unlike plain HTML).
186
88
/* Apps can optionally have a <div id="ivle_padding"> as the outermost
187
89
* element, if 1em of padding is desired (otherwise there will be no padding).
188
* Note: No top padding, since the first element should have a margins (p or
192
padding: 0 1em 1em 1em;
195
/* Add extra vertical spacing between major page sections. */
196
#ivle_padding .majorsection {
200
#ivle_padding .majorsection > * {
204
#ivle_padding .majorsection > h2:first-child {
206
margin-bottom: 0.3em;
213
.userhello .username {
102
p.userhello .username {
214
103
font-weight: bold;
106
/* The tabs bar is positioned absolutely, unlike the other header content.
107
* This allows it to be aligned exactly with the bottom of the header bar.
111
height: 5.3em; /* == #ivleheader.height */
118
z-index: 2; /* In front of background, behind text */
122
/* This allows for a single paragraph, currently used to display a warning
130
/* The apptabs ul is aligned to the bottom of #ivleheader_tabs */
135
right: 1em; /* == #ivleheader.padding-right */
142
border: 1px solid black;
143
background-color: #fc6;
146
ul#apptabs li:hover {
147
background-color: #fd8;
149
/* Currently active app tab */
150
ul#apptabs li.thisapp {
151
background-color: white;
152
border-bottom: 1px solid white;
156
color: navy; /* Text colour not to change */
157
text-decoration: none;
217
160
/* Terms of Service accept / decline buttons */
218
161
#tos_acceptbuttons {
219
162
text-align: center;
222
form.verticalform div {
226
form.verticalform div label {
235
form.verticalform.thin div label {
239
form.verticalform div.submit {
243
form.verticalform.thin div.submit {
247
.stackedform div label {
258
border-collapse: collapse;
261
.pretty_table td, .pretty_table th {
262
padding: 0.2em 0.7em;
263
border-bottom: 1px solid #ccc;
267
border-bottom: 2px solid gray;
270
.pretty_table tbody td {
274
.pretty_table tbody tr:hover {
275
background-color: #efefef;
278
.pretty_table td:first-child, .pretty_table th:first-child {
282
.pretty_table tbody tr:hover td {
287
margin-bottom: 0.5em;
290
/* Action links have a 16x16 icon on the left. */
304
background-position: left center;
305
background-repeat: no-repeat;
309
background-image: url(images/interface/add.png);
313
background-image: url(images/interface/delete.png);
317
background-image: url(images/interface/pencil.png);
321
background-image: url(images/interface/error.png);
325
background-image: url(images/interface/key.png);
329
background-image: url(images/interface/wrench.png);
333
background-image: url(images/interface/group.png);
337
background-image: url(../ivle.webapp.tutorial/tutorial-small.png);
341
background-image: url(../ivle.webapp.tutorial/images/table.png);
345
background-image: url(images/interface/magnifier.png);
349
background-image: url(images/interface/help.png);
353
background-image: url(images/interface/world.png);
356
/* Actions relating the context can be floated at the right. */
366
margin-bottom: 0.3em;
369
/* For project view (late_submission entries in the submission list), must
370
* apply to the td (not the tr) and be !important to override the pretty_table
371
* styling of the td text colour. */
372
.project.closed, .late_submission, tr.late_submission td {
373
color: darkred !important;
380
.horizontalactions * {
385
text-decoration: line-through;