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