source: trunk/src/web-app/css/public.css @ 36

Last change on this file since 36 was 36, checked in by tuxta, 15 years ago

1st update to the style, added wrapper and content to public.css and pointed main.gsp to it. Still have issues with inner content being to wide, work on that next

File size: 5.3 KB
Line 
1html * {
2    margin: 0;
3    /*padding: 0; SELECT NOT DISPLAYED CORRECTLY IN FIREFOX */
4
5}
6
7/* GENERAL */
8
9.spinner {
10    padding: 5px;
11    position: absolute;
12    right: 0;
13}
14
15body {
16    background: #fff;
17    color: #333;
18    font: 11px verdana, arial, helvetica, sans-serif;
19    background: transparent url("../images/brushed_metal.png") repeat fixed center;
20}
21
22#wrapper {
23  margin: 0 auto;
24  padding: 0;
25  width: 1024px;
26  text-align: left;
27}
28
29#content {
30  padding: 0px 20px 20px;
31  background: url("../images/Contentbg.png") repeat-y scroll center;
32  width: 980px;
33  height: 100%;
34}
35
36#Header {
37  background: transparent url("../images/logo.png") no-repeat scroll center;
38  width: 980px;
39  height: 220px;
40}
41
42a:link, a:visited, a:hover {
43    color: #666;
44    font-weight: bold;
45    text-decoration: none;
46}
47
48h1 {
49    color: #006dba;
50    font-weight: normal;
51    font-size: 16px;
52    margin: .8em 0 .3em 0;
53}
54
55ul {
56    padding-left: 15px;
57}
58
59input, select, textarea {
60    background-color: #fcfcfc;
61    border: 1px solid #ccc;
62    font: 11px verdana, arial, helvetica, sans-serif;
63    margin: 2px 0;
64    padding: 2px 4px;
65}
66select {
67   padding: 2px 2px 2px 0;
68}
69textarea {
70        width: 250px;
71        height: 150px;
72        vertical-align: top;
73}
74
75input:focus, select:focus, textarea:focus {
76    border: 1px solid #b2d1ff;
77}
78
79.body {
80    padding: 0px 20px 20px;
81    background: transparent url("images/Contentbg.png") repeat-y scroll center;
82    width: 980px;
83    height: 100%;
84}
85
86/* NAVIGATION MENU */
87
88.nav {
89    background: #fff url(../images/skin/shadow.jpg) bottom repeat-x;
90    border: 1px solid #ccc;
91    border-style: solid none solid none;
92    margin-top: 5px;
93    padding: 7px 12px;
94}
95
96.menuButton {
97    font-size: 10px;
98    padding: 0 5px;
99}
100.menuButton a {
101    color: #333;
102    padding: 4px 6px;
103}
104.menuButton a.home {
105    background: url(../images/skin/house.png) center left no-repeat;
106    color: #333;
107    padding-left: 25px;
108}
109.menuButton a.list {
110    background: url(../images/skin/database_table.png) center left no-repeat;
111    color: #333;
112    padding-left: 25px;
113}
114.menuButton a.create {
115    background: url(../images/skin/database_add.png) center left no-repeat;
116    color: #333;
117    padding-left: 25px;
118}
119
120/* MESSAGES AND ERRORS */
121
122.message {
123    background: #f3f8fc url(../images/skin/information.png) 8px 50% no-repeat;
124    border: 1px solid #b2d1ff;
125    color: #006dba;
126    margin: 10px 0 5px 0;
127    padding: 5px 5px 5px 30px
128}
129
130div.errors {
131    background: #fff3f3;
132    border: 1px solid red;
133    color: #cc0000;
134    margin: 10px 0 5px 0;
135    padding: 5px 0 5px 0;
136}
137div.errors ul {
138    list-style: none;
139    padding: 0;
140}
141div.errors li {
142        background: url(../images/skin/exclamation.png) 8px 0% no-repeat;
143    line-height: 16px;
144    padding-left: 30px;
145}
146
147td.errors select {
148    border: 1px solid red;
149}
150td.errors input {
151    border: 1px solid red;
152}
153
154/* TABLES */
155
156table {
157    border: 1px solid #ccc;
158    width: 100%
159}
160tr {
161    border: 0;
162}
163td, th {
164    font: 11px verdana, arial, helvetica, sans-serif;
165    line-height: 12px;
166    padding: 5px 6px;
167    text-align: left;
168    vertical-align: top;
169}
170th {
171    background: #fff url(../images/skin/shadow.jpg);
172    color: #666;
173    font-size: 11px;
174    font-weight: bold;
175    line-height: 17px;
176    padding: 2px 6px;
177}
178th a:link, th a:visited, th a:hover {
179    color: #333;
180    display: block;
181    font-size: 10px;
182    text-decoration: none;
183    width: 100%;
184}
185th.asc a, th.desc a {
186    background-position: right;
187    background-repeat: no-repeat;
188}
189th.asc a {
190    background-image: url(../images/skin/sorted_asc.gif);
191}
192th.desc a {
193    background-image: url(../images/skin/sorted_desc.gif);
194}
195
196.odd {
197    background: #f7f7f7;
198}
199.even {
200    background: #fff;
201}
202
203/* LIST */
204
205.list table {
206    border-collapse: collapse;
207}
208.list th, .list td {
209    border-left: 1px solid #ddd;
210}
211.list th:hover, .list tr:hover {
212    background: #b2d1ff;
213}
214
215/* PAGINATION */
216
217.paginateButtons {
218    background: #fff url(../images/skin/shadow.jpg) bottom repeat-x;
219    border: 1px solid #ccc;
220    border-top: 0;
221    color: #666;
222    font-size: 10px;
223    overflow: hidden;
224    padding: 10px 3px;
225}
226.paginateButtons a {
227    background: #fff;
228    border: 1px solid #ccc;
229    border-color: #ccc #aaa #aaa #ccc;
230    color: #666;
231    margin: 0 3px;
232    padding: 2px 6px;
233}
234.paginateButtons span {
235    padding: 2px 3px;
236}
237
238/* DIALOG */
239
240.dialog table {
241    padding: 5px 0;
242}
243
244.prop {
245    padding: 5px;
246}
247.prop .name {
248    text-align: left;
249    width: 15%;
250    white-space: nowrap;
251}
252.prop .value {
253    text-align: left;
254    width: 85%;
255}
256
257/* ACTION BUTTONS */
258
259.buttons {
260    background: #fff url(../images/skin/shadow.jpg) bottom repeat-x;
261    border: 1px solid #ccc;
262    color: #666;
263    font-size: 10px;
264    margin-top: 5px;
265    overflow: hidden;
266    padding: 0;
267}
268
269.buttons input {
270    background: #fff;
271    border: 0;
272    color: #333;
273    cursor: pointer;
274    font-size: 10px;
275    font-weight: bold;
276    margin-left: 3px;
277    overflow: visible;
278    padding: 2px 6px;
279}
280.buttons input.delete {
281    background: transparent url(../images/skin/database_delete.png) 5px 50% no-repeat;
282    padding-left: 28px;
283}
284.buttons input.edit {
285    background: transparent url(../images/skin/database_edit.png) 5px 50% no-repeat;
286    padding-left: 28px;
287}
288.buttons input.save {
289    background: transparent url(../images/skin/database_save.png) 5px 50% no-repeat;
290    padding-left: 28px;
291}
Note: See TracBrowser for help on using the repository browser.