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