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