1 /* event-aggregator.css - some additional styles for the EventAggregator macro 2 which can be included in screen.css and print.css 3 using... 4 5 @import "event-aggregator.css"; 6 7 ...before any rules. 8 9 Copyright (c) 2009, 2010, 2011, 2012 by Paul Boddie 10 Licensed under the GNU GPL (v2 or later), see COPYING.txt for details. 11 */ 12 13 /* Controls. */ 14 15 .event-controls { 16 display: block; 17 } 18 19 .event-view-controls, 20 .event-download-controls { 21 text-align: center; 22 } 23 24 .event-view, 25 .event-download { 26 margin-left: 1em; 27 margin-right: 1em; 28 text-align: left; 29 } 30 31 .event-view a { 32 font-size: smaller; 33 } 34 35 .event-download { 36 position: relative; 37 font-size: smaller; 38 padding-bottom: 0.5em; 39 } 40 41 .event-download-popup { 42 display: none; 43 font-size: larger; 44 } 45 46 .event-download:hover .event-download-popup, 47 .event-day-box:hover .event-day-number-popup { 48 display: block; 49 position: absolute; 50 left: 0; 51 z-index: 3; 52 background-color: #fff; 53 color: #000; 54 border: 1px solid #000; 55 } 56 57 .event-download:hover .event-download-popup { 58 top: 1em; /* negligible top padding + 1em, leaving 0.5em bottom padding */ 59 padding: 0.5em 0.5em 0 0.5em; 60 } 61 62 .event-day-box:hover .event-day-number-popup { 63 top: 1.25em; /* 0.25em top padding + 1em, leaving 0.25em bottom padding */ 64 padding: 0.5em; 65 } 66 67 .event-download-item { 68 padding-top: 0.5em; 69 margin-bottom: 0.5em; 70 border-top: 1px solid #ddd; 71 border-bottom: 1px solid #ddd; 72 white-space: nowrap; 73 } 74 75 .event-download-webcal a { 76 background-color: #99d; 77 } 78 79 .event-download-http a { 80 background-color: #d99; 81 } 82 83 .event-download-webcal a:hover, 84 .event-download-webcal a:active { 85 background-color: #00d; 86 } 87 88 .event-download-http a:hover, 89 .event-download-http a:active { 90 background-color: #d00; 91 } 92 93 .event-download-webcal a, 94 .event-download-webcal a:link, 95 .event-download-webcal a:hover, 96 .event-download-webcal a:active, 97 .event-download-webcal a:visited, 98 .event-download-http a, 99 .event-download-http a:link, 100 .event-download-http a:hover, 101 .event-download-http a:active, 102 .event-download-http a:visited { 103 font-size: inherit; 104 font-weight: bold; 105 color: #fff !important; 106 text-decoration: none !important; 107 padding: 0.25em; 108 margin-right: 0.25em; 109 } 110 111 .event-download-link, 112 .event-download-period { 113 display: block; 114 text-align: right; 115 } 116 117 .event-download-link { 118 margin: 0; 119 padding-bottom: 0.5em; 120 } 121 122 .event-download-period { 123 margin-top: 0.5em; 124 } 125 126 .event-download-period-raw { 127 display: block; 128 font-size: smaller; 129 text-align: right; 130 } 131 132 /* Calendar view. */ 133 134 .event-month { 135 width: 98%; 136 border-bottom: 1px solid #dddddd; 137 table-layout: fixed; 138 } 139 140 .event-map-heading, 141 .event-month-heading, 142 .event-full-day-heading { 143 background-color: #777777; 144 color: #ffffff; 145 text-align: center; 146 font-weight: bold; 147 border: 0; 148 } 149 150 .event-map-heading a:link, 151 .event-map-heading a:hover, 152 .event-map-heading a:visited, 153 .event-month-heading a:link, 154 .event-month-heading a:hover, 155 .event-month-heading a:visited, 156 .event-full-day-heading a:link, 157 .event-full-day-heading a:hover, 158 .event-full-day-heading a:visited { 159 color: inherit !important; 160 } 161 162 .event-map-heading .previous, 163 .event-month-heading .previous, 164 .event-full-day-heading .previous, 165 .event-listings-heading .previous { 166 float: left; 167 } 168 169 .event-map-heading .next, 170 .event-month-heading .next, 171 .event-full-day-heading .next, 172 .event-listings-heading .next { 173 float: right; 174 } 175 176 .event-weekday-heading { 177 background-color: #999999; 178 color: #ffffff; 179 text-align: center; 180 border: 1px solid #dddddd; 181 } 182 183 /* Day types: days with content (busy), unused days (excluded or empty), 184 current (today). */ 185 186 .event-day-current.event-day-busy, 187 .event-day-current.event-day-empty { 188 background-color: #ffdddd; 189 } 190 191 .event-day-busy, 192 .event-timespan-busy { 193 background-color: #ffffff; 194 } 195 196 .event-day-excluded { 197 background-color: #dddddd; 198 border-left: 1px solid #dddddd; 199 border-right: 1px solid #dddddd; 200 } 201 202 .event-day-empty, 203 .event-timespan-empty { 204 background-color: #ffffff; 205 border-left: 1px solid #dddddd; 206 border-right: 1px solid #dddddd; 207 } 208 209 .event-day-content.event-day-empty { 210 padding-bottom: 2em; 211 } 212 213 /* Day headings and numbers. */ 214 215 .event-day-current.event-day-heading { 216 background-color: #ffdddd; 217 } 218 219 .event-day-heading { 220 width: 14%; 221 vertical-align: top; 222 padding-top: 0; 223 padding-left: 0; 224 padding-bottom: 0.5em; 225 border-top: 1px solid #dddddd; 226 border-bottom: 0; 227 border-left: 1px solid #dddddd; 228 border-right: 1px solid #dddddd; 229 } 230 231 .event-day-box { 232 position: relative; /* see event-day-number-popup */ 233 } 234 235 .event-day-empty span.event-day-number { 236 color: #000000; 237 } 238 239 .event-day-busy span.event-day-number { 240 background-color: #555555; 241 color: #ffffff; 242 } 243 244 .event-day-number { 245 padding: 0.25em; 246 } 247 248 .event-day-number a:link, 249 .event-day-number a:hover, 250 .event-day-number a:visited { 251 color: inherit !important; 252 } 253 254 .event-day-number-link { 255 display: block; 256 } 257 258 /* Day content. */ 259 260 .event-day-content { 261 width: 14%; 262 vertical-align: top; 263 padding: 0; 264 border-top: 0; 265 border-bottom: 0; 266 } 267 268 .event-day-starting { 269 border-left: 0; 270 border-right: 1px solid #dddddd; 271 } 272 273 .event-day-ending { 274 border-left: 1px solid #dddddd; 275 border-right: 0; 276 } 277 278 .event-day-full, 279 .event-day-single, 280 .event-day-multiple { 281 border-left: 1px solid #dddddd; 282 border-right: 1px solid #dddddd; 283 } 284 285 .event-day-current.event-day-start-gap, 286 .event-day-current.event-day-end-gap { 287 background-color: #ffdddd; 288 } 289 290 .event-day-start-gap { 291 width: 2%; 292 border-top: 0; 293 border-bottom: 0; 294 border-left: 1px solid #dddddd; 295 border-right: 0; 296 } 297 298 .event-day-end-gap { 299 width: 2%; 300 border-top: 0; 301 border-bottom: 0; 302 border-left: 0; 303 border-right: 1px solid #dddddd; 304 } 305 306 /* Event details. */ 307 308 .event-summary-box { 309 position: relative; 310 } 311 312 .event-day-content a:link, 313 .event-day-content a:hover, 314 .event-day-content a:visited { 315 color: inherit !important; 316 } 317 318 .event-summary { 319 padding: 0.75em; 320 margin-left: 0; 321 margin-right: 0; 322 overflow: hidden; 323 } 324 325 .event-day-single .event-summary { 326 padding: 0.75em 0.25em 0.75em 0.25em; 327 margin-left: 0.5em; 328 margin-right: 0.5em; 329 } 330 331 .event-summary-popup, 332 .event-day-number-popup { 333 display: none; 334 overflow: show; 335 position: absolute; 336 left: 0.5em; 337 top: 0; 338 z-index: 2; 339 padding: 0.75em 0.25em 0.75em 0.25em; 340 margin-right: 0.5em; 341 } 342 343 .event-summary-box:hover > .event-summary-popup { 344 display: block; 345 } 346 347 .event-summary-box:hover > .event-summary a { 348 visibility: hidden; 349 } 350 351 /* Day spacers. */ 352 353 .event-day-current.event-day-spacer { 354 background-color: #ffdddd; 355 } 356 357 .event-day-spacer { 358 min-height: 0.5em; 359 border-top: 0; 360 border-bottom: 0; 361 border-left: 1px solid #dddddd; 362 border-right: 1px solid #dddddd; 363 } 364 365 /* Day view, showing days from a calendar. */ 366 367 .event-calendar-day { 368 width: 98%; 369 border-bottom: 1px solid #dddddd; 370 } 371 372 .event-scale-heading, 373 .event-timespan-content, 374 .event-timespan-spacer { 375 border-top: 1px solid #dddddd; 376 border-bottom: 1px solid #dddddd; 377 border-left: 0; 378 border-right: 0; 379 } 380 381 .event-location-heading, 382 .event-location-spacer { 383 border: 0; 384 } 385 386 .event-location-heading, 387 .event-location-spacer, 388 .event-timespan-spacer, 389 .event-full-day-spacer { 390 background-color: #ffffff; 391 } 392 393 .event-location-heading { 394 text-align: center; 395 border: 0; 396 border-left: 1px dotted #ddd; 397 border-right: 1px dotted #ddd; 398 background-color: #ffffff; 399 } 400 401 .event-scale-heading { 402 padding-bottom: 2em; 403 } 404 405 .event-scale-heading, 406 .event-timespan-content { 407 vertical-align: top; 408 } 409 410 .event-timespan-content a:link, 411 .event-timespan-content a:hover, 412 .event-timespan-content a:visited { 413 color: inherit !important; 414 } 415 416 .event-timespan-spacer { 417 width: 2%; 418 } 419 420 /* List/summary view. */ 421 422 .event-listings { 423 list-style: none; 424 } 425 426 .event-listings-heading { 427 border-bottom: 1px solid #999999; 428 text-align: center; 429 } 430 431 .event-period-listings { 432 list-style: disc; 433 padding-bottom: 2em; 434 } 435 436 /* Table view */ 437 438 .event-table { 439 width: 98%; 440 } 441 442 .event-table-heading { 443 font-weight: bold; 444 } 445 446 .event-table-details a:link, 447 .event-table-details a:hover, 448 .event-table-details a:visited { 449 color: inherit !important; 450 } 451 452 .event-table-category-conference { 453 background-color: #ff9999; 454 color: #000000; 455 } 456 457 .event-table-category-training { 458 background-color: #99ff99; 459 color: #000000; 460 } 461 462 .event-table-category-special { 463 background-color: #ffff99; 464 color: #000000; 465 } 466 467 /* Map view. */ 468 469 .event-map { 470 text-align: center; 471 } 472 473 .event-map table { 474 display: inline-block; 475 } 476 477 .event-map-container { 478 position: relative; 479 margin: 0; 480 padding: 0; 481 text-align: left; 482 } 483 484 .event-map-container > img { 485 margin: 0; 486 padding: 0; 487 border: 0; 488 /* image and dimensions specified in the HTML */ 489 } 490 491 .event-map-container > ol { 492 margin: 0; 493 padding: 0; 494 list-style-type: none; 495 } 496 497 /* Label element and pop-up effects. */ 498 499 div.event-map-label-only { 500 display: none; 501 } 502 503 div.event-map-label { 504 position: absolute; 505 /* position and dimensions specified in the HTML */ 506 border: 2px solid #d00; 507 } 508 509 div.event-map-label .event-map-details { 510 display: none; 511 position: absolute; 512 top: 0; 513 left: 0; 514 z-index: 2; 515 min-width: 10em; 516 } 517 518 div.event-map-label:hover .event-map-details { 519 display: block; 520 } 521 522 /* Details elements. */ 523 524 .event-map-shadow { 525 background-color: #555; 526 } 527 528 .event-map-shadow .event-map-location { 529 position: relative; 530 top: -8px; 531 left: -8px; 532 padding: 0.25em; 533 background-color: #fff; 534 } 535 536 .event-map-unpositioned h2, 537 .event-map-location h2 { 538 font-size: inherit !important; 539 text-align: center; 540 } 541 542 .event-map-unpositioned:not(:target) h2, 543 .event-map-unpositioned:target .event-map-show-control, 544 .event-map-unpositioned:not(:target) .event-map-hide-control, 545 .event-map-unpositioned:not(:target) ul.event-map-location-events { 546 display: none; 547 } 548 549 .event-map-unpositioned:target h2, 550 .event-map-unpositioned:not(:target) .event-map-show-control, 551 .event-map-unpositioned:target .event-map-hide-control, 552 .event-map-unpositioned:target ul.event-map-location-events { 553 display: block; 554 } 555 556 ul.event-map-location-events { 557 list-style-type: none; 558 padding: 0.25em; 559 } 560 561 ul.event-map-location-events li { 562 text-align: left; 563 padding: 0.25em 0 0.25em 0; 564 } 565 566 .event-map-period { 567 display: block; 568 font-size: smaller; 569 } 570 571 /* New event form. */ 572 573 td.event-time-selection, 574 td.event-zone-selection, 575 td.event-regime-selection.event-end-time { 576 vertical-align: bottom; 577 } 578 579 td.event-time-selection.label, 580 td.event-regime-selection { 581 vertical-align: top; 582 } 583 584 /* vim: tabstop=4 expandtab shiftwidth=4 585 */