Add an improved style sheet (from the ikiwiki site)
[openafs-wiki.git] / local.css
1 /*********************************
2  * theme for ikiwiki
3  *
4  * by Danny Castonguay
5  *********************************/
6 /* # HSLA(hue, saturation, lightness,alpha)
7  * ## hue
8  * R:0, O:30, Y:60, G:115, cyan:180, B:220, I:260, V:280, pink:300
9  * ## saturation
10  * 0% is gray, 100% is pure color
11  * ## lightness
12  * 0% is black, 100% is white
13  * ## alpha
14  * 0% is opaque, 100% is transparent
15  *  */
16 .pageheader {
17   padding: 2em 2em 3em 2em;
18   position: relative;
19   overflow: hidden;
20   background: #f2f7ed;
21   border-color: #cccccc;
22   border-style: none none solid none;
23   border-width: 1px; }
24
25 .pageheader .header {
26   float: left; }
27
28 .title {
29   color: #1a260d; }
30
31 .title, h1, h2, h3, h4, h5, h6 {
32   font-weight: bold; }
33
34 .header {
35   font-size: 150%; }
36
37 h1 {
38   font-size: 160%;
39   border-top: 5px solid #cccccc; }
40
41 h2 {
42   font-size: 130%;
43   border-top: 2px solid #cccccc; }
44
45 h3, h4, h5, h6 {
46   font-size: 110%; }
47
48 #searchform {
49   position: absolute;
50   top: 0.5em;
51   right: 2em; }
52
53 input#searchbox {
54   border: none;
55   padding: .5em;
56   border-style: solid;
57   border-width: 1px;
58   border-color: #cccccc;
59   -moz-border-radius: 4px;
60   -webkit-border-radius: 4px;
61   border-radius: 4px;
62   -moz-box-shadow: inset 2px 2px 2px #1a1a1a;
63   -webkit-box-shadow: inset 2px 2px 2px #1a1a1a;
64   box-shadow: inset 2px 2px 2px #1a1a1a; }
65
66 .pageheader .actions {
67   position: absolute;
68   bottom: 0;
69   right: 2em;
70   width: 100%;
71   text-align: right; }
72
73 .pageheader .actions ul {
74   border-style: none; }
75
76 .actions ul {
77   padding: 1em;
78   border-style: none; }
79
80 .pageheader .actions ul li {
81   padding: 0; }
82
83 .pageheader .actions ul li a, input[type="submit"] {
84   margin: 0.2em;
85   padding: 0.2em;
86   font-size: 1.01em;
87   background: #e6e6e6;
88   color: #136c13;
89   border-style: solid;
90   border-width: 1px;
91   border-color: #cccccc;
92   -moz-border-radius: 4px;
93   -webkit-border-radius: 4px;
94   border-radius: 4px; }
95   .pageheader .actions ul li a:hover, input[type="submit"]:hover {
96     background: #1fad1f;
97     color: white; }
98
99 div.toggleable#attachments {
100   margin: 1em; }
101
102 body {
103   margin: 0;
104   padding: 0;
105   font-family: helvetica,arial,freesans,clean,sans-serif;
106   *font-size: small;
107   color: black;
108   background: white;
109   font-size: 1.01em; }
110
111 a {
112   text-decoration: none;
113   color: #136c13; }
114
115 a:hover {
116   color: #1fad1f; }
117
118 hr {
119   border-style: none;
120   background-color: #cccccc;
121   height: 1px; }
122
123 code, pre {
124   background-color: #f2f2f2;
125   color: #1a2e05; }
126
127 pre {
128   padding: .5em;
129   margin: 1em;
130   border-style: solid;
131   border-width: 1px;
132   border-color: #cccccc;
133   -moz-border-radius: 4px;
134   -webkit-border-radius: 4px;
135   border-radius: 4px;
136   -moz-box-shadow: 0px 0px 2px #1a1a1a;
137   -webkit-box-shadow: 0px 0px 2px #1a1a1a;
138   box-shadow: 0px 0px 2px #1a1a1a; }
139
140 #content, #comments, #footer {
141   margin: 1em 2em; }
142
143 #pageinfo {
144   border-color: #cccccc; }
145
146 #editcontent, #editmessage {
147   width: 90%;
148   background: #f2f2f2;
149   font-size: 1.01em;
150   font-family: Consolas, Monaco, "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Courier New", monospace;
151   line-height: 1.4em;
152   padding: .5em;
153   border-style: solid;
154   border-width: 1px;
155   border-color: #cccccc;
156   -moz-border-radius: 4px;
157   -webkit-border-radius: 4px;
158   border-radius: 4px; }
159   #editcontent:hover, #editmessage:hover {
160     background: white; }
161
162 #editcontent {
163   height: 25em; }
164
165 label[for="editmessage"] {
166   margin-top: 1em; }
167
168 #editmessage {
169   margin-bottom: 1em; }
170
171 .inlinepage {
172   margin: .4em 0;
173   padding: .4em 0;
174   border-style: none;
175   border-top: 1px solid #cccccc; }
176
177 .inlineheader {
178   font-size: 1.1em;
179   border-top: 2px solid #cccccc; }
180
181 /* Smaller headings for inline pages */
182 .inlinepage h1 {
183   font-size: 1.1em; }
184
185 .inlinepage h2 {
186   font-size: 1.01em; }
187
188 .inlinepage h3 {
189   font-size: 1.01em; }
190
191 div.recentchanges {
192   border-style: none; }
193
194 /* recent change page */
195 div.recentchanges {
196   background-color: white; }
197
198 div.metadata {
199   margin-top: 1.5em;
200   border-style: solid;
201   border-width: 1px;
202   border-color: #cccccc;
203   -webkit-border-top-left-radius: 4px;
204   -webkit-border-top-right-radius: 4px;
205   -moz-border-radius-topleft: 4px;
206   -moz-border-radius-topright: 4px;
207   border-top-left-radius: 4px;
208   border-top-right-radius: 4px;
209   border-style: solid solid none solid;
210   background-color: #f2f2f2; }
211
212 div.recentchanges div.metadata *, span.pagelinks a {
213   float: none;
214   display: block; }
215
216 span.pagelinks {
217   width: inherit !important; }
218
219 span.pagelinks a, span.tags a {
220   margin: 0.2em;
221   padding: 0.2em;
222   font-size: 1.01em;
223   background: #e6e6e6;
224   color: black;
225   border-style: solid;
226   border-width: 1px;
227   border-color: #cccccc;
228   -moz-border-radius: 4px;
229   -webkit-border-radius: 4px;
230   border-radius: 4px; }
231   span.pagelinks a:hover, span.tags a:hover {
232     background: #cccccc;
233     color: #1a260d; }
234
235 div.recentchanges div.changelog {
236   border-style: solid;
237   border-width: 1px;
238   border-color: #cccccc;
239   -webkit-border-bottom-left-radius: 4px;
240   -webkit-border-bottom-right-radius: 4px;
241   -moz-border-radius-bottomleft: 4px;
242   -moz-border-radius-bottomright: 4px;
243   border-bottom-left-radius: 4px;
244   border-bottom-right-radius: 4px;
245   border-style: none solid solid solid;
246   background-color: #f2f2f2 !important; }
247
248 span.desc br {
249   display: none !important; }
250
251 div.titleandtags {
252   border-style: solid;
253   border-width: 1px;
254   border-color: #cccccc;
255   -moz-border-radius: 4px;
256   -webkit-border-radius: 4px;
257   border-radius: 4px;
258   background-color: #f2f2f2;
259   margin-top: .5em;
260   padding: .4em; }
261   div.titleandtags h3, div.titleandtags span.tags {
262     padding: 0; }
263   div.titleandtags h3 {
264     margin: 0 0 .2em 0; }
265   div.titleandtags span.tags {
266     line-height: 2em; }
267   div.titleandtags div.lastmodified {
268     float: right; }
269
270 thead th {
271   color: white;
272   background-color: gray;
273   padding: .5em; }
274
275 td {
276   padding: .2em .4em; }
277
278 tr:nth-child(odd) {
279   background-color: #f2f2f2; }
280
281 tr:nth-child(even) {
282   background-color: #d9d9d9; }
283
284 /* Don't know what these last two do but leaving those there just in case*/
285 .pagecloud {
286   width: auto;
287   border-color: red; }
288
289 .sidebar {
290   width: 28ex;
291   border-bottom: 0;
292   border-right: 0;
293   border-top: 0;
294   margin-top: 0.5em;
295   padding: 0 0 0 2ex;
296   border-color: red; }