paul@0 | 1 | /* common.css - MoinMoin Default Styles |
paul@0 | 2 | |
paul@0 | 3 | Copyright (c) 2001, 2002, 2003 by Juergen Hermann |
paul@0 | 4 | Copyright (c) 2007 by Paul Boddie (minor adjustments) |
paul@0 | 5 | */ |
paul@0 | 6 | |
paul@0 | 7 | /* content styles */ |
paul@0 | 8 | |
paul@0 | 9 | html { |
paul@0 | 10 | background-color: #ccc9e2; |
paul@0 | 11 | color: black; |
paul@0 | 12 | font-family: Arial, Helvetica, sans-serif; |
paul@0 | 13 | font-size: 1em; |
paul@0 | 14 | } |
paul@0 | 15 | |
paul@0 | 16 | body { |
paul@0 | 17 | margin: 0; |
paul@0 | 18 | } |
paul@0 | 19 | |
paul@0 | 20 | /* Links */ |
paul@0 | 21 | |
paul@0 | 22 | a {color: #0044B3;} |
paul@0 | 23 | a:visited {color: #597BB3;} |
paul@0 | 24 | a.nonexistent, a.badinterwiki {color: gray;} |
paul@0 | 25 | |
paul@0 | 26 | a.www:before {content: url(../img/moin-www.png); margin: 0 0.2em;} |
paul@0 | 27 | a.http:before {content: url(../img/moin-www.png); margin: 0 0.2em;} |
paul@0 | 28 | a.https:before {content: url(../img/moin-www.png); margin: 0 0.2em;} |
paul@0 | 29 | a.file:before {content: url(../img/moin-ftp.png); margin: 0 0.2em;} |
paul@0 | 30 | a.ftp:before {content: url(../img/moin-ftp.png); margin: 0 0.2em;} |
paul@0 | 31 | a.nntp:before {content: url(../img/moin-news.png); margin: 0 0.2em;} |
paul@0 | 32 | a.news:before {content: url(../img/moin-news.png); margin: 0 0.2em;} |
paul@0 | 33 | a.telnet:before {content: url(../img/moin-telnet.png); margin: 0 0.2em;} |
paul@0 | 34 | a.irc:before {content: url(../img/moin-telnet.png); margin: 0 0.2em;} |
paul@0 | 35 | a.mailto:before {content: url(../img/moin-email.png); margin: 0 0.2em;} |
paul@0 | 36 | a.attachment:before {content: url(../img/moin-attach.png); margin: 0 0.2em;} |
paul@0 | 37 | a.badinterwiki:before {content: url(../img/moin-inter.png); margin: 0 0.2em;} |
paul@0 | 38 | a.interwiki:before {content: url(../img/moin-inter.png); margin: 0 0.2em;} |
paul@0 | 39 | |
paul@0 | 40 | /* IE sucks */ |
paul@0 | 41 | * html a.www { padding-left: 14px; background: url(../img/moin-www.png) left center no-repeat; } |
paul@0 | 42 | * html a.http { padding-left: 14px; background: url(../img/moin-www.png) left center no-repeat; } |
paul@0 | 43 | * html a.https { padding-left: 14px; background: url(../img/moin-www.png) left center no-repeat; } |
paul@0 | 44 | * html a.file { padding-left: 14px; background: url(../img/moin-ftp.png) left center no-repeat; } |
paul@0 | 45 | * html a.ftp { padding-left: 14px; background: url(../img/moin-ftp.png) left center no-repeat; } |
paul@0 | 46 | * html a.nntp { padding-left: 14px; background: url(../img/moin-news.png) left center no-repeat; } |
paul@0 | 47 | * html a.news { padding-left: 14px; background: url(../img/moin-news.png) left center no-repeat; } |
paul@0 | 48 | * html a.telnet { padding-left: 14px; background: url(../img/moin-telnet.png) left center no-repeat; } |
paul@0 | 49 | * html a.irc { padding-left: 14px; background: url(../img/moin-telnet.png) left center no-repeat; } |
paul@0 | 50 | * html a.mailto { padding-left: 14px; background: url(../img/moin-email.png) left center no-repeat; } |
paul@0 | 51 | * html a.attachment { padding-left: 14px; background: url(../img/moin-attach.png) left center no-repeat; } |
paul@0 | 52 | * html a.badinterwiki { padding-left: 14px; background: url(../img/moin-inter.png) left center no-repeat; } |
paul@0 | 53 | * html a.interwiki { padding-left: 14px; background: url(../img/moin-inter.png) left center no-repeat; } |
paul@0 | 54 | |
paul@0 | 55 | /* |
paul@0 | 56 | This could maybe avoid screen jumping in IE with IE7 hack. |
paul@0 | 57 | |
paul@0 | 58 | It works (or rather: should work) like this: |
paul@0 | 59 | First, IE sees the a.interwiki definition only as it doesn't understand neither |
paul@0 | 60 | * > a.interwiki, nor a.interwiki:before. We use a.interwiki to reserve some |
paul@0 | 61 | space for the icon inserted later. |
paul@0 | 62 | Later, the IE7 hack kicks in and then IE also understands those 2 other css lines. |
paul@0 | 63 | The * > a.interwiki line now removes the space we previously reserved and the |
paul@0 | 64 | :before inserts the icon. |
paul@0 | 65 | |
paul@0 | 66 | a.interwiki {margin-left: 25px; padding-top: 25px; padding-bottom: 25px;} |
paul@0 | 67 | * > a.interwiki {margin-left: 0px; padding-top: 25px; padding-bottom: 25px;} |
paul@0 | 68 | a.interwiki:before {content: url(../img/moin-inter.png);} |
paul@0 | 69 | |
paul@0 | 70 | Problem: |
paul@0 | 71 | While margin-left seems to work, margin-/padding-top/bottom doesnt. |
paul@0 | 72 | After getting it to work, this has to be fine-tuned to avoid screen jumping. |
paul@0 | 73 | */ |
paul@0 | 74 | |
paul@0 | 75 | li p { |
paul@0 | 76 | margin: .25em 0; |
paul@0 | 77 | } |
paul@0 | 78 | |
paul@0 | 79 | li.gap { |
paul@0 | 80 | margin-top: 0.5em; |
paul@0 | 81 | } |
paul@0 | 82 | |
paul@0 | 83 | dt { |
paul@0 | 84 | margin-top: 0.5em; |
paul@0 | 85 | font-weight: bold; |
paul@0 | 86 | } |
paul@0 | 87 | |
paul@0 | 88 | dd { |
paul@0 | 89 | margin-top: 0; |
paul@0 | 90 | margin-bottom: 0; |
paul@0 | 91 | } |
paul@0 | 92 | |
paul@0 | 93 | dd p { |
paul@0 | 94 | margin: 0.25em 0; |
paul@0 | 95 | } |
paul@0 | 96 | |
paul@0 | 97 | a, img, img.drawing { |
paul@0 | 98 | border: 0; |
paul@0 | 99 | } |
paul@0 | 100 | |
paul@0 | 101 | pre { |
paul@0 | 102 | border: 1pt solid #AEBDCC; |
paul@0 | 103 | background-color: #F3F5F7; |
paul@0 | 104 | padding: 5pt; |
paul@0 | 105 | font-family: courier, monospace; |
paul@0 | 106 | white-space: pre; |
paul@0 | 107 | /* begin css 3 or browser specific rules - do not remove! |
paul@0 | 108 | see: http://forums.techguy.org/archive/index.php/t-249849.html */ |
paul@0 | 109 | white-space: pre-wrap; |
paul@0 | 110 | word-wrap: break-word; |
paul@0 | 111 | white-space: -moz-pre-wrap; |
paul@0 | 112 | white-space: -pre-wrap; |
paul@0 | 113 | white-space: -o-pre-wrap; |
paul@0 | 114 | /* end css 3 or browser specific rules */ |
paul@0 | 115 | } |
paul@0 | 116 | |
paul@0 | 117 | pre.comment { |
paul@0 | 118 | background-color: #CCCCCC; |
paul@0 | 119 | color: red; |
paul@0 | 120 | padding: 0; |
paul@0 | 121 | margin: 0; |
paul@0 | 122 | border: 0; |
paul@0 | 123 | } |
paul@0 | 124 | |
paul@0 | 125 | pre.comment:before { |
paul@0 | 126 | content: url(../img/attention.png); |
paul@0 | 127 | } |
paul@0 | 128 | |
paul@0 | 129 | |
paul@0 | 130 | table |
paul@0 | 131 | { |
paul@0 | 132 | margin: 0.5em 0 0 0.5em; |
paul@0 | 133 | border-collapse: collapse; |
paul@0 | 134 | } |
paul@0 | 135 | |
paul@0 | 136 | td |
paul@0 | 137 | { |
paul@0 | 138 | padding: 0.25em 0.5em 0.25em 0.5em; |
paul@0 | 139 | border: 1pt solid #ADB9CC; |
paul@0 | 140 | } |
paul@0 | 141 | |
paul@0 | 142 | td p { |
paul@0 | 143 | margin: 0; |
paul@0 | 144 | padding: 0; |
paul@0 | 145 | } |
paul@0 | 146 | |
paul@0 | 147 | /* TableOfContents macro */ |
paul@0 | 148 | .table-of-contents { border: 1px solid #bbbbbb; |
paul@0 | 149 | color: black; background-color: #eeeeee; |
paul@0 | 150 | font-size: small; |
paul@0 | 151 | text-align:left; |
paul@0 | 152 | margin: 0.5em; padding-left: 2em; |
paul@0 | 153 | width:50%; } |
paul@0 | 154 | .table-of-contents ol { margin:0; margin-left:1em; |
paul@0 | 155 | list-style-type:decimal; } |
paul@0 | 156 | .table-of-contents ul { margin:0; |
paul@0 | 157 | list-style-type:none; } |
paul@0 | 158 | .table-of-contents-heading { font-weight:bold; padding:0; margin:0; } |
paul@0 | 159 | |
paul@0 | 160 | |
paul@0 | 161 | .footnotes div { |
paul@0 | 162 | width: 5em; |
paul@0 | 163 | border-top: 1pt solid gray; |
paul@0 | 164 | } |
paul@0 | 165 | |
paul@0 | 166 | .footnotes ul { |
paul@0 | 167 | padding: 0 2em; |
paul@0 | 168 | margin: 0 0 1em; |
paul@0 | 169 | list-style: none; |
paul@0 | 170 | } |
paul@0 | 171 | |
paul@0 | 172 | .footnotes li { |
paul@0 | 173 | } |
paul@0 | 174 | |
paul@0 | 175 | .info { |
paul@0 | 176 | float: right; |
paul@0 | 177 | font-size: 0.7em; |
paul@0 | 178 | color: gray; |
paul@0 | 179 | } |
paul@0 | 180 | |
paul@0 | 181 | #pageinfo { |
paul@0 | 182 | margin-top: 2em; |
paul@0 | 183 | } |
paul@0 | 184 | |
paul@0 | 185 | .seperator { |
paul@0 | 186 | color: gray; |
paul@0 | 187 | } |
paul@0 | 188 | |
paul@0 | 189 | #pagebottom {clear: both;} |
paul@0 | 190 | |
paul@0 | 191 | /* standard rule ---- */ |
paul@0 | 192 | hr { |
paul@0 | 193 | height: 1pt; |
paul@0 | 194 | background-color: #9C9C9C; |
paul@0 | 195 | border: 0; |
paul@0 | 196 | } |
paul@0 | 197 | |
paul@0 | 198 | /* custom rules ----- to ---------- */ |
paul@0 | 199 | .hr1 {height: 2pt;} |
paul@0 | 200 | .hr2 {height: 3pt;} |
paul@0 | 201 | .hr3 {height: 4pt;} |
paul@0 | 202 | .hr4 {height: 5pt;} |
paul@0 | 203 | .hr5 {height: 6pt;} |
paul@0 | 204 | .hr6 {height: 7pt;} |
paul@0 | 205 | |
paul@0 | 206 | /* Replacement for deprecated html 3 <u> element and html 4 <strike> */ |
paul@0 | 207 | .u {text-decoration: underline;} |
paul@0 | 208 | .strike {text-decoration: line-through;} |
paul@0 | 209 | |
paul@0 | 210 | /* eye catchers */ |
paul@0 | 211 | .warning |
paul@0 | 212 | { |
paul@0 | 213 | color: red; |
paul@0 | 214 | } |
paul@0 | 215 | |
paul@0 | 216 | .error |
paul@0 | 217 | { |
paul@0 | 218 | color: red; |
paul@0 | 219 | } |
paul@0 | 220 | |
paul@0 | 221 | strong.highlight |
paul@0 | 222 | { |
paul@0 | 223 | background-color: #CCE0FF; |
paul@0 | 224 | padding: 1pt; |
paul@0 | 225 | } |
paul@0 | 226 | |
paul@0 | 227 | |
paul@0 | 228 | /* Recent changes */ |
paul@0 | 229 | |
paul@0 | 230 | .rcrss { |
paul@0 | 231 | float: right; |
paul@0 | 232 | margin: 0; |
paul@0 | 233 | } |
paul@0 | 234 | |
paul@0 | 235 | .recentchanges[dir="rtl"] .rcrss { |
paul@0 | 236 | float: left; |
paul@0 | 237 | } |
paul@0 | 238 | |
paul@0 | 239 | .recentchanges table { |
paul@0 | 240 | clear: both; |
paul@0 | 241 | } |
paul@0 | 242 | |
paul@0 | 243 | .recentchanges td { |
paul@0 | 244 | vertical-align: top; |
paul@0 | 245 | border: none; |
paul@0 | 246 | border-bottom: 1pt solid #E6EAF0; |
paul@0 | 247 | background: #F2F4F7; |
paul@0 | 248 | } |
paul@0 | 249 | |
paul@0 | 250 | .rcdaybreak td { |
paul@0 | 251 | background: #B8C5D9; |
paul@0 | 252 | border: none; |
paul@0 | 253 | } |
paul@0 | 254 | |
paul@0 | 255 | .rcdaybreak td a { |
paul@0 | 256 | font-size: 0.88em; |
paul@0 | 257 | } |
paul@0 | 258 | |
paul@0 | 259 | .rcicon1, .rcicon2 { |
paul@0 | 260 | text-align: center; |
paul@0 | 261 | } |
paul@0 | 262 | |
paul@0 | 263 | .rcpagelink { |
paul@0 | 264 | width: 33%; |
paul@0 | 265 | } |
paul@0 | 266 | |
paul@0 | 267 | .rctime { |
paul@0 | 268 | font-size: 0.88em; |
paul@0 | 269 | white-space: nowrap; |
paul@0 | 270 | } |
paul@0 | 271 | |
paul@0 | 272 | .rceditor { |
paul@0 | 273 | white-space: nowrap; |
paul@0 | 274 | font-size: 0.88em; |
paul@0 | 275 | } |
paul@0 | 276 | |
paul@0 | 277 | .rccomment { |
paul@0 | 278 | width: 50%; |
paul@0 | 279 | color: gray; |
paul@0 | 280 | font-size: 0.88em; |
paul@0 | 281 | } |
paul@0 | 282 | |
paul@0 | 283 | |
paul@0 | 284 | /* User Preferences */ |
paul@0 | 285 | |
paul@0 | 286 | .userpref table, .userpref td { |
paul@0 | 287 | border: none; |
paul@0 | 288 | } |
paul@0 | 289 | |
paul@0 | 290 | /* CSS for new code_area markup used by Colorizer and ParserBase */ |
paul@0 | 291 | |
paul@0 | 292 | div.codearea { /* the div makes the border */ |
paul@0 | 293 | margin: 0.5em 0; |
paul@0 | 294 | padding: 0; |
paul@0 | 295 | border: 1pt solid #AEBDCC; |
paul@0 | 296 | background-color: #F3F5F7; |
paul@0 | 297 | color: black; |
paul@0 | 298 | } |
paul@0 | 299 | |
paul@0 | 300 | div.codearea pre { /* the pre has no border and is inside the div */ |
paul@0 | 301 | margin: 0; |
paul@0 | 302 | padding: 10pt; |
paul@0 | 303 | border: none; |
paul@0 | 304 | } |
paul@0 | 305 | |
paul@0 | 306 | a.codenumbers { /* format of the line numbering link */ |
paul@0 | 307 | margin: 0 10pt; |
paul@0 | 308 | font-size: 0.85em; |
paul@0 | 309 | color: gray; |
paul@0 | 310 | } |
paul@0 | 311 | |
paul@0 | 312 | /* format of certain syntax spans */ |
paul@0 | 313 | div.codearea pre span.LineNumber {color: gray;} |
paul@0 | 314 | div.codearea pre span.ID {color: #000000;} |
paul@0 | 315 | div.codearea pre span.Operator {color: #0000C0;} |
paul@0 | 316 | div.codearea pre span.Char {color: #004080;} |
paul@0 | 317 | div.codearea pre span.Comment {color: #008000;} |
paul@0 | 318 | div.codearea pre span.Number {color: #0080C0;} |
paul@0 | 319 | div.codearea pre span.String {color: #004080;} |
paul@0 | 320 | div.codearea pre span.SPChar {color: #0000C0;} |
paul@0 | 321 | div.codearea pre span.ResWord {color: #A00000;} |
paul@0 | 322 | div.codearea pre span.ConsWord {color: #008080; font-weight: bold;} |
paul@0 | 323 | div.codearea pre span.Error {color: #FF8080; border: solid 1.5pt #FF0000;} |
paul@0 | 324 | div.codearea pre span.ResWord2 {color: #0080ff; font-weight: bold;} |
paul@0 | 325 | div.codearea pre span.Special {color: #0000ff;} |
paul@0 | 326 | div.codearea pre span.Preprc {color: #803999;} |
paul@0 | 327 | |
paul@0 | 328 | |
paul@0 | 329 | /* Search results */ |
paul@0 | 330 | |
paul@0 | 331 | .searchresults dt { |
paul@0 | 332 | margin-top: 1em; |
paul@0 | 333 | font-weight: normal; |
paul@0 | 334 | } |
paul@0 | 335 | |
paul@0 | 336 | .searchresults dd { |
paul@0 | 337 | font-size: 0.85em; |
paul@0 | 338 | } |
paul@0 | 339 | |
paul@0 | 340 | /* MonthCalendar css */ |
paul@0 | 341 | |
paul@0 | 342 | /* days without and with pages linked to them */ |
paul@0 | 343 | a.cal-emptyday { |
paul@0 | 344 | color: #777777; |
paul@0 | 345 | text-align: center; |
paul@0 | 346 | } |
paul@0 | 347 | a.cal-usedday { |
paul@0 | 348 | color: #000000; |
paul@0 | 349 | font-weight: bold; |
paul@0 | 350 | text-align: center; |
paul@0 | 351 | } |
paul@0 | 352 | /* general stuff: workdays, weekend, today */ |
paul@0 | 353 | td.cal-workday { |
paul@0 | 354 | background-color: #DDDDFF; |
paul@0 | 355 | text-align: center; |
paul@0 | 356 | } |
paul@0 | 357 | td.cal-weekend { |
paul@0 | 358 | background-color: #FFDDDD; |
paul@0 | 359 | text-align: center; |
paul@0 | 360 | } |
paul@0 | 361 | td.cal-today { |
paul@0 | 362 | background-color: #CCFFCC; |
paul@0 | 363 | border-style: solid; |
paul@0 | 364 | border-width: 2pt; |
paul@0 | 365 | text-align: center; |
paul@0 | 366 | } |
paul@0 | 367 | /* invalid places on the monthly calendar sheet */ |
paul@0 | 368 | td.cal-invalidday { |
paul@0 | 369 | background-color: #CCCCCC; |
paul@0 | 370 | } |
paul@0 | 371 | /* links to prev/next month/year */ |
paul@0 | 372 | a.cal-link { |
paul@0 | 373 | color: #000000; |
paul@0 | 374 | text-decoration: none; |
paul@0 | 375 | } |
paul@0 | 376 | th.cal-header { |
paul@0 | 377 | background-color: #DDBBFF; |
paul@0 | 378 | text-align: center; |
paul@0 | 379 | } |
paul@0 | 380 | |
paul@0 | 381 | /* for MonthCalendar mouseover info boxes */ |
paul@0 | 382 | TABLE.tip { |
paul@0 | 383 | color: black; |
paul@0 | 384 | background-color: #FF8888; |
paul@0 | 385 | font-size: small; |
paul@0 | 386 | font-weight: normal; |
paul@0 | 387 | border-style: solid; |
paul@0 | 388 | border-width: 1px; |
paul@0 | 389 | } |
paul@0 | 390 | |
paul@0 | 391 | TH.tip { |
paul@0 | 392 | background-color: #FF4444; |
paul@0 | 393 | font-weight: bold; |
paul@0 | 394 | text-align: center; |
paul@0 | 395 | } |
paul@0 | 396 | |
paul@0 | 397 | TD.tip { |
paul@0 | 398 | text-align: left; |
paul@0 | 399 | } |
paul@0 | 400 | *[dir="rtl"] TD.tip { |
paul@0 | 401 | text-align: right; |
paul@0 | 402 | } |
paul@0 | 403 | |
paul@0 | 404 | /* end MonthCalendar stuff */ |
paul@0 | 405 | |
paul@0 | 406 | /* vim: tabstop=4 expandtab shiftwidth=4 |
paul@0 | 407 | */ |