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