1/** 2 * webtrees: online genealogy 3 * Copyright (C) 2020 webtrees development team 4 * This program is free software: you can redistribute it and/or modify 5 * it under the terms of the GNU General Public License as published by 6 * the Free Software Foundation, either version 3 of the License, or 7 * (at your option) any later version. 8 * This program is distributed in the hope that it will be useful, 9 * but WITHOUT ANY WARRANTY; without even the implied warranty of 10 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 11 * GNU General Public License for more details. 12 * You should have received a copy of the GNU General Public License 13 * along with this program. If not, see <http://www.gnu.org/licenses/>. 14 */ 15 16/* The clouds theme */ 17@import "_base.css"; 18 19/* Colors for chart boxes, etc. */ 20:root { 21 --sex-f-fg: #aaaaaa; 22 --sex-m-fg: #aaaaaa; 23 --sex-u-fg: #aaaaaa; 24 --sex-f-bg: #ffdddd; 25 --sex-m-bg: #ddddff; 26 --sex-u-bg: #ffffff; 27 --chart-line: solid gray thin; 28 --chart-line-radius: 1rem; 29} 30 31/* Override Bootstrap formatting */ 32 33.table-given-name { 34 overflow-x: hidden; 35} 36 37.btn-link { 38 padding: 0 .25rem; 39} 40 41.container-fluid { 42 padding-left: 5px; 43 padding-right: 5px; 44} 45 46table { 47 border-collapse: separate; 48} 49 50.dropdown-menu { /* Fix dropdown on Place Lists/Place Hierarchy */ 51 z-index: 1010; 52} 53 54/* 55 * Pages have the following high-level structure: 56 * 57 * wt-global wt-theme-<THEME> wt-route-<ROUTE> 58 * +---wt-header-wrapper 59 * | +---wt-header-container 60 * | +---wt-header-content 61 * | +---wt-accessibility-links 62 * | +---wt-site-logo 63 * | +---wt-site-title 64 * | +---wt-header-search 65 * | | +---wt-header-search-form 66 * | | +---wt-header-search-field 67 * | | +---wt-header-search-button 68 * | +---wt-secondary-navigation 69 * | | +---wt-user-menu 70 * | +---wt-primary-navigation 71 * | +---wt-genealogy-menu 72 * +---wt-main-wrapper 73 * | +---wt-main-container 74 * | +---wt-main-content 75 * | +---wt-messages 76 * | +---wt-page-title 77 * | +---wt-page-options wt-page-options-xxxxx 78 * | +---wt-page-content 79 * +---wt-footers 80 * +---wt-footer wt-footer-xxxxx 81 */ 82 83.wt-global { 84 background: #c8e7ff url(clouds/images/background.png) repeat-x fixed top left; 85 color: #006; 86} 87 88.wt-header-wrapper { 89 background: #acf url(clouds/images/clouds.png) repeat-x; 90 border-bottom: thin solid #79c; 91} 92 93.wt-header-wrapper .dropdown-item.active { 94 background-color: inherit; 95 color: inherit; 96 font-weight: bold; 97} 98 99.wt-header-container { 100 margin-top: 0.5rem; 101} 102 103.wt-header-content { 104} 105 106.wt-accessibility-links { 107} 108 109.wt-site-logo { 110 display: none; 111} 112 113.wt-site-title { 114 order: 1; 115 flex: 1 1 content; 116 font-size: 1.5rem; 117} 118 119.wt-header-search { 120 order: 3; 121 flex: 0 0 15rem; 122} 123 124.wt-header-search-form { 125} 126 127.wt-header-search-field { 128} 129 130.wt-header-search-button { 131} 132 133.wt-secondary-navigation { 134 order: 2; 135 flex: 0 0 content; 136 white-space: nowrap; 137} 138 139.wt-user-menu { 140 flex-wrap: nowrap; 141} 142 143.wt-user-menu .nav-link { 144 display: inline-block; 145 padding: 0.5rem; 146} 147 148.wt-user-menu .nav-item + .nav-item::before { 149 content: "|"; 150} 151 152.wt-user-menu .dropdown-toggle:after { 153 display: none; 154} 155 156.wt-user-menu .dropdown-item { 157 padding-left: 1rem; 158 padding-right: 1rem; 159} 160 161.wt-primary-navigation { 162 order: 3; 163 flex: 1 0 auto; 164} 165 166.wt-genealogy-menu { 167 display: flex; flex-wrap: wrap; 168} 169 170.wt-genealogy-menu .nav-item { 171 padding: 0 0.75rem; 172} 173 174.wt-genealogy-menu .nav-link { 175 /* All menu icons are 22px x 22px */ 176 height: calc(22px + 1rem); 177 width: 22px; 178 /* Hide text */ 179 padding: 0.5rem 0; 180 overflow: hidden; 181} 182 183.wt-genealogy-menu .dropdown-item { 184 /* Space between icons and align with submenu icons */ 185 padding: 0 5px 0 0; 186} 187 188.wt-genealogy-menu .dropdown-item::before { 189 /* All submenu icons are 22px x 22px */ 190 height: 22px; 191 width: 22px; 192 /* Align icons and text */ 193 vertical-align: text-top; 194 /* Space between icon and text */ 195 padding: 0 .25rem; 196 line-height: 1.8; 197} 198 199.wt-genealogy-menu .nav-item::before { 200 /* The size of the menu icons */ 201 width: 22px; 202 height: 22px; 203} 204 205.wt-genealogy-menu .dropdown-item::before { 206 /* The size of the submneu icons */ 207 width: 22px; 208 height: 22px; 209} 210 211.wt-genealogy-menu .dropdown-item:first-child { 212 font-weight: bold; 213 text-align: center; 214 border-bottom: solid thin #ddd; 215} 216 217.menu-tree .nav-link::before { 218 content: url(clouds/menu/tree.png); 219} 220 221.menu-tree .dropdown-item:not(:first-child)::before { 222 content: url(clouds/menu/tree-tree.png); 223} 224 225.menu-chart .nav-link::before { 226 content: url(clouds/menu/chart.png); 227} 228 229.menu-chart-ancestry::before { 230 content: url(clouds/menu/chart-ancestors.png); 231} 232 233.menu-chart-compact::before { 234 content: url(clouds/menu/chart-compact.png); 235} 236 237.menu-chart-descendants::before { 238 content: url(clouds/menu/chart-descendants.png); 239} 240 241.menu-chart-familybook::before { 242 content: url(clouds/menu/chart-family-book.png); 243} 244 245.menu-chart-fanchart::before { 246 content: url(clouds/menu/chart-fanchart.png); 247} 248 249.menu-chart-hourglass::before { 250 content: url(clouds/menu/chart-hourglass.png); 251} 252 253.menu-chart-lifespan::before { 254 content: url(clouds/menu/chart-lifespan.png); 255} 256 257.menu-chart-pedigree::before { 258 content: url(clouds/menu/chart-pedigree.png); 259} 260 261.menu-chart-pedigreemap::before { 262 content: url(clouds/menu/chart-pedigree-map.png); 263} 264 265.menu-chart-relationship::before { 266 content: url(clouds/menu/chart-relationship.png); 267} 268 269.menu-chart-statistics::before { 270 content: url(clouds/menu/chart-statistics.png); 271} 272 273.menu-chart-timeline::before { 274 content: url(clouds/menu/chart-timeline.png); 275} 276 277.menu-chart-tree::before { 278 content: url(clouds/menu/chart-tree.png); 279} 280 281.menu-list .nav-link::before { 282 content: url(clouds/menu/list.png); 283} 284 285.menu-branches::before { 286 content: url(clouds/menu/branches.png); 287} 288 289.menu-list-fam::before { 290 content: url(clouds/menu/list-fam.png); 291} 292 293.menu-list-indi::before { 294 content: url(clouds/menu/list-indi.png); 295} 296 297.menu-list-note::before { 298 content: url(clouds/menu/list-note.png); 299} 300 301.menu-list-obje::before { 302 content: url(clouds/menu/list-obje.png); 303} 304 305.menu-list-plac::before { 306 content: url(clouds/menu/list-plac.png); 307} 308 309.menu-list-repo::before { 310 content: url(clouds/menu/list-repo.png); 311} 312 313.menu-list-sour::before { 314 content: url(clouds/menu/list-sour.png); 315} 316 317.menu-list-subm::before { 318 content: url(clouds/menu/list-indi.png); 319} 320 321.menu-calendar .nav-link::before { 322 content: url(clouds/menu/calendar.png); 323} 324 325.menu-calendar-day::before { 326 content: url(clouds/menu/calendar.png); 327} 328 329.menu-calendar-month::before { 330 content: url(clouds/menu/calendar.png); 331} 332 333.menu-calendar-year::before { 334 content: url(clouds/menu/calendar.png); 335} 336 337.menu-report .nav-link::before { 338 content: url(clouds/menu/report.png); 339} 340 341.menu-report .dropdown-item:not(:first-child)::before { 342 content: url(clouds/menu/report.png); 343} 344 345.menu-search .nav-link::before { 346 content: url(clouds/menu/search.png); 347} 348 349.menu-search .dropdown-item:not(:first-child)::before { 350 content: url(clouds/menu/search.png); 351} 352 353.menu-faq .nav-link::before { 354 content: url(clouds/menu/faq.png); 355} 356 357.menu-clippings .nav-link::before { 358 content: url(clouds/menu/clippings.png); 359} 360 361.menu-clippings-add::before { 362 content: url(clouds/menu/clippings-cart.png); 363} 364 365.menu-clippings-cart::before { 366 content: url(clouds/menu/clippings-cart.png); 367} 368 369.menu-clippings-download::before { 370 content: url(clouds/menu/edit-gedcom.png); 371} 372 373.menu-clippings-empty::before { 374 content: url(clouds/menu/edit-delete.png); 375} 376 377.menu-clippings-remove::before { 378 content: url(clouds/menu/edit-delete.png); 379} 380 381.menu-story .nav-link::before { 382 content: url(clouds/menu/story.png); 383} 384 385.wt-main-container { 386 /* Space between the header/footer and the main content. */ 387 padding-top: 1rem; 388 padding-bottom: 1rem; 389} 390 391.wt-main { 392} 393 394.wt-messages { 395} 396 397.wt-page-title { 398 text-align: center; 399} 400 401.wt-page-options { 402} 403 404.wt-page-options .form-group { 405 margin-bottom: 2px; 406} 407 408.wt-page-options-label { 409 color: #039; 410 background-color: #95b8e0; 411} 412 413.wt-page-options-value { 414 color: #006; 415 background-color: #ecf5ff; 416 border: thin solid #ccc; 417 padding: 0.25rem 0.75rem; 418} 419 420.wt-page-content { 421 margin-top: 1rem; 422} 423 424.wt-footers { 425} 426 427.wt-footer { 428} 429 430.wt-footer-contact { 431} 432 433.wt-footer-cookies { 434 background: #666; 435 color: #fff; 436 transition: height 0.5s; 437} 438 439.wt-footer-page-views { 440} 441 442.wt-footer-powered-by { 443} 444 445.wt-footer-powered-by-webtrees { 446 width: 100px; 447 height: 21px; 448 content: url(images/powered-by-webtrees.png); 449} 450 451/* 452 * The tree/user home pages 453 * 454 * wt-home-page / wt-user-page 455 * +---wt-main-blocks 456 * | +---wt-block, wt-block-AAA 457 * | +---wt-block, wt-block-BBB 458 * | +---wt-block, wt-block-CCC 459 * +---wt-side-blocks 460 * +---wt-block, wt-block-XXX 461 * +---wt-block, wt-block-YYY 462 * +---wt-block, wt-block-ZZZ 463 * 464 * Each block as the structure 465 * wt-block, wt-block-XXX 466 * +---wt-block-header, wt-block-header-XXX 467 * +---wt-block-content, wt-block-content-XXX 468 */ 469 470.wt-block { 471 color: #000; 472 margin-bottom: 5px; 473 padding: 1px; 474 vertical-align: top; 475} 476 477.wt-block-header { 478 background: url(clouds/images/block-header-background.png); 479 background-size: auto 100%; 480 padding: 0.25rem 0.75rem; 481} 482 483.wt-block-header::before { 484 content: url(clouds/images/block-header-disk.png); 485 margin: 0.5rem; 486} 487 488.wt-block-content { 489} 490 491.blockcontent { 492 border: solid #999 1px; 493 margin: 0 2px 10px 0; 494 overflow: auto; 495 padding: 5px; 496} 497 498.blockcontent .list_table { 499 border-spacing: 1px; 500 border: solid #999 1px; 501 border-right: 0; 502} 503 504.blockcontent .list_value, 505.blockcontent .list_value_wrap { 506 border: 0; 507 border-top: solid #999 1px; 508 border-right: solid #999 1px; 509} 510 511/* 512 * The individual page. 513 * 514 * wt-route-individual 515 * +---wt-header-wrapper 516 */ 517 518.wt-individual-silhouette { 519 content: url(images/individual-silhouette-unknown.png); 520} 521 522.wt-individual-silhouette-f { 523 content: url(images/individual-silhouette-female.png); 524} 525 526.wt-individual-silhouette-m { 527 content: url(images/individual-silhouette-male.png); 528} 529 530/* 531 * Chart-boxes are used to build the various charts. 532 * Each type of chart will set its own size and hide/show content. 533 * 534 * wt-chart-box 535 * +--- wt-chart-box-thumbnail 536 * +--- wt-chart-box-extra 537 * +--- wt-chart-box-zoom 538 * +--- wt-chart-box-icon 539 * +--- wt-chart-box-dropdown wt-chart-box-zoom-dropdown 540 * +--- wt-chart-box-links 541 * +--- wt-chart-box-icon 542 * +--- wt-chart-box-dropdown wt-chart-box-links-dropdown 543 * +--- wt-chart-box-name 544 * +--- wt-chart-box-lifespan 545 * +--- wt-chart-box-facts 546 * +--- wt-chart-box-fact 547 */ 548.wt-chart-box, 549.wt-chart-box-menu { 550 background: var(--sex-u-bg); 551 border: dashed var(--sex-u-fg) thin; 552} 553 554.wt-chart-box { 555 height: 5rem; 556 padding: 2px; 557 line-height: 1.1; 558} 559 560.wt-chart-box-f, 561.wt-chart-box-f .wt-chart-box-dropdown { 562 background: var(--sex-f-bg); 563 border: solid var(--sex-f-fg) thin; 564} 565 566.wt-chart-box-m, 567.wt-chart-box-m .wt-chart-box-dropdown { 568 background: var(--sex-m-bg); 569 border: solid var(--sex-m-fg) thin; 570} 571 572/* ====== Round Corners ======== */ 573input, 574fieldset, 575.border1, 576.block, 577.list_label, 578.list_label_wrap, 579.list_value, 580.list_value_wrap, 581.messagebox, 582.optionbox, 583.wt-chart-box, 584.person0, 585.person1, 586.person2, 587.person3, 588.person4, 589.person5, 590.wt-genealogy-menu ul, 591.user-menu li ul, 592footer, 593#indi_main_blocks, 594#tabs{ 595 border-radius: 3px; 596} 597 598a { 599 color: #039; 600 text-decoration: none; 601} 602 603a:hover { 604 color: #f00; 605 text-decoration: none; 606} 607 608:focus { 609 outline-style: none; 610} 611 612.flash-messages { 613 clear: both; 614 text-align: center; 615} 616 617img { 618 border: 0; 619} 620 621legend img { 622 height: 20px; 623 vertical-align: middle; 624 width: 20px; 625} 626 627img.block { 628 border: 0; 629 height: 25px; 630 vertical-align: middle; 631} 632 633.topbottombar { 634 font-size: 12px; 635 font-weight: bold; 636 padding: 4px; 637 text-align: center; 638} 639 640.button { 641 width: 60px; 642} 643 644button:focus { 645 outline: 0; 646} 647 648.alpha_index { 649 color: #999; 650} 651 652hr { 653 margin-top: 5px; 654 border-color: #006; 655} 656 657.list_table { 658 margin: 0 auto; 659} 660 661.list_label, 662.list_label_wrap { 663 color: #fff; 664 border: 1px solid #999; 665 font-weight: bold; 666 text-align: center; 667} 668 669.list_value, 670.list_value_wrap { 671 background-color: #edf7f9; 672 border: solid #999 1px; 673 vertical-align: top; 674} 675 676.list_label, 677.list_value { 678 white-space: nowrap; 679 padding: 4px; 680} 681 682.list_label_wrap, 683.list_value_wrap { 684 white-space: normal; 685} 686 687div.fact_SHARED_NOTE { 688 clear: both; 689} 690 691/* Table of genealogical facts */ 692.wt-facts-table { 693 border-collapse: separate; 694} 695 696.wt-facts-table caption { 697 caption-side: top; 698} 699 700.wt-facts-table th { 701 background-color: #95b8e0; 702 color: #039; 703 border: 1px solid #acf; 704 border-radius: 3px; 705 font-weight: normal; 706 text-align: center; 707 min-width: 20%; 708} 709 710.wt-facts-table td { 711 background: #fff; 712 border: solid #999 1px; 713 border-radius: 3px; 714} 715 716.wt-facts-table .wt-gender-M td { 717 background-color: #ddf; 718} 719 720.wt-facts-table .wt-gender-F td { 721 background-color: #fdd; 722} 723 724.name1 { 725 font-weight: bold; 726 font-size: 12px; 727} 728 729.name2 { 730 font-size: 16px; 731 } 732 733a:hover .name1, a:hover .name2 { 734 color: #f00; 735 font-weight: bold; 736 font-size: 12px; 737} 738 739.details_label { 740 font-weight: bold; 741} 742 743.date { 744 color: #039; 745} 746 747.label { 748 font-weight: bold; 749} 750 751.error { 752 color: #d00; 753 font-weight: bold; 754} 755 756.largeError { 757 color: #d00; 758 font-size: large; 759 font-weight: bold; 760} 761 762.warning { 763 color: #f00; 764 font-weight: bold; 765} 766 767.indent { 768 padding-left: 7px; 769} 770 771.thumbnail { 772 height: auto; 773 padding: 3px; 774} 775 776.icon { 777 border: 0; 778 padding: 0 5px; 779} 780 781.subheaders { 782 color: #006; 783 font-weight: bold; 784 font-size: 15px; 785 margin-top: 15px; 786 vertical-align: bottom; 787} 788 789.parentdeath { 790 border: thin solid #888; 791 padding: 1px; 792} 793 794.source_citations { 795 display: none; 796} 797 798.selected-option { 799 background-color: #cef; 800} 801 802.border1 { 803 border: solid #000 1px; 804} 805 806.journal_box { 807 padding: 3pt; 808 border: thin solid #aaa; 809 overflow: visible; 810} 811 812.news_box { 813 border-top: solid #ccc 1px; 814} 815 816.news_title { 817 color: #000; 818 font-weight: bold; 819} 820 821.news_date { 822 color: #000; 823 margin-bottom: 12px; 824} 825 826.current_day { 827 font-weight: bold; 828 font-size: 16px; 829} 830 831.cal_day { 832 float: left; 833 font-weight: bold; 834} 835 836#user-page h1 { 837 margin: 0.25em auto 0.6em; 838} 839 840.tvertline { 841 vertical-align: bottom; 842} 843 844#childbox { 845 padding: 5px; 846 position: absolute; 847 display: none; 848 text-align: start; 849 white-space: nowrap; 850 top: 20px; 851 left: 0; 852} 853 854.layout3 #childbox { 855 top: auto; 856 bottom: 20px; 857} 858 859#childbox a.name1 { 860 display: block; 861 margin-left: 5px; 862} 863 864.person0 { 865 background-color: #ddf; 866 border: outset #999 1px; 867 vertical-align: top; 868} 869 870.person1 { 871 background-color: #afa; 872 border: outset #afa 1px; 873 vertical-align: top; 874} 875 876.person2 { 877 background-color: #faa; 878 border: outset #faa 1px; 879 vertical-align: top; 880} 881 882.person3 { 883 background-color: #aad; 884 border: outset #55f 1px; 885 vertical-align: top; 886} 887 888.person4 { 889 background-color: #f55; 890 border: outset #f55 1px; 891 vertical-align: top; 892} 893 894.person5 { 895 background-color: #5f5; 896 border: outset #5f5 1px; 897 vertical-align: top; 898} 899 900.starredname { 901 text-decoration: underline; 902} 903 904.search_hit { 905 background-color: #ff0; 906} 907 908.descriptionbox { 909 font-size: 12px; 910 border: 1px solid #ccc; 911 vertical-align: top; 912 padding: 3px; 913} 914 915.optionbox { 916 font-size: 1rem; 917 background-color: #ecf5ff; 918 color: #006; 919 border: solid #ccc 1px; 920 vertical-align: top; 921 white-space: nowrap; 922 padding: 3px; 923} 924 925.red { 926 color: #f00; 927} 928 929.wt-relation-fact, 930.wt-historic-fact { 931 opacity: 0.8; 932} 933 934.messagebox { 935 background-color: #c2ceef; 936 border: solid #ccc 1px; 937} 938 939/* ---Pending edits--- */ 940.wt-new { 941 outline: solid blue 1px; 942} 943 944.wt-old { 945 outline: solid red 1px; 946} 947 948.tag_cloud { 949 text-align: center; 950} 951 952.tag_cloud a { 953 white-space: nowrap; 954} 955 956.nowrap { 957 white-space: nowrap; 958} 959 960.wrap { 961 white-space: normal; 962} 963 964.statistics-page { 965 text-align: center; 966} 967 968.gchart { 969 border: solid #999 1px; 970} 971 972#facts_content dd { 973 float: left; 974 width: 70%; 975} 976 977/* this keeps the tag color the same when it is a link as when not */ 978 979.place { 980 padding-top: 5px; 981} 982 983.filtersH, 984.filtersF { 985 margin: 4px; 986} 987 988.filtersH img { 989 margin-bottom: 2px; 990} 991 992.list-charts { 993 text-align: center; 994} 995 996#place-hierarchy h2, 997#place-hierarchy h4 { 998 text-align: center; 999} 1000 1001.user_welcome_block table, 1002.gedcom_block_block table { 1003 margin: auto; 1004} 1005 1006.user_welcome_block td, 1007.gedcom_block_block td { 1008 width: 33%; 1009 text-align: center; 1010 vertical-align: top; 1011} 1012 1013/* ==== FAQ table styles ===== */ 1014table.faq { 1015 background-color: #eee; 1016 margin: 5px 0 50px 5px; 1017 width: 98%; 1018} 1019 1020table.faq tr:nth-child(odd) td { 1021 background-color: #eee; 1022} 1023 1024div.faq_title { 1025 background-color: #eee; 1026 margin: 1em 0; 1027 padding: .25em; 1028 font-weight: bold; 1029 width: 98%; 1030} 1031 1032div.faq_body { 1033 clear: both; 1034 padding: 0 1em; 1035} 1036 1037.faq_top { 1038 float: right; 1039} 1040 1041/* === Positioning edit, copy, delete links === */ 1042/* General use */ 1043.editfacts { 1044 clear: left; 1045 padding-top: 15px; 1046} 1047 1048#indi_note { 1049 margin: 0 0 5px; 1050} 1051 1052.indi_table { 1053 clear: left; 1054} 1055 1056#sex { 1057 float: right; 1058} 1059 1060#dates { 1061 color: #333; 1062 float: right; 1063} 1064 1065#individual-names .wt-icon-edit, 1066#individual-names .wt-icon-delete { 1067 float: right; 1068} 1069 1070#indi_note .fact_NOTE { 1071 float: left; 1072 margin: 0 5px 0 0; 1073} 1074 1075#indi_note .fact_SOUR { 1076 margin: 3px 0; 1077} 1078 1079#indi_note .fact_SOUR a { 1080 font-size: 100%; 1081} 1082 1083#indi_note .fact_NOTE, 1084#indi_note .fact_SOUR { 1085 clear: both; 1086} 1087 1088/* markdown formatting */ 1089 1090.markdown { 1091 /* Tables and pre-formatted text can break the layout. */ 1092 overflow-x: auto; 1093} 1094 1095.markdown p { 1096 margin: 0 0 0.5em; 1097 white-space: pre-wrap; 1098} 1099 1100.markdown table { 1101 border-collapse: collapse; 1102 margin-bottom: 5px; 1103} 1104 1105.markdown th { 1106 font-weight: bold; 1107} 1108 1109.markdown td, 1110.markdown th { 1111 border: solid thin #000; 1112 padding: 3px; 1113} 1114 1115.odometer { 1116 font-family: courier, monospace; 1117 font-weight: bold; 1118 background: #000; 1119 color: #fff; 1120} 1121 1122/* ======== Indi tabs ======== */ 1123.media-display-image { 1124 float: left; 1125} 1126 1127.media-display-title { 1128 float: left; 1129 font-style: italic; 1130 margin: 10px; 1131} 1132 1133.upcoming_events_block button, 1134.todays_events_block button { 1135 margin: 0 20px; 1136} 1137 1138/* Sidebar - Family navigator */ 1139.wt-family-navigator-dropdown-heading { 1140 font-weight: bold; 1141 font-size: inherit; 1142 color: inherit; 1143} 1144 1145/* Sidebar - Descendants */ 1146#sb_content_descendancy { 1147 margin-top: 0; 1148} 1149 1150#sb_desc_content { 1151 margin-left: 3px; 1152 font-size: 0.8em; 1153} 1154 1155#sb_desc_content ul { 1156 padding: 0; 1157 margin: 0; 1158} 1159 1160.sb_desc_indi_li { 1161 list-style-type: none; 1162 margin-left: 5px; 1163} 1164 1165/* Individuals and Families */ 1166#sidebar-content-individuals, 1167#sidebar-content-families { 1168 margin-top: 0; 1169} 1170 1171.sb_indi_surname_li, 1172.sb_fam_surname_li { 1173 list-style-image: url(icons/plus.png); 1174} 1175 1176.name_tree_div ul { 1177 padding: 0; 1178 margin: 0; 1179} 1180 1181.name_tree_div li { 1182 list-style: none; 1183 margin: 0; 1184 padding: 0; 1185} 1186 1187/* Clippings */ 1188#sb_clippings_content ul { 1189 padding: 0; 1190 margin: 0; 1191} 1192 1193#sb_clippings_content li { 1194 list-style: none; 1195 margin: 0; 1196 padding: 0; 1197 white-space: nowrap; 1198} 1199 1200/* Stories module */ 1201.story_title { 1202 padding-top: 12px; 1203 font-size: 13px; 1204 height: 32px; 1205 font-weight: bold; 1206} 1207 1208.story_body { 1209 padding: 20px; 1210 white-space: normal; 1211} 1212 1213.story_edit { 1214 padding: 12px; 1215} 1216 1217/*-- Fan chart ---- */ 1218.fan_chart_menu { 1219 background: #fff; 1220 position: absolute; 1221 display: none; 1222 z-index: 100; 1223} 1224 1225#fan_chart ul { 1226 list-style-type: none; 1227 margin: 0; 1228} 1229 1230/* Lifespans chart */ 1231.wt-lifespans-subtitle { 1232 text-align: center; 1233} 1234 1235.wt-lifespans-scale { 1236 white-space: nowrap; 1237} 1238 1239.wt-lifespans-decade { 1240 width: 70px; 1241 height: 60px; 1242 display: inline-block; 1243 background-image: url(images/lifespan-decade.png); 1244 background-position-y: bottom; 1245 background-repeat: no-repeat; 1246 background-size: 70px 37px; 1247} 1248 1249.wt-lifespans-individuals { 1250 background: #fafafa; 1251} 1252 1253.wt-lifespans-individual { 1254 1255} 1256 1257.wt-lifespans-summary { 1258 background: #ffffff; 1259 border: thin solid #000; 1260 z-index: 1; 1261} 1262 1263.wt-lifespans-summary-link { 1264 font-weight: bold; 1265} 1266 1267/*-- timeline --*/ 1268#timeline_chart { 1269 position: relative; 1270 top: 0; 1271 left: 0; 1272} 1273 1274[class^="icon-"], 1275[class*=" icon-"] { 1276 display: inline-block; 1277 vertical-align: middle; 1278 background-repeat: no-repeat; 1279 background-size: cover; 1280} 1281 1282.icon-cfamily { 1283 content: url(clouds/images/cfamily.png); 1284} 1285 1286.icon-childless { 1287 content: url(images/childless.png); 1288} 1289 1290.icon-children { 1291 content: url(images/children.png); 1292} 1293 1294.icon-edit_indi { 1295 content: url(clouds/images/edit_indi.png); 1296} 1297 1298.icon-fam-list { 1299 content: url(clouds/images/sfamily.png); 1300} 1301 1302.icon-indi-list { 1303 content: url(clouds/images/indis.png); 1304} 1305 1306.icon-loading-small { 1307 content: url(images/indicator.gif); 1308} 1309 1310.icon-minus { 1311 content: url(icons/minus.png); 1312} 1313 1314.icon-mypage { 1315 content: url(clouds/images/mypage.png); 1316} 1317 1318.icon-plus { 1319 content: url(icons/plus.png); 1320} 1321 1322.icon-resn-confidential { 1323 content: url(images/resn_confidential.png); 1324} 1325 1326.icon-resn-locked { 1327 content: url(images/resn_locked.png); 1328} 1329 1330.icon-resn-none { 1331 content: url(images/resn_none.png); 1332} 1333 1334.icon-resn-privacy { 1335 content: url(images/resn_privacy.png); 1336} 1337 1338.icon-rings { 1339 content: url(images/rings.png); 1340} 1341 1342.icon-selected { 1343 content: url(clouds/images/selected.png); 1344} 1345 1346/* Silhouettes on charts */ 1347.icon-silhouette-F { 1348 content: url(clouds/images/silhouette_female_small.png); 1349} 1350 1351.icon-silhouette-M { 1352 content: url(clouds/images/silhouette_male_small.png); 1353} 1354 1355.icon-silhouette-U { 1356 content: url(clouds/images/silhouette_unknown_small.png); 1357} 1358 1359/* Tbl hdrs and Light Text */ 1360.descriptionbox, 1361.topbottombar, 1362.topbottombar a, 1363.list_label, 1364.list_label a { 1365 background-color: #95b8e0; 1366 color: #039; 1367} 1368 1369/* Base Color */ 1370.blockcontent, 1371.list_value, 1372.list_value_wrap, 1373.news_box { 1374 background: inherit; 1375} 1376 1377footer .error { 1378 color: #d00; 1379 font-weight: bold; 1380} 1381 1382.user_links { 1383 white-space: nowrap; 1384} 1385 1386/* 1387 * Any element that is loaded dynamically has the class wt-ajax-load. 1388 * We can provide a "loading" placeholder for empty elements with this class. 1389 */ 1390.wt-ajax-load:empty { 1391 height: 32px; 1392 background: url(images/loading-32x32.gif) no-repeat 50% 50%; 1393} 1394 1395/* 1396 * Default icons are provided by FontAwesome. 1397 */ 1398.wt-icon-anniversary { 1399 content: url(icons/anniversary.png); 1400} 1401 1402.wt-icon-arrow-down { 1403 content: url(clouds/icons/arrow-down.png); 1404} 1405 1406a > .wt-icon-arrow-down:hover { 1407 content: url(clouds/icons/arrow-down-hover.png); 1408} 1409 1410.wt-icon-arrow-left { 1411 content: url(clouds/icons/arrow-left.png); 1412} 1413 1414a > .wt-icon-arrow-left:hover { 1415 content: url(clouds/icons/arrow-left-hover.png); 1416} 1417 1418.wt-icon-arrow-right { 1419 content: url(clouds/icons/arrow-right.png); 1420} 1421 1422a > .wt-icon-arrow-right:hover { 1423 content: url(clouds/icons/arrow-right-hover.png); 1424} 1425 1426.wt-icon-arrow-up { 1427 content: url(clouds/icons/arrow-up.png); 1428} 1429 1430a > .wt-icon-arrow-up:hover { 1431 content: url(clouds/icons/arrow-up-hover.png); 1432} 1433 1434.wt-icon-bing-maps { 1435 content: url(icons/bing-maps.png); 1436} 1437 1438.wt-icon-calendar { 1439 content: url(icons/calendar.png) 1440} 1441 1442.wt-icon-collapse { 1443} 1444 1445.wt-icon-coordinates { 1446 content: url(icons/coordinates.png) 1447} 1448 1449.wt-icon-copy { 1450 content: url(icons/copy.png) 1451} 1452 1453.wt-icon-delete { 1454 content: url(icons/delete.png); 1455} 1456 1457.wt-icon-edit { 1458 content: url(icons/edit.png); 1459} 1460 1461.wt-icon-expand { 1462} 1463 1464.wt-icon-family { 1465 content: url(icons/family.png); 1466} 1467 1468.wt-icon-google-maps { 1469 content: url(icons/google-maps.png); 1470} 1471 1472.wt-icon-help { 1473 content: url(clouds/icons/help.png); 1474} 1475 1476.wt-icon-individual { 1477 content: url(icons/individual.png); 1478} 1479 1480.wt-icon-keyboard { 1481 content: url(icons/keyboard.png); 1482} 1483 1484.wt-icon-media { 1485 content: url(icons/media.png); 1486} 1487 1488.wt-icon-note { 1489 content: url(icons/note.png); 1490} 1491 1492.wt-icon-openstreetmap { 1493 content: url(icons/openstreetmap.png); 1494} 1495 1496.wt-icon-preferences { 1497 content: url(clouds/icons/preferences.png); 1498} 1499 1500.wt-icon-reorder { 1501 content: url(icons/reorder.png); 1502} 1503 1504.wt-icon-repository { 1505 content: url(icons/repository.png); 1506} 1507 1508.wt-icon-sex { 1509 height: 1em; 1510} 1511 1512.wt-icon-sex-f { 1513 content: url(icons/sex-female.png); 1514} 1515 1516.wt-icon-sex-m { 1517 content: url(icons/sex-male.png); 1518} 1519 1520.wt-icon-sex-u { 1521 content: url(icons/sex-unknown.png); 1522} 1523 1524.wt-icon-sex-x { 1525 content: url(icons/sex-unknown.png); 1526} 1527 1528.wt-icon-source { 1529 content: url(icons/source.png); 1530} 1531 1532.wt-icon-submitter { 1533 content: url(icons/individual.png); 1534} 1535 1536.wt-icon-warning { 1537 content: url(icons/warning.png); 1538} 1539 1540.wt-icon-zoom-in { 1541 content: url(clouds/icons/zoom-in.png); 1542} 1543 1544.wt-icon-zoom-out { 1545 content: url(clouds/icons/zoom-out.png); 1546} 1547 1548/* Miscellaneous images */ 1549.icon-indis { 1550 content: url(clouds/images/indis.png); 1551} 1552 1553.icon-patriarch { 1554 content: url(clouds/images/patriarch.png); 1555} 1556 1557.icon-pedigree { 1558 content: url(clouds/images/pedigree.png); 1559} 1560 1561.icon-sfamily { 1562 content: url(clouds/images/sfamily.png); 1563} 1564 1565.icon-user_add { 1566 content: url(clouds/images/user_add.png); 1567} 1568 1569/* Census assistant */ 1570.wt-census-assistant-form-control:focus { 1571 min-width: 12rem; 1572} 1573 1574/* Some blocks show a reduced version on the right-hand side. */ 1575.wt-side-blocks .wt-side-block-optional { 1576 display: none !important; 1577} 1578 1579/* my page chart enhancements */ 1580.wt-block-content-charts { 1581 overflow: auto; 1582} 1583 1584/* Some charts are wider than the page. */ 1585.wt-chart { 1586 overflow-x: auto; 1587 overflow-y: hidden; 1588} 1589 1590/* Fit thumbnail into parent on charts */ 1591.select2-selection.select2-selection--single { 1592 min-height: 36px; 1593 height: auto; 1594 padding: 2px 0; 1595} 1596 1597.select2-container .select2-selection--single .select2-selection__rendered { 1598 padding-left: 2px; 1599} 1600 1601.select2-selection--single .NAME { 1602 padding-left: 4px; 1603} 1604 1605/* Some menus (e.g. languages) can be longer than a page */ 1606.dropdown-menu { 1607 max-height: 30rem; 1608 overflow-x: hidden; 1609} 1610 1611/* Forms */ 1612.col-form-label { 1613 font-weight: bold; 1614} 1615