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