chiark / gitweb /
Add New back to web interface (oops)
[disorder] / templates / disorder.css
... / ...
CommitLineData
1/* default font and colors */
2body {
3 color: black;
4 background-color: white;
5 font-family: times,serif;
6 font-weight: normal;
7 font-size: 12pt;
8 font-variant: normal
9}
10
11input {
12 font-family: helvetica,sans-serif;
13 font-weight: normal;
14 font-size: 12pt;
15 font-variant: normal
16}
17
18/* general link colors */
19a {
20 color: blue
21}
22
23a:active {
24 color: red
25}
26
27/* title bars */
28h1 {
29 font-family: helvetica,sans-serif;
30 font-weight: bold;
31 font-size: 18pt;
32 font-variant: normal;
33 text-align: center;
34 border: 1px solid black;
35 padding: 0.2em;
36 background-color: #e0e0e0;
37 display: block
38}
39
40/* secondary titles */
41h2 {
42 font-family: helvetica,sans-serif;
43 font-weight: bold;
44 font-size: 16pt;
45 font-variant: normal;
46 display: block
47}
48
49/* Some titles are links too, but we don't want them to go blue */
50h2 a {
51 color: black
52}
53
54/* Use the same table model everywhere */
55table {
56 border-collapse: collapse
57}
58
59/* tabular data **************************************************************/
60
61/* playing, recent and new classes correspond to the tables in playing.html,
62 * recent.html and new.html */
63table.playing, table.recent, table.new, table.search {
64 width: 100% /* use full screen width */
65}
66
67table.playing th, table.recent th, table.new th, table.search th {
68 text-align: left /* titles should be left-aligned */
69}
70
71table.playing td, table.recent td, table.new td, table.search td {
72 vertical-align: middle /* centre cell contents vertically */
73}
74
75table.playing a, table.recent a, table.new a, table.search a {
76 color: black
77}
78
79/* tr.headings is the row containing column headings */
80tr.headings {
81 background-color: black; /* heading rows are white on black */
82 color: white
83}
84
85/* tr.nowplaying and tr.next are the section heading rows */
86tr.nowplaying td, tr.next td {
87 background-color: #d0d0d0; /* table section headings are black on grey */
88 color: black;
89 font-weight: bold; /* table section headings are bold */
90 text-align: center
91}
92
93/* tr.playing is the row for the currently playing track */
94tr.playing {
95 background-color: #e0ffe0; /* playing track is black on pastel green */
96 color: back
97}
98
99/* tr.even and tr.odd are odd and even rows of the main body of the table */
100tr.even {
101 background-color: #ffecec; /* even rows are black on red */
102 color: black
103}
104
105tr.odd {
106 background-color: #ffffff; /* odd rows are black on white */
107 color: black
108}
109
110/* th/td.length are the length column */
111table th.length {
112 text-align: right /* track length column is right-aligned */
113}
114
115td.length {
116 text-align: right; /* track length column is right-aligned */
117 font-size: 10pt /* track length is slightly smaller */
118}
119
120/* p.mgmt is the bar of management buttons */
121/* form.volume is the form for setting the volume */
122/* This is needed to stop FF breaking the management button line in two */
123p.mgmt, form.volume {
124 display: inline
125}
126
127/* choose ********************************************************************/
128
129/* p.choosealpha is the bar of first-letter links */
130p.choosealpha {
131 text-align: center;
132 font-size: 17pt; /* links are one letter so make them big... */
133 font-weight: bold; /* ...and bold */
134 border: 1px solid black; /* border the link list */
135 padding: 0.2em
136}
137
138/* p.directoryname contains the current directory when navigating */
139p.directoryname {
140 font-weight: bold;
141 background-color: #ffffe0; /* pastel yellow */
142 color: black;
143 padding: 0.2em
144}
145
146p.directoryname a {
147 color: black
148}
149
150/* section headings */
151div.filesdirectories p.heading {
152 display: block;
153 background-color: #e0ffe0; /* heading are black on pastel green */
154 color: black;
155 font-weight: bold; /* ...and bold */
156 padding: 0.2em;
157 padding-left: 1.2em
158}
159
160/* one file or directory */
161div.filesdirectories p.entry {
162 margin-left: 2em /* indent files & directories two steps */
163}
164
165div.filesdirectories a {
166 text-decoration: none /* don't underline file/directory names */
167}
168
169div.filesdirectories a {
170 color: black
171}
172
173div.filesdirectories a:active {
174 color: red
175}
176
177/* all files */
178div.filesdirectories p.all {
179 margin-left: 1em /* indent play all button only one step */
180}
181
182/* buttons *******************************************************************/
183
184/* Buttons and links that look like buttons share the same formatting */
185button,a.button {
186 padding: 1px;
187 border-width: 3px;
188 border-color: #fefefe; /* Off-white */
189 border-style: inset;
190 background-color: #c0c0c0; /* Black on light grey */
191 color: #000000;
192 text-decoration: none; /* Don't underline links */
193 font-family: helvetica,sans-serif;
194 font-weight: normal;
195 font-variant: normal;
196 font-size: 12pt
197}
198
199a.button:active,button:active {
200 background-color: #c0c0c0;
201 color: #ffffff
202}
203
204/* Images that act like buttons aren't styled in the same way, but do want
205 * to lose their border */
206img.button {
207 border-width: 0
208}
209
210/* searching *****************************************************************/
211
212span.search_artist {
213 font-weight: bold /* Artist in bold */
214}
215
216div.search_album {
217 margin-left: 1em /* Indent album one step */
218}
219
220div.search_title {
221 margin-left: 1em /* Indent title two steps */
222}
223
224div.search_title p {
225 margin-top: 0; /* Titles are compressed relative to ... */
226 margin-bottom: 0 /* ...artists and albums */
227}
228
229div.search_title a {
230 color: black
231}
232
233div.search_title a:active {
234 color: red
235}
236
237form.search {
238 border: 1px solid black; /* Give the search box a border */
239 padding: 0.2em
240}
241
242/* menu bar *******************************************************************/
243
244/* p.menubar is the menu bar at the top */
245p.menubar {
246 word-spacing: 1em /* Space out menu items */
247}
248
249/* Subelements are A for usable menus or SPAN for unusable ones */
250p.menubar a, p.menubar span {
251 font-family: helvetica,sans-serif;
252 font-weight: bold;
253 font-size: 14pt;
254 text-decoration: none
255}
256
257/* a.activemenu is the current menu item */
258a.activemenu {
259 color: red;
260}
261
262/* a.inactivemenu is a non-current but choosable menu item */
263a.inactivemenu {
264 color: black
265}
266
267/* span.invaliemenu is a non-choosable menu item */
268span.invalidmenu {
269 color: #808080
270}
271
272/* track preferences *********************************************************/
273
274/* p.prefs_head is the per-track heading */
275p.prefs_head {
276 background-color: #ffffe0; /* Pastel yellow on black */
277 color: black;
278 font-weight: bold;
279 padding: 0.2em
280}
281
282/* table.prefs contains the prefs for one track */
283table.prefs {
284 border-spacing: 0;
285 margin-left: 1em /* Indent each track's details */
286}
287
288table.prefs th {
289 text-align: left /* Titles should be left-aligned */
290}
291
292table.prefs td {
293 vertical-align: top
294}
295
296table.prefs input {
297 font-family: monospace
298}
299
300/* help **********************************************************************/
301
302/* table.helpbuttons is used for various tables of buttons */
303table.helpbuttons td {
304 vertical-align: top
305}
306
307table.helpbuttons {
308 margin-left: 2em;
309 margin-right: 2em
310}
311
312/* h2.helptitle is used for help subsection headings */
313h2.helptitle {
314 background-color: #e0ffe0; /* Black on pastel green */
315 color: black;
316 padding: 0.2em
317}
318
319/* There is a div.helpsection for each subsection */
320div.helpsection {
321 margin-left: 1em
322}
323
324/* span.configuration marks configuration directives */
325span.configuration {
326 font-family: monospace
327}
328
329/* volume ********************************************************************/
330
331p.volume {
332 text-align: center
333}
334
335/* login page ****************************************************************/
336
337form.login {
338 border: 1px solid black;
339 background-color: #e0ffe0 /* pastel green */
340}
341
342form.reminder {
343 border: 1px solid black;
344 background-color: #e0e0ff /* pastel blue */
345}
346
347form.register {
348 border: 1px solid black;
349 background-color: #e0e0ff /* pastel blue */
350}
351
352form.edituser {
353 border: 1px solid black;
354 background-color: #ffffe0 /* pastel yellow */
355}
356
357form.login table, form.reminder table, form.register table, form.edituser table {
358 margin: 0.2em /* Space login boxes nicely */
359}
360
361form.logout {
362 border-style: none;
363}
364
365div.loginstatus {
366 border: 1px solid black;
367 background-color: #ffff00 /* solid yellow */
368}
369
370div.loginstatus p {
371 color: #0000ff; /* solid blue */
372 font-size: 18pt;
373 font-weight: bold;
374 margin: 0.2em
375}
376
377/* errors ********************************************************************/
378
379div.error {
380 border: 1px solid black;
381 background-color: #ff0000; /* White on solid red */
382 color: white;
383 font-size: 18pt;
384 font-weight: bold
385}
386
387div.error p {
388 margin: 0.2em
389}
390
391/* miscelleanous *************************************************************/
392
393/* credits */
394p.credits {
395 font-size: 10pt; /* because visually intrusive */
396 text-align: right;
397 background-color: #e0e0e0;
398 color: black;
399 padding: 0.2em
400}
401/*
402This file is part of DisOrder.
403Copyright (C) 2003-2008 Richard Kettlewell
404
405This program is free software; you can redistribute it and/or modify
406it under the terms of the GNU General Public License as published by
407the Free Software Foundation; either version 2 of the License, or
408(at your option) any later version.
409
410This program is distributed in the hope that it will be useful, but
411WITHOUT ANY WARRANTY; without even the implied warranty of
412MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
413General Public License for more details.
414
415You should have received a copy of the GNU General Public License
416along with this program; if not, write to the Free Software
417Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307
418USA
419*/