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