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