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.details_label { 743 font-weight: bold; 744} 745 746.date { 747 color: #039; 748} 749 750.label { 751 font-weight: bold; 752} 753 754.error { 755 color: #d00; 756 font-weight: bold; 757} 758 759.largeError { 760 color: #d00; 761 font-size: large; 762 font-weight: bold; 763} 764 765.warning { 766 color: #f00; 767 font-weight: bold; 768} 769 770.indent { 771 padding-left: 7px; 772} 773 774.thumbnail { 775 height: auto; 776 padding: 3px; 777} 778 779.icon { 780 border: 0; 781 padding: 0 5px; 782} 783 784.subheaders { 785 color: #006; 786 font-weight: bold; 787 font-size: 15px; 788 margin-top: 15px; 789 vertical-align: bottom; 790} 791 792.parentdeath { 793 border: thin solid #888; 794 padding: 1px; 795} 796 797.source_citations { 798 display: none; 799} 800 801.selected-option { 802 background-color: #cef; 803} 804 805.border1 { 806 border: solid #000 1px; 807} 808 809.journal_box { 810 padding: 3pt; 811 border: thin solid #aaa; 812 overflow: visible; 813} 814 815.news_box { 816 border-top: solid #ccc 1px; 817} 818 819.news_title { 820 color: #000; 821 font-weight: bold; 822} 823 824.news_date { 825 color: #000; 826 margin-bottom: 12px; 827} 828 829.current_day { 830 font-weight: bold; 831 font-size: 16px; 832} 833 834.cal_day { 835 float: left; 836 font-weight: bold; 837} 838 839#user-page h1 { 840 margin: 0.25em auto 0.6em; 841} 842 843.tvertline { 844 vertical-align: bottom; 845} 846 847#childbox { 848 padding: 5px; 849 position: absolute; 850 display: none; 851 text-align: start; 852 white-space: nowrap; 853 top: 20px; 854 left: 0; 855} 856 857.layout3 #childbox { 858 top: auto; 859 bottom: 20px; 860} 861 862#childbox a.name1 { 863 display: block; 864 margin-left: 5px; 865} 866 867.person0 { 868 background-color: #ddf; 869 border: outset #999 1px; 870 vertical-align: top; 871} 872 873.person1 { 874 background-color: #afa; 875 border: outset #afa 1px; 876 vertical-align: top; 877} 878 879.person2 { 880 background-color: #faa; 881 border: outset #faa 1px; 882 vertical-align: top; 883} 884 885.person3 { 886 background-color: #aad; 887 border: outset #55f 1px; 888 vertical-align: top; 889} 890 891.person4 { 892 background-color: #f55; 893 border: outset #f55 1px; 894 vertical-align: top; 895} 896 897.person5 { 898 background-color: #5f5; 899 border: outset #5f5 1px; 900 vertical-align: top; 901} 902 903.starredname { 904 text-decoration: underline; 905} 906 907.search_hit { 908 background-color: #ff0; 909} 910 911.descriptionbox { 912 font-size: 12px; 913 border: 1px solid #ccc; 914 vertical-align: top; 915 padding: 3px; 916} 917 918.optionbox { 919 font-size: 1rem; 920 background-color: #ecf5ff; 921 color: #006; 922 border: solid #ccc 1px; 923 vertical-align: top; 924 white-space: nowrap; 925 padding: 3px; 926} 927 928.red { 929 color: #f00; 930} 931 932.wt-relation-fact, 933.wt-historic-fact { 934 opacity: 0.8; 935} 936 937.messagebox { 938 background-color: #c2ceef; 939 border: solid #ccc 1px; 940} 941 942/* ---Pending edits--- */ 943.wt-new { 944 outline: solid blue 1px; 945} 946 947.wt-old { 948 outline: solid red 1px; 949} 950 951.tag_cloud { 952 text-align: center; 953} 954 955.tag_cloud a { 956 white-space: nowrap; 957} 958 959.nowrap { 960 white-space: nowrap; 961} 962 963.wrap { 964 white-space: normal; 965} 966 967.statistics-page { 968 text-align: center; 969} 970 971.gchart { 972 border: solid #999 1px; 973} 974 975#facts_content dd { 976 float: left; 977 width: 70%; 978} 979 980/* this keeps the tag color the same when it is a link as when not */ 981 982.place { 983 padding-top: 5px; 984} 985 986.filtersH, 987.filtersF { 988 margin: 4px; 989} 990 991.filtersH img { 992 margin-bottom: 2px; 993} 994 995.list-charts { 996 text-align: center; 997} 998 999#place-hierarchy h2, 1000#place-hierarchy h4 { 1001 text-align: center; 1002} 1003 1004.user_welcome_block table, 1005.gedcom_block_block table { 1006 margin: auto; 1007} 1008 1009.user_welcome_block td, 1010.gedcom_block_block td { 1011 width: 33%; 1012 text-align: center; 1013 vertical-align: top; 1014} 1015 1016/* ==== FAQ table styles ===== */ 1017table.faq { 1018 background-color: #eee; 1019 margin: 5px 0 50px 5px; 1020 width: 98%; 1021} 1022 1023table.faq tr:nth-child(odd) td { 1024 background-color: #eee; 1025} 1026 1027div.faq_title { 1028 background-color: #eee; 1029 margin: 1em 0; 1030 padding: .25em; 1031 font-weight: bold; 1032 width: 98%; 1033} 1034 1035div.faq_body { 1036 clear: both; 1037 padding: 0 1em; 1038} 1039 1040.faq_top { 1041 float: right; 1042} 1043 1044/* === Positioning edit, copy, delete links === */ 1045/* General use */ 1046.editfacts { 1047 clear: left; 1048 padding-top: 15px; 1049} 1050 1051#indi_note { 1052 margin: 0 0 5px; 1053} 1054 1055.indi_table { 1056 clear: left; 1057} 1058 1059#sex { 1060 float: right; 1061} 1062 1063#dates { 1064 color: #333; 1065 float: right; 1066} 1067 1068#individual-names .wt-icon-edit, 1069#individual-names .wt-icon-delete { 1070 float: right; 1071} 1072 1073#indi_note .fact_NOTE { 1074 float: left; 1075 margin: 0 5px 0 0; 1076} 1077 1078#indi_note .fact_SOUR { 1079 margin: 3px 0; 1080} 1081 1082#indi_note .fact_SOUR a { 1083 font-size: 100%; 1084} 1085 1086#indi_note .fact_NOTE, 1087#indi_note .fact_SOUR { 1088 clear: both; 1089} 1090 1091/* markdown formatting */ 1092 1093.markdown { 1094 /* Tables and pre-formatted text can break the layout. */ 1095 overflow-x: auto; 1096} 1097 1098.markdown p { 1099 margin: 0 0 0.5em; 1100 white-space: pre-wrap; 1101} 1102 1103.markdown table { 1104 border-collapse: collapse; 1105 margin-bottom: 5px; 1106} 1107 1108.markdown th { 1109 font-weight: bold; 1110} 1111 1112.markdown td, 1113.markdown th { 1114 border: solid thin #000; 1115 padding: 3px; 1116} 1117 1118.odometer { 1119 font-family: courier, monospace; 1120 font-weight: bold; 1121 background: #000; 1122 color: #fff; 1123} 1124 1125/* ======== Indi tabs ======== */ 1126.media-display-image { 1127 float: left; 1128} 1129 1130.media-display-title { 1131 float: left; 1132 font-style: italic; 1133 margin: 10px; 1134} 1135 1136.upcoming_events_block button, 1137.todays_events_block button { 1138 margin: 0 20px; 1139} 1140 1141/* Sidebar - Family navigator */ 1142.wt-family-navigator-dropdown-heading { 1143 font-weight: bold; 1144 font-size: inherit; 1145 color: inherit; 1146} 1147 1148/* Sidebar - Descendants */ 1149#sb_content_descendancy { 1150 margin-top: 0; 1151} 1152 1153#sb_desc_content { 1154 margin-left: 3px; 1155 font-size: 0.8em; 1156} 1157 1158#sb_desc_content ul { 1159 padding: 0; 1160 margin: 0; 1161} 1162 1163.sb_desc_indi_li { 1164 list-style-type: none; 1165 margin-left: 5px; 1166} 1167 1168/* Individuals and Families */ 1169#sidebar-content-individuals, 1170#sidebar-content-families { 1171 margin-top: 0; 1172} 1173 1174.sb_indi_surname_li, 1175.sb_fam_surname_li { 1176 list-style-image: url(icons/plus.png); 1177} 1178 1179.name_tree_div ul { 1180 padding: 0; 1181 margin: 0; 1182} 1183 1184.name_tree_div li { 1185 list-style: none; 1186 margin: 0; 1187 padding: 0; 1188} 1189 1190/* Clippings */ 1191#sb_clippings_content ul { 1192 padding: 0; 1193 margin: 0; 1194} 1195 1196#sb_clippings_content li { 1197 list-style: none; 1198 margin: 0; 1199 padding: 0; 1200 white-space: nowrap; 1201} 1202 1203/* Extra info */ 1204#sb_content_extra_info { 1205 font-size: 80%; 1206 font-weight: bold; 1207 margin-top: 0; 1208 overflow: hidden; 1209 padding: 5px; 1210} 1211 1212#sb_content_extra_info .editfacts { 1213 float: right; 1214 margin-top: -30px; 1215} 1216 1217#sb_content_extra_info a { 1218 display: block; 1219} 1220 1221#sb_content_extra_info span { 1222 font-weight: normal; 1223} 1224 1225#sb_content_extra_info span a { 1226 display: inline; 1227} 1228 1229#sb_content_extra_info #hitcounter { 1230 border-top: 1px solid #bcd; 1231 font-weight: bold; 1232 padding-top: 5px; 1233} 1234 1235/* Stories module */ 1236.story_title { 1237 padding-top: 12px; 1238 font-size: 13px; 1239 height: 32px; 1240 font-weight: bold; 1241} 1242 1243.story_body { 1244 padding: 20px; 1245 white-space: normal; 1246} 1247 1248.story_edit { 1249 padding: 12px; 1250} 1251 1252/*-- Fan chart ---- */ 1253.fan_chart_menu { 1254 background: #fff; 1255 position: absolute; 1256 display: none; 1257 z-index: 100; 1258} 1259 1260#fan_chart ul { 1261 list-style-type: none; 1262 margin: 0; 1263} 1264 1265/* Lifespans chart */ 1266.wt-lifespans-subtitle { 1267 text-align: center; 1268} 1269 1270.wt-lifespans-scale { 1271 white-space: nowrap; 1272} 1273 1274.wt-lifespans-decade { 1275 width: 70px; 1276 height: 60px; 1277 display: inline-block; 1278 background-image: url(images/lifespan-decade.png); 1279 background-position-y: bottom; 1280 background-repeat: no-repeat; 1281 background-size: 70px 37px; 1282} 1283 1284.wt-lifespans-individuals { 1285 background: #fafafa; 1286} 1287 1288.wt-lifespans-individual { 1289 1290} 1291 1292.wt-lifespans-summary { 1293 background: #ffffff; 1294 border: thin solid #000; 1295 z-index: 1; 1296} 1297 1298.wt-lifespans-summary-link { 1299 font-weight: bold; 1300} 1301 1302/*-- timeline --*/ 1303#timeline_chart { 1304 position: relative; 1305 top: 0; 1306 left: 0; 1307} 1308 1309[class^="icon-"], 1310[class*=" icon-"] { 1311 display: inline-block; 1312 vertical-align: middle; 1313 background-repeat: no-repeat; 1314 background-size: cover; 1315} 1316 1317.icon-cfamily { 1318 content: url(clouds/images/cfamily.png); 1319} 1320 1321.icon-childless { 1322 content: url(images/childless.png); 1323} 1324 1325.icon-children { 1326 content: url(images/children.png); 1327} 1328 1329.icon-edit_indi { 1330 content: url(clouds/images/edit_indi.png); 1331} 1332 1333.icon-fam-list { 1334 content: url(clouds/images/sfamily.png); 1335} 1336 1337.icon-indi-list { 1338 content: url(clouds/images/indis.png); 1339} 1340 1341.icon-loading-small { 1342 content: url(images/indicator.gif); 1343} 1344 1345.icon-minus { 1346 content: url(icons/minus.png); 1347} 1348 1349.icon-mypage { 1350 content: url(clouds/images/mypage.png); 1351} 1352 1353.icon-plus { 1354 content: url(icons/plus.png); 1355} 1356 1357.icon-resn-confidential { 1358 content: url(images/resn_confidential.png); 1359} 1360 1361.icon-resn-locked { 1362 content: url(images/resn_locked.png); 1363} 1364 1365.icon-resn-none { 1366 content: url(images/resn_none.png); 1367} 1368 1369.icon-resn-privacy { 1370 content: url(images/resn_privacy.png); 1371} 1372 1373.icon-rings { 1374 content: url(images/rings.png); 1375} 1376 1377.icon-selected { 1378 content: url(clouds/images/selected.png); 1379} 1380 1381/* Silhouettes on charts */ 1382.icon-silhouette-F { 1383 content: url(clouds/images/silhouette_female_small.png); 1384} 1385 1386.icon-silhouette-M { 1387 content: url(clouds/images/silhouette_male_small.png); 1388} 1389 1390.icon-silhouette-U { 1391 content: url(clouds/images/silhouette_unknown_small.png); 1392} 1393 1394/* Tbl hdrs and Light Text */ 1395.descriptionbox, 1396.topbottombar, 1397.topbottombar a, 1398.list_label, 1399.list_label a { 1400 background-color: #95b8e0; 1401 color: #039; 1402} 1403 1404/* Base Color */ 1405.blockcontent, 1406.list_value, 1407.list_value_wrap, 1408.news_box { 1409 background: inherit; 1410} 1411 1412footer .error { 1413 color: #d00; 1414 font-weight: bold; 1415} 1416 1417.user_links { 1418 white-space: nowrap; 1419} 1420 1421/* 1422 * Any element that is loaded dynamically has the class wt-ajax-load. 1423 * We can provide a "loading" placeholder for empty elements with this class. 1424 */ 1425.wt-ajax-load:empty { 1426 height: 32px; 1427 background: url(images/loading-32x32.gif) no-repeat 50% 50%; 1428} 1429 1430/* 1431 * Default icons are provided by FontAwesome. 1432 */ 1433.wt-icon-anniversary { 1434 content: url(icons/anniversary.png); 1435} 1436 1437.wt-icon-arrow-down { 1438 content: url(clouds/icons/arrow-down.png); 1439} 1440 1441a > .wt-icon-arrow-down:hover { 1442 content: url(clouds/icons/arrow-down-hover.png); 1443} 1444 1445.wt-icon-arrow-left { 1446 content: url(clouds/icons/arrow-left.png); 1447} 1448 1449a > .wt-icon-arrow-left:hover { 1450 content: url(clouds/icons/arrow-left-hover.png); 1451} 1452 1453.wt-icon-arrow-right { 1454 content: url(clouds/icons/arrow-right.png); 1455} 1456 1457a > .wt-icon-arrow-right:hover { 1458 content: url(clouds/icons/arrow-right-hover.png); 1459} 1460 1461.wt-icon-arrow-up { 1462 content: url(clouds/icons/arrow-up.png); 1463} 1464 1465a > .wt-icon-arrow-up:hover { 1466 content: url(clouds/icons/arrow-up-hover.png); 1467} 1468 1469.wt-icon-bing-maps { 1470 content: url(icons/bing-maps.png); 1471} 1472 1473.wt-icon-calendar { 1474 content: url(icons/calendar.png) 1475} 1476 1477.wt-icon-collapse { 1478} 1479 1480.wt-icon-coordinates { 1481 content: url(icons/coordinates.png) 1482} 1483 1484.wt-icon-copy { 1485 content: url(icons/copy.png) 1486} 1487 1488.wt-icon-delete { 1489 content: url(icons/delete.png); 1490} 1491 1492.wt-icon-edit { 1493 content: url(icons/edit.png); 1494} 1495 1496.wt-icon-expand { 1497} 1498 1499.wt-icon-family { 1500 content: url(icons/family.png); 1501} 1502 1503.wt-icon-google-maps { 1504 content: url(icons/google-maps.png); 1505} 1506 1507.wt-icon-help { 1508 content: url(clouds/icons/help.png); 1509} 1510 1511.wt-icon-individual { 1512 content: url(icons/individual.png); 1513} 1514 1515.wt-icon-keyboard { 1516 content: url(icons/keyboard.png); 1517} 1518 1519.wt-icon-media { 1520 content: url(icons/media.png); 1521} 1522 1523.wt-icon-note { 1524 content: url(icons/note.png); 1525} 1526 1527.wt-icon-openstreetmap { 1528 content: url(icons/openstreetmap.png); 1529} 1530 1531.wt-icon-preferences { 1532 content: url(clouds/icons/preferences.png); 1533} 1534 1535.wt-icon-reorder { 1536 content: url(icons/reorder.png); 1537} 1538 1539.wt-icon-repository { 1540 content: url(icons/repository.png); 1541} 1542 1543.wt-icon-sex-f { 1544 content: url(icons/sex-female.png); 1545} 1546 1547.wt-icon-sex-m { 1548 content: url(icons/sex-male.png); 1549} 1550 1551.wt-icon-sex-u { 1552 content: url(icons/sex-unknown.png); 1553} 1554 1555.wt-icon-sex-x { 1556 content: url(icons/sex-unknown.png); 1557} 1558 1559.wt-icon-source { 1560 content: url(icons/source.png); 1561} 1562 1563.wt-icon-submitter { 1564 content: url(icons/individual.png); 1565} 1566 1567.wt-icon-warning { 1568 content: url(icons/warning.png); 1569} 1570 1571.wt-icon-zoom-in { 1572 content: url(clouds/icons/zoom-in.png); 1573} 1574 1575.wt-icon-zoom-out { 1576 content: url(clouds/icons/zoom-out.png); 1577} 1578 1579/* Miscellaneous images */ 1580.icon-indis { 1581 content: url(clouds/images/indis.png); 1582} 1583 1584.icon-patriarch { 1585 content: url(clouds/images/patriarch.png); 1586} 1587 1588.icon-pedigree { 1589 content: url(clouds/images/pedigree.png); 1590} 1591 1592.icon-sfamily { 1593 content: url(clouds/images/sfamily.png); 1594} 1595 1596.icon-user_add { 1597 content: url(clouds/images/user_add.png); 1598} 1599 1600/* Census assistant */ 1601.wt-census-assistant-form-control:focus { 1602 min-width: 12rem; 1603} 1604 1605/* 1606 * Drag and drop sortable lists 1607 */ 1608.wt-sortable-list { 1609} 1610 1611.wt-sortable-item { 1612 cursor: move; 1613} 1614 1615/* Some blocks show a reduced version on the right-hand side. */ 1616.wt-side-blocks .wt-side-block-optional { 1617 display: none !important; 1618} 1619 1620/* my page chart enhancements */ 1621.wt-block-content-charts { 1622 overflow: auto; 1623} 1624 1625/* Some charts are wider than the page. */ 1626.wt-chart { 1627 overflow-x: auto; 1628 overflow-y: hidden; 1629} 1630 1631/* Fit thumbnail into parent on charts */ 1632.select2-selection.select2-selection--single { 1633 min-height: 36px; 1634 height: auto; 1635 padding: 2px 0; 1636} 1637 1638.select2-container .select2-selection--single .select2-selection__rendered { 1639 padding-left: 2px; 1640} 1641 1642.select2-selection--single .NAME { 1643 padding-left: 4px; 1644} 1645 1646/* 1647 * Place hierarchy 1648 * 1649 * wt-place-hierarchy-page 1650 */ 1651 1652#place-hierarchy ul { 1653 list-style-type: none; 1654} 1655 1656.d-table-cell { 1657 padding-right: 5px; 1658} 1659 1660/* Some menus (e.g. languages) can be longer than a page */ 1661.dropdown-menu { 1662 max-height: 30rem; 1663 overflow-x: hidden; 1664} 1665 1666/* Forms */ 1667.col-form-label { 1668 font-weight: bold; 1669} 1670