1/* css/aside.css */ 2.aside-button { 3 z-index: var(--z-index-floating-ui); 4 display: none; 5 background-color: var(--color-sidebar-background); 6} 7.aside-button:hover { 8 background-color: var(--color-sidebar-background); 9} 10aside { 11 position: fixed; 12 top: var(--header-height); 13 bottom: 0; 14 left: 0; 15 z-index: var(--z-index-aside); 16 width: var(--aside-width); 17 padding-top: 0.5rem; 18 margin: 0; 19 overflow-y: auto; 20 color: var(--color-sidebar-text); 21 background-color: var(--color-sidebar-background); 22 border-right: 1px solid var(--color-sidebar-border); 23} 24aside .navigation { 25 padding-bottom: 0.5rem; 26 margin-bottom: 0.5rem; 27 border-bottom: 1px solid var(--color-sidebar-border); 28} 29aside .navigation:last-child { 30 margin-bottom: 0; 31 border: none; 32} 33aside .navigation a { 34 display: block; 35 padding: 0.25em 0.5em 0.25em 1em; 36 color: inherit; 37} 38aside .navigation a.selected, 39aside .navigation a:hover { 40 color: var(--color-sidebar-text-hover); 41 background-color: var(--color-sidebar-border); 42} 43aside .navigation .secondary { 44 padding: 4px 9px 2px 9px; 45 line-height: 23px; 46 color: inherit; 47 background-color: var(--color-sidebar-background); 48} 49aside .navigation .add-transaction-button { 50 font-size: 23px; 51} 52aside .navigation li { 53 position: relative; 54 display: flex; 55 flex-wrap: wrap; 56} 57aside .navigation li a:first-child { 58 flex: 1; 59} 60aside .navigation .error { 61 background-color: var(--color-error); 62} 63aside .navigation li.error a { 64 color: var(--color-sidebar-background); 65} 66aside .navigation .submenu li a { 67 padding-left: 35px; 68} 69aside .navigation .submenu { 70 width: 100%; 71 margin: 0; 72} 73aside .navigation .submenu li { 74 font-size: 0.95em; 75 line-height: 0.95em; 76} 77aside .navigation .submenu a.selected, 78aside .navigation .submenu a:hover { 79 filter: brightness(85%); 80} 81aside .navigation .error a.selected, 82aside .navigation .error a:hover { 83 background-color: var(--color-error); 84 filter: brightness(80%); 85} 86aside .navigation .bubble { 87 float: right; 88 padding: 0 8px; 89 font-size: 0.9em; 90 color: var(--color-sidebar-text); 91 background-color: var(--color-sidebar-border); 92 border-radius: 12px; 93} 94aside .navigation .error .bubble { 95 background-color: var(--color-transparent-white); 96} 97 98/* css/base.css */ 99* { 100 box-sizing: border-box; 101} 102html, 103body { 104 margin: 0; 105 font-family: var(--font-family); 106 font-size: 14px; 107 font-weight: 400; 108 line-height: 1.5; 109 color: var(--color-text); 110 background-color: var(--color-background); 111} 112p, 113ol, 114ul, 115dl, 116table, 117pre, 118hr { 119 padding: 0; 120 margin: 0 0 1rem; 121 list-style-type: none; 122} 123dl { 124 margin: 0; 125} 126code, 127pre { 128 font-family: var(--font-family-monospaced); 129 white-space: pre; 130 background-color: var(--color-code-background); 131 border: 1px solid var(--color-background-darker); 132 border-radius: 3px; 133} 134code { 135 padding: 0 4px; 136 line-height: 1; 137} 138pre { 139 padding: 6px 10px; 140 overflow: auto; 141} 142pre code { 143 padding: 0; 144 margin: 0; 145 line-height: inherit; 146 border: 0; 147} 148.pre { 149 white-space: pre-wrap; 150} 151table { 152 border-spacing: 0; 153 border-collapse: collapse; 154} 155td, 156th { 157 padding: 2px 5px; 158 white-space: nowrap; 159} 160td.num, 161th.num { 162 width: 7em; 163 font-family: var(--font-family-monospaced); 164 color: var(--color-text); 165 text-align: right; 166} 167thead th, 168tfoot td { 169 font-weight: 400; 170 color: var(--color-table-header-text); 171 background-color: var(--color-table-header-background); 172 border: 1px solid var(--color-table-header-background); 173} 174tbody tr:nth-child(2n) { 175 background-color: var(--color-sidebar-background); 176} 177tbody td { 178 border: 1px solid var(--color-table-border); 179} 180table pre { 181 padding: 0; 182 margin: 0; 183 overflow: inherit; 184 background-color: inherit; 185 border: 0; 186} 187h2, 188h3 { 189 padding: 0; 190 margin: 0 0.5rem 1rem 0; 191 font-weight: 500; 192 color: var(--color-headings); 193} 194h2 { 195 font-size: 1.2857em; 196} 197h3 { 198 font-size: 1.1429em; 199} 200h4, 201h5 { 202 font-size: 1em; 203} 204hr { 205 border: 1px solid var(--color-background-darker); 206} 207b, 208strong { 209 font-weight: 500; 210} 211a { 212 text-decoration: none; 213} 214a:hover, 215a:focus { 216 color: var(--color-links-hover); 217} 218a:link, 219a:visited { 220 color: var(--color-links); 221} 222a:active, 223a:focus, 224a img { 225 border: 0; 226 outline: none; 227} 228.fieldset { 229 display: flex; 230 flex-wrap: wrap; 231 align-items: center; 232} 233button, 234input, 235textarea { 236 font: inherit; 237 color: var(--color-text); 238} 239input, 240textarea { 241 padding: 6px 10px; 242 border: 1px solid var(--color-background-darkest); 243} 244label { 245 cursor: pointer; 246} 247select { 248 font-size: inherit; 249} 250input:invalid { 251 border: 1px solid var(--color-error); 252 outline: none; 253 box-shadow: none; 254} 255input[type=text]::-webkit-calendar-picker-indicator { 256 display: none; 257} 258input[type=date]::-webkit-inner-spin-button, 259input[type=date]::-webkit-clear-button { 260 -webkit-appearance: none; 261 display: none; 262} 263input[type=text]::placeholder { 264 color: var(--color-placeholder); 265 opacity: 1; 266} 267input[type=text]::placeholder:focus { 268 color: var(--color-placeholder); 269} 270input[type=text]:placeholder-shown { 271 background-color: var(--background-placeholder); 272} 273button, 274.button { 275 padding: 6px 10px; 276 color: var(--color-background); 277 cursor: pointer; 278 background-color: var(--color-header); 279 border: 0; 280 border-radius: 0; 281 outline: 0; 282} 283h3 .button, 284h3 button { 285 padding: 4px 8px; 286 font-size: 1rem; 287 font-weight: normal; 288} 289a.button { 290 display: inline-block; 291 padding: 2px 6px; 292} 293button:focus, 294button:active, 295button:hover, 296.button:focus, 297.button:active, 298.button:hover { 299 background-color: var(--color-header-darker); 300 box-shadow: 0 0 5px var(--color-header); 301} 302button:disabled, 303button.inactive, 304button.muted, 305.button:disabled, 306.button.inactive, 307.button.muted { 308 color: var(--color-text); 309 background-color: var(--color-background-darker); 310} 311button:disabled:focus, 312button:disabled:active, 313button:disabled:hover, 314button.inactive:focus, 315button.inactive:active, 316button.inactive:hover, 317button.muted:focus, 318button.muted:active, 319button.muted:hover, 320.button:disabled:focus, 321.button:disabled:active, 322.button:disabled:hover, 323.button.inactive:focus, 324.button.inactive:active, 325.button.inactive:hover, 326.button.muted:focus, 327.button.muted:active, 328.button.muted:hover { 329 filter: brightness(90%); 330 box-shadow: 0 0 5px var(--color-background-darker); 331} 332button.link, 333.button.link { 334 padding: 0; 335 color: var(--color-links); 336 background: none; 337} 338button.link:focus, 339button.link:active, 340button.link:hover, 341.button.link:focus, 342.button.link:active, 343.button.link:hover { 344 filter: brightness(90%); 345 box-shadow: none; 346} 347button.round, 348.button.round { 349 height: 1.5em; 350 padding: 0 0.5em; 351 border-radius: 15px; 352} 353.button:link, 354.button:visited { 355 height: 100%; 356 color: var(--color-background); 357} 358.hidden.hidden { 359 display: none; 360} 361:root { 362 --transitions: all 0.2s ease-out; 363} 364.dragover { 365 background-color: var(--color-links-transparent); 366} 367.headerline { 368 display: flex; 369 flex-wrap: wrap; 370 align-items: center; 371 margin: 0 0 1em; 372} 373.headerline h3 { 374 display: inline-block; 375 margin: 0 1.5em 0 0; 376} 377.headerline a { 378 color: var(--color-text-lighter); 379} 380.headerline a:hover { 381 color: var(--color-text); 382} 383kbd { 384 display: inline-block; 385 padding: 3px 6px; 386 margin: 0 1px; 387 font: 0.8em var(--font-family-monospaced); 388 color: var(--color-text-lighter); 389 background-color: var(--color-background); 390 border: solid 1px var(--color-background-darker); 391 border-bottom-color: var(--color-background-darkest); 392 border-radius: 3px; 393 box-shadow: inset 0 -1px 0 var(--color-background-darkest); 394} 395.keyboard-tooltip { 396 position: absolute; 397 z-index: var(--z-index-keyboard-overlays); 398 display: inline-block; 399 padding: 0.3em 0.5em; 400 font-size: 0.9em; 401 color: var(--color-background); 402 text-align: center; 403 background-color: var(--color-text); 404 opacity: 0.9; 405} 406.spacer { 407 flex-grow: 1; 408} 409.row { 410 display: flex; 411 flex-wrap: wrap; 412 padding: 5px; 413 margin: -10px -20px; 414} 415.column { 416 flex: 1; 417 margin: 5px; 418} 419.column h3 { 420 text-align: center; 421} 422.left { 423 float: left; 424 margin-right: 20px; 425} 426.right { 427 float: right; 428} 429.status-indicator { 430 display: inline-block; 431 width: 6px; 432 height: 6px; 433 margin: 5px; 434 border-radius: 6px; 435} 436td .status-indicator { 437 float: right; 438 margin-top: 3px; 439 margin-left: 3px; 440} 441.status-indicator:hover { 442 cursor: pointer; 443} 444.status-indicator.status-red { 445 background-color: var(--color-status-red); 446} 447.status-indicator.status-yellow { 448 background-color: var(--color-status-yellow); 449} 450.status-indicator.status-green { 451 background-color: var(--color-status-green); 452} 453.status-indicator.status-gray { 454 background-color: var(--color-status-gray); 455} 456.statistics-update-activity .indicator-header { 457 padding-left: 0; 458} 459.statistics-update-activity .uptodate-indicator { 460 text-align: center; 461} 462.statistics-update-activity .status-indicator { 463 margin: 0 auto; 464} 465[data-sort] { 466 position: relative; 467 padding-right: 18px; 468 cursor: pointer; 469} 470[data-order=desc]::after { 471 position: absolute; 472 top: 12px; 473 right: 4px; 474 display: block; 475 content: ""; 476 border-top: 5px solid var(--color-text-lightest); 477 border-right: 5px solid transparent; 478 border-left: 5px solid transparent; 479} 480[data-order=asc]::after { 481 position: absolute; 482 top: 10px; 483 right: 4px; 484 display: block; 485 content: ""; 486 border-right: 5px solid transparent; 487 border-bottom: 5px solid var(--color-text-lightest); 488 border-left: 5px solid transparent; 489} 490.options td { 491 text-align: left; 492} 493.options td:nth-child(1) { 494 font-weight: 500; 495} 496.options td:nth-child(2) { 497 white-space: normal; 498} 499 500/* css/charts.css */ 501.chart-mode span { 502 margin-right: 0; 503 color: var(--color-text); 504 background-color: var(--color-background-darker); 505} 506.chart-mode input { 507 display: none; 508} 509.chart-mode span:hover { 510 color: var(--color-background); 511} 512.chart-mode input:checked + span { 513 color: var(--color-background); 514 background-color: var(--color-header); 515} 516.toggle-chart { 517 height: 22px; 518 padding: 2px 6px; 519 margin: 0; 520} 521.toggle-chart::before { 522 display: block; 523 content: ""; 524 border: 0; 525 border-top: 13px solid var(--color-background); 526 border-right: 9px solid transparent; 527 border-left: 9px solid transparent; 528} 529.toggle-chart.closed::before { 530 border: 0; 531 border-right: 9px solid transparent; 532 border-bottom: 13px solid var(--color-background); 533 border-left: 9px solid transparent; 534} 535svg text { 536 font-family: var(--font-family); 537 fill: var(--color-text-lightest); 538} 539svg .axis path, 540svg .axis line { 541 fill: none; 542 stroke: var(--color-chart-axis); 543 shape-rendering: crispEdges; 544} 545svg .axis.y line { 546 opacity: 0.2; 547 stroke: var(--color-chart-axis); 548} 549svg .axis.y path.domain { 550 opacity: 0.2; 551} 552.tooltip { 553 position: absolute; 554 z-index: var(--z-index-floating-ui); 555 min-width: 5em; 556 padding: 0.5em; 557 font-family: var(--font-family-monospaced); 558 text-align: center; 559 pointer-events: none; 560 background: var(--color-background); 561 border: 1px solid var(--color-background-darkest); 562 box-shadow: 0 0 5px var(--color-background-darker); 563 opacity: 0; 564 transform: translate(-50%, -100%); 565} 566.tooltip::before { 567 position: absolute; 568 top: 100%; 569 left: 50%; 570 width: 0; 571 height: 0; 572 margin-left: -15px; 573 content: ""; 574 border: 15px solid transparent; 575 border-top-color: var(--color-background-darkest); 576} 577.tooltip em { 578 display: block; 579 margin-top: 5px; 580 font-family: var(--font-family); 581 color: var(--color-text-lightest); 582} 583 584/* css/components.css */ 585details { 586 display: block; 587 min-width: 400px; 588 margin-bottom: 0.5em; 589 border: 1px solid var(--color-table-border); 590} 591details.inactive { 592 opacity: 0.5; 593} 594details summary { 595 display: flex; 596 align-items: center; 597 padding: 5px 10px; 598 cursor: pointer; 599 background-color: var(--color-sidebar-background); 600} 601details summary::before { 602 margin-right: 0.5em; 603 content: ""; 604 border-top: 9px solid var(--color-treetable-expander); 605 border-right: 6px solid transparent; 606 border-left: 6px solid transparent; 607 transform: rotate(270deg); 608} 609details.error summary { 610 background-color: var(--color-error); 611} 612details[open] summary::before { 613 transform: rotate(0deg); 614} 615details summary pre { 616 display: inline-block; 617 padding: 3px 6px; 618 margin: 0; 619} 620details > div { 621 padding: 0.5em; 622} 623 624/* css/editor.css */ 625:root { 626 --source-editor-fieldset-height: 44px; 627} 628.CodeMirror-gutters { 629 background: var(--color-sidebar-background); 630 border-right: 1px solid var(--color-sidebar-border); 631} 632.CodeMirror.CodeMirror { 633 z-index: var(--z-index-editor); 634 margin-bottom: 1em; 635 font: 13px var(--font-family-editor); 636 border: 1px solid var(--color-sidebar-border); 637} 638.cm-trailingspace { 639 background-color: var(--color-editor-trailing-whitespace); 640} 641.cm-section { 642 padding-right: 10px; 643 font-weight: 500; 644 color: var(--color-editor-comment); 645 border: solid 1px var(--color-editor-comment); 646 border-radius: 2px; 647} 648.cm-comment { 649 color: var(--color-editor-comment); 650} 651.cm-date { 652 color: var(--color-editor-date); 653} 654.cm-directive { 655 font-weight: 500; 656 color: var(--color-editor-directive); 657} 658.cm-option { 659 color: var(--color-editor-class); 660} 661.cm-account { 662 color: var(--color-editor-account); 663} 664.cm-invalid { 665 color: var(--color-editor-invalid); 666} 667.CodeMirror-hint { 668 max-width: 600px; 669} 670.CodeMirror-hint .highlight { 671 font-weight: 500; 672} 673.CodeMirror.CodeMirror .CodeMirror-placeholder { 674 color: var(--color-placeholder); 675} 676 677/* css/fonts.css */ 678@font-face { 679 font-family: "Source Code Pro"; 680 font-style: normal; 681 font-weight: normal; 682 src: url(source-code-pro-all-400.NSGJWPWG.woff2) format("woff2"); 683} 684@font-face { 685 font-family: "Source Code Pro"; 686 font-style: normal; 687 font-weight: 500; 688 src: url(source-code-pro-all-500.47GDKC4X.woff2) format("woff2"); 689} 690@font-face { 691 font-family: "Fira Mono"; 692 font-style: normal; 693 font-weight: normal; 694 src: url(fira-mono-all-400.NNZLAY6Z.woff2) format("woff2"); 695} 696@font-face { 697 font-family: "Fira Mono"; 698 font-style: normal; 699 font-weight: 500; 700 src: url(fira-mono-all-500.SGH75UQO.woff2) format("woff2"); 701} 702@font-face { 703 font-family: "Fira Sans"; 704 font-style: normal; 705 font-weight: normal; 706 src: url(fira-sans-all-400.OVDLVQZQ.woff2) format("woff2"); 707} 708@font-face { 709 font-family: "Fira Sans"; 710 font-style: normal; 711 font-weight: 500; 712 src: url(fira-sans-all-500.55FOB3DB.woff2) format("woff2"); 713} 714@font-face { 715 font-family: "Source Serif Pro"; 716 font-style: normal; 717 font-weight: normal; 718 src: url(source-serif-pro-latin-400.GY4IQBMR.woff2) format("woff2"); 719} 720@font-face { 721 font-family: "Source Serif Pro"; 722 font-style: normal; 723 font-weight: 600; 724 src: url(source-serif-pro-latin-600.JFCF4SRY.woff2) format("woff2"); 725} 726 727/* css/grid.css */ 728.flex-row { 729 display: flex; 730 flex-wrap: wrap; 731 align-items: center; 732 margin: 0 -0.25rem; 733} 734.flex-row > * { 735 margin: 0.25rem; 736} 737.flex-row > label { 738 display: contents; 739} 740.flex-row > label > * { 741 margin: 0.25rem; 742} 743.flex-row .grow { 744 flex-grow: 1; 745} 746.remove-row { 747 opacity: 0; 748} 749.flex-row:hover .remove-row { 750 opacity: 1; 751} 752 753/* css/header.css */ 754@keyframes spinner { 755 to { 756 transform: rotate(360deg); 757 } 758} 759.fava-icon.loading { 760 padding: 0; 761 border-top: 2px solid var(--color-header-text); 762 border-radius: 50%; 763 animation: spinner 1s linear infinite; 764} 765.fava-icon.loading path { 766 opacity: 0; 767} 768.beancount-files ul { 769 max-height: 400px; 770 margin-bottom: 0; 771 overflow-y: auto; 772} 773.beancount-files a { 774 display: block; 775 padding: 8px 12px 8px 28px; 776 cursor: pointer; 777} 778.beancount-files a.active, 779.beancount-files a:hover { 780 color: var(--color-background); 781 background-color: var(--color-links); 782} 783.beancount-files a.active { 784 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAMAAABFNRROAAAAOVBMVEUAAAD///////////////////////////////////////////////////////////////////////8KOjVvAAAAEnRSTlMAAQMGHjE8P0Bfi6Omt9Hi7/XCzsNoAAAAO0lEQVQI143HSxZAMBAAwQ5CfEPf/7AWHmZH7Qr+aMcmZHONcQa6PV9ZEnBofsKg1jtQ9A2UGOinxKcT2psCetpsGdwAAAAASUVORK5CYII=); 785 background-repeat: no-repeat; 786 background-position: 9px center; 787} 788h1 { 789 display: block; 790 flex: 1; 791 max-height: var(--header-height); 792 padding: calc((var(--header-height) - 24px) / 2) 10px; 793 margin: 0; 794 overflow: hidden; 795 font-size: 16px; 796 font-weight: normal; 797 color: var(--color-header-text); 798} 799h1 .droptarget { 800 padding: 0.6em; 801 margin-left: -0.6em; 802} 803h1 a:hover, 804h1 a:link, 805h1 a:visited { 806 color: inherit; 807} 808h1 .last-activity { 809 display: inline-block; 810 margin-left: 10px; 811 font-size: 12px; 812 font-weight: normal; 813 opacity: 0.8; 814} 815h1 .status-indicator { 816 width: 10px; 817 height: 10px; 818 margin: 0 0 0 10px; 819 border-radius: 10px; 820} 821h1 .status-indicator.status-gray { 822 margin-left: 0; 823} 824.page-title::before { 825 margin: 0 10px; 826 font-weight: normal; 827 color: var(--color-header-text-half); 828 content: "\203a"; 829} 830.reload-page { 831 padding-right: 12px; 832 padding-left: 12px; 833 margin-top: -8px; 834 margin-left: 20px; 835 background-color: var(--color-warning); 836} 837.beancount-files { 838 position: absolute; 839 top: var(--header-height); 840 left: 19px; 841 display: none; 842 width: 20em; 843 color: var(--color-links); 844 background-color: var(--color-background); 845 border: 1px solid var(--color-background-darker); 846 border-bottom-right-radius: 3px; 847 border-bottom-left-radius: 3px; 848 box-shadow: 0 3px 6px var(--color-transparent-black); 849} 850h1:hover .beancount-files { 851 display: block; 852} 853 854/* css/help.css */ 855:root { 856 --color-help-sidebar: #f8f8f8; 857 --color-help-sidebar-border: #eaeaea; 858 --help-max-width: 600px; 859} 860.help { 861 max-width: calc(var(--help-max-width) + 160px); 862} 863.help-text { 864 max-width: var(--help-max-width); 865 font: 16px var(--font-family-alternative); 866} 867.help-text h2, 868.help-text h3, 869.help-text h4, 870.help-text h5 { 871 font-family: var(--font-family); 872} 873.help-text > div { 874 margin-bottom: 1em; 875} 876.help-text .CodeMirror { 877 height: auto; 878 padding: 0; 879 margin: 0; 880 background-color: var(--color-code-background); 881 border: 0; 882} 883.help-text code { 884 font-size: 0.9em; 885} 886.help-text ul { 887 padding-left: 2em; 888} 889.help-text li { 890 list-style-type: disc; 891} 892.help-sidebar { 893 float: right; 894 padding: 10px 10px 0; 895 margin: 0 0 10px 10px; 896 font-size: 1.1em; 897 background-color: var(--color-help-sidebar); 898 border: 1px solid var(--color-help-sidebar-border); 899} 900.help-sidebar a:hover, 901.help-sidebar a.selected { 902 font-weight: 500; 903} 904 905/* css/journal-table.css */ 906.entry-filters { 907 justify-content: flex-end; 908} 909.journal { 910 margin-top: 0.25rem; 911} 912.flex-table p, 913.flex-table li, 914.flex-table ul, 915.flex-table ol { 916 padding: 0; 917 margin: 0; 918} 919.flex-table p { 920 display: flex; 921} 922.flex-table p > span { 923 flex-shrink: 0; 924 padding: 2px 4px; 925 margin: 0; 926} 927.flex-table .num { 928 font-family: var(--font-family-monospaced); 929 color: var(--color-text); 930 text-align: right; 931} 932.flex-table .number { 933 white-space: nowrap; 934} 935.flex-table .head p > span { 936 padding: 3px 4px; 937 color: var(--color-table-header-text); 938 background-color: var(--color-table-header-background); 939} 940.flex-table .head .num { 941 font-family: var(--font-family); 942 color: var(--color-table-header-text); 943 background-color: var(--color-table-header-background); 944} 945.flex-table .totals p > span { 946 color: var(--color-table-header-text); 947 background-color: var(--color-table-header-background); 948} 949.journal p, 950.journal dl { 951 border-bottom: thin solid var(--color-table-border); 952} 953.journal .payee { 954 cursor: pointer; 955} 956.journal .postings { 957 font-size: 0.9em; 958 background-color: var(--color-journal-postings); 959 opacity: 0.8; 960} 961.journal .postings .num { 962 overflow: hidden; 963 line-height: 16px; 964} 965.journal > li, 966.journal.show-custom .custom.budget, 967.journal.show-document .document.discovered, 968.journal.show-document .document.linked, 969.journal .metadata, 970.journal .postings { 971 display: none; 972} 973.journal .head, 974.journal.show-balance .balance, 975.journal.show-close .close, 976.journal.show-custom .custom, 977.journal.show-document .document, 978.journal.show-note .note, 979.journal.show-open .open, 980.journal.show-pad .pad, 981.journal.show-query .query, 982.journal.show-metadata .metadata, 983.journal.show-postings .postings, 984.transaction.show-postings .postings, 985.transaction.show-postings .metadata { 986 display: block; 987} 988.journal.show-transaction.show-cleared .transaction.cleared, 989.journal.show-transaction.show-pending .transaction.pending, 990.journal.show-transaction.show-other .transaction.other, 991.journal.show-document.show-discovered .document.discovered, 992.journal.show-document.show-linked .document.linked, 993.journal.show-custom.show-budget .custom.budget { 994 display: block; 995} 996.journal .transaction:hover { 997 background: var(--color-journal-hover-highlight); 998} 999.journal .metadata { 1000 padding: 2px 0; 1001 margin: 0; 1002 font-size: 0.9em; 1003} 1004.journal .metadata dt { 1005 display: inline-block; 1006 float: left; 1007 width: auto; 1008 min-width: 4rem; 1009 margin-left: 9rem; 1010 color: var(--color-journal-metadata); 1011 cursor: pointer; 1012} 1013.journal .metadata dd { 1014 margin-left: 15rem; 1015 cursor: pointer; 1016} 1017.journal p > .num { 1018 width: 9rem; 1019 border-left: 1px solid var(--color-table-border); 1020} 1021.journal .datecell, 1022.journal .flag { 1023 text-align: center; 1024 background-color: var(--entry-type-color); 1025} 1026.journal .datecell { 1027 width: 5.5rem; 1028 white-space: nowrap; 1029} 1030.journal .flag { 1031 width: 3rem; 1032} 1033.journal .change { 1034 font-weight: 500; 1035} 1036.journal .description { 1037 display: flex; 1038 flex: 1; 1039 align-items: center; 1040 padding-left: 8px; 1041} 1042.journal .description .separator { 1043 width: 4px; 1044 height: 4px; 1045 padding: 2px; 1046 margin: 0 6px; 1047 background-color: var(--color-text-lighter); 1048} 1049.journal .description .account-link { 1050 margin-right: 0.5em; 1051} 1052.journal .description .num { 1053 margin: 0 5px; 1054} 1055.journal .tag, 1056.journal .link { 1057 margin-left: 8px; 1058 font-size: 0.9em; 1059 cursor: pointer; 1060} 1061.journal .tag { 1062 color: var(--color-journal-tag); 1063} 1064.journal .link { 1065 color: var(--color-journal-link); 1066} 1067.journal .bal { 1068 background-color: var(--entry-type-color); 1069} 1070.journal a:hover { 1071 filter: brightness(80%); 1072} 1073.journal .filename, 1074.journal .url { 1075 font-family: var(--font-family-monospaced); 1076 font-size: 0.9em; 1077} 1078.journal .document .filename { 1079 margin-left: 1em; 1080} 1081.journal .indicators { 1082 display: flex; 1083 flex-shrink: 3; 1084 flex-wrap: wrap; 1085 align-items: center; 1086 justify-content: flex-end; 1087 cursor: pointer; 1088} 1089.journal .indicators span { 1090 min-width: 6px; 1091 height: 6px; 1092 padding: 0; 1093 margin-right: 4px; 1094 background-color: var(--color-journal-posting-indicator); 1095 border-radius: 3px; 1096} 1097.journal .indicators .pending, 1098.journal .indicators .other { 1099 background-color: var(--entry-type-color); 1100} 1101.journal .indicators .metadata-indicator { 1102 height: 16px; 1103 padding: 0 6px; 1104 font-size: 10px; 1105 line-height: 16px; 1106 color: var(--color-journal-metadata-indicator); 1107 text-transform: lowercase; 1108 border-radius: 20px; 1109} 1110 1111/* css/layout.css */ 1112:root { 1113 --header-height: 50px; 1114 --aside-width: 160px; 1115} 1116body { 1117 padding: var(--header-height) 0 0 var(--aside-width); 1118} 1119header { 1120 position: fixed; 1121 top: 0; 1122 left: 0; 1123 z-index: var(--z-index-header); 1124 display: flex; 1125 align-items: center; 1126 width: 100%; 1127 height: var(--header-height); 1128 padding: 0 7px 0 10px; 1129 color: var(--color-header-text); 1130 background-color: var(--color-header); 1131} 1132article { 1133 position: relative; 1134 width: 100%; 1135 height: 100%; 1136 padding: 1.5em; 1137} 1138.fixed-fullsize-container { 1139 position: fixed; 1140 top: var(--header-height); 1141 right: 0; 1142 bottom: 0; 1143 left: var(--aside-width); 1144} 1145@media (max-width: 767px) { 1146 .fixed-fullsize-container { 1147 left: 0; 1148 } 1149} 1150 1151/* css/media-mobile.css */ 1152@media (max-width: 767px) { 1153 body { 1154 padding: 0; 1155 transition: var(--transitions); 1156 } 1157 header { 1158 position: inherit; 1159 flex-wrap: wrap; 1160 height: auto; 1161 padding-left: 46px; 1162 } 1163 h1 { 1164 padding: 8px; 1165 } 1166 aside { 1167 top: 0; 1168 margin-left: calc(-1 * var(--aside-width)); 1169 transition: var(--transitions); 1170 } 1171 aside.active { 1172 margin-left: 0; 1173 } 1174 .aside-button.aside-button { 1175 transition: var(--transitions); 1176 } 1177 .navigation .secondary { 1178 transition: var(--transitions); 1179 } 1180 .aside-button, 1181 .navigation .add-transaction-button { 1182 position: fixed; 1183 left: 0; 1184 width: 42px; 1185 height: 42px; 1186 padding: 6px 4px; 1187 text-align: center; 1188 border-color: var(--color-sidebar-border); 1189 border-style: solid; 1190 border-width: 0 1px 1px 0; 1191 } 1192 .navigation .add-transaction-button { 1193 top: 42px; 1194 font-size: 30px; 1195 color: var(--color-mobile-button-text); 1196 } 1197 aside.active .add-transaction-button { 1198 left: var(--aside-width); 1199 } 1200 .aside-button { 1201 top: 0; 1202 display: block; 1203 margin-left: 0; 1204 } 1205 .aside-button.active { 1206 left: var(--aside-width); 1207 background-color: var(--color-sidebar-background); 1208 box-shadow: none; 1209 } 1210} 1211 1212/* css/media-print.css */ 1213@media print { 1214 body { 1215 padding: 0; 1216 } 1217 header { 1218 position: relative; 1219 } 1220 header > * { 1221 display: none; 1222 } 1223 header h1 { 1224 display: block; 1225 } 1226 aside, 1227 .aside-button, 1228 .toggle-chart-container { 1229 display: none; 1230 } 1231} 1232 1233/* css/notifications.css */ 1234.notifications { 1235 position: fixed; 1236 top: calc(var(--header-height) + 10px); 1237 right: 10px; 1238 width: 400px; 1239} 1240.notifications li { 1241 display: block; 1242 width: 100%; 1243 padding: 5px 10px; 1244 margin-bottom: 0.5em; 1245 color: var(--color-notification); 1246 cursor: pointer; 1247 background-color: var(--color-notification-info); 1248} 1249.notifications .error { 1250 background-color: var(--color-notification-error); 1251} 1252.notifications .warning { 1253 color: var(--color-text); 1254 background-color: var(--color-notification-warning); 1255} 1256 1257/* css/style.css */ 1258:root { 1259 --font-family: "Fira Sans", sans-serif; 1260 --font-family-alternative: "Source Serif Pro", sans-serif; 1261 --font-family-monospaced: "Fira Mono", monospace; 1262 --font-family-editor: "Source Code Pro", monospace; 1263 --z-index-editor: 0; 1264 --z-index-aside: 1; 1265 --z-index-header: 2; 1266 --z-index-floating-ui: 3; 1267 --z-index-keyboard-overlays: 10; 1268 --z-index-autocomplete: 8; 1269 --z-index-overlay: 4; 1270 --color-transparent-black: hsla(0, 0%, 0%, 0.5); 1271 --color-transparent-white: hsla(0, 0%, 100%, 0.5); 1272 --color-background: #fff; 1273 --color-background-darker: #d9d9d9; 1274 --color-background-darkest: #ccc; 1275 --color-text: hsl(0, 0%, 27%); 1276 --color-text-lighter: hsl(0, 0%, 33%); 1277 --color-text-lightest: hsl(0, 0%, 47%); 1278 --color-links: hsl(203, 100%, 32%); 1279 --color-links-hover: hsl(203, 100%, 22%); 1280 --color-links-transparent: hsla(203, 100%, 32%, 0.5); 1281 --color-headings: #333; 1282 --color-error: hsl(0, 100%, 30%); 1283 --color-warning: hsl(52, 84%, 56%); 1284 --color-code-background: #f8f8f8; 1285 --color-sidebar-text: #444; 1286 --color-sidebar-text-hover: var(--color-links); 1287 --color-sidebar-background: hsl(0, 0%, 96%); 1288 --color-sidebar-border: hsl(0, 0%, 87%); 1289 --color-autocomplete-match: #ffd27c; 1290 --color-header: hsl(203, 100%, 32%); 1291 --color-header-darker: hsl(203, 100%, 22%); 1292 --color-header-light: hsl(203, 56%, 45%); 1293 --color-header-tinted: hsl(203, 47%, 66%); 1294 --color-header-text: hsl(0, 0%, 100%); 1295 --color-header-text-half: hsla(0, 0%, 100%, 0.5); 1296 --color-status-red: var(--color-error); 1297 --color-status-yellow: var(--color-warning); 1298 --color-status-green: hsl(151, 100%, 25%); 1299 --color-status-gray: #aaa; 1300 --color-notification: #fff; 1301 --color-notification-info: hsl(151, 100%, 25%); 1302 --color-notification-error: hsl(0, 100%, 30%); 1303 --color-notification-warning: hsl(52, 84%, 56%); 1304 --color-table-header-text: #666; 1305 --color-table-header-background: #e6e6e6; 1306 --color-table-border: #f2f2f2; 1307 --color-treetable-expander: #afc1d3; 1308 --color-budget-negative: #af3d3d; 1309 --color-budget-positive: #3daf46; 1310 --color-budget-zero: #ffb900; 1311 --color-treemap-text: #fff; 1312 --color-chart-axis: #999; 1313 --color-editor-comment: #998; 1314 --color-editor-trailing-whitespace: rgba(255, 199, 199, 0.5); 1315 --color-editor-directive: #333; 1316 --color-editor-class: #b84; 1317 --color-editor-date: #099; 1318 --color-editor-constant: #008080; 1319 --color-editor-account: var(--color-links); 1320 --color-editor-invalid: #333; 1321 --color-editor-activeline: #ffc; 1322 --color-mobile-button-text: #000; 1323 --color-ingest: #cefac1; 1324 --color-placeholder: var(--color-text-lightest); 1325 --background-placeholder: var(--color-background); 1326 --overlay-wrapper-background: rgba(0, 0, 0, 0.5); 1327} 1328.journal .balance { 1329 --entry-type-color: #cfc; 1330} 1331.journal .close { 1332 --entry-type-color: hsl(0, 0%, 70%); 1333} 1334.journal .custom { 1335 --entry-type-color: #fff3ab; 1336} 1337.journal .document { 1338 --entry-type-color: #ffc8ff; 1339} 1340.journal .note { 1341 --entry-type-color: #aad0ff; 1342} 1343.journal .open { 1344 --entry-type-color: hsl(0, 0%, 92%); 1345} 1346.journal .other { 1347 --entry-type-color: #cff; 1348} 1349.journal .pad { 1350 --entry-type-color: #8ff; 1351} 1352.journal .pending { 1353 --entry-type-color: #f8a; 1354} 1355.journal .query { 1356 --entry-type-color: #aad0ff; 1357} 1358.journal .budget { 1359 --entry-type-color: #ffddae; 1360} 1361.journal { 1362 --color-journal-postings: hsl(0, 0%, 92%); 1363 --color-journal-metadata: hsl(210, 44%, 67%); 1364 --color-journal-tag: hsl(210, 61%, 64%); 1365 --color-journal-link: hsl(203, 39%, 85%); 1366 --color-journal-posting-indicator: hsl(203, 24%, 80%); 1367 --color-journal-metadata-indicator: hsl(203, 24%, 40%); 1368 --color-journal-hover-highlight: #f5f5f59c; 1369} 1370 1371/* css/tree-table.css */ 1372.tree-table.fullwidth { 1373 display: block; 1374 max-width: 100%; 1375 overflow-x: auto; 1376} 1377.tree-table p { 1378 margin-top: -1px; 1379} 1380.tree-table p > span { 1381 margin-right: -1px; 1382 border: 1px solid var(--color-table-header-background); 1383} 1384.tree-table .account-cell { 1385 display: flex; 1386 flex: 1; 1387 align-items: center; 1388 min-width: 14em; 1389 max-width: 30em; 1390} 1391.tree-table .account-cell.depth-1 { 1392 min-width: 13em; 1393 max-width: 29em; 1394 margin-left: 1em; 1395} 1396.tree-table .account-cell.depth-2 { 1397 min-width: 12em; 1398 max-width: 28em; 1399 margin-left: 2em; 1400} 1401.tree-table .account-cell.depth-3 { 1402 min-width: 11em; 1403 max-width: 27em; 1404 margin-left: 3em; 1405} 1406.tree-table .account-cell.depth-4 { 1407 min-width: 10em; 1408 max-width: 26em; 1409 margin-left: 4em; 1410} 1411.tree-table .account-cell.depth-5 { 1412 min-width: 9em; 1413 max-width: 25em; 1414 margin-left: 5em; 1415} 1416.tree-table .account-cell.depth-6 { 1417 min-width: 8em; 1418 max-width: 24em; 1419 margin-left: 6em; 1420} 1421.tree-table .account-cell.depth-7 { 1422 min-width: 7em; 1423 max-width: 23em; 1424 margin-left: 7em; 1425} 1426.tree-table .account-cell.depth-8 { 1427 min-width: 6em; 1428 max-width: 22em; 1429 margin-left: 8em; 1430} 1431.tree-table .account-cell.depth-9 { 1432 min-width: 5em; 1433 max-width: 21em; 1434 margin-left: 9em; 1435} 1436.tree-table .account-cell a { 1437 margin-left: 1em; 1438} 1439.tree-table .has-children { 1440 cursor: pointer; 1441} 1442.tree-table .has-children::before { 1443 margin: 0 -10px 0 0; 1444 content: ""; 1445 border-top: 5px solid var(--color-treetable-expander); 1446 border-right: 5px solid transparent; 1447 border-left: 5px solid transparent; 1448} 1449.tree-table .num { 1450 width: 10em; 1451} 1452.tree-table .num a { 1453 display: block; 1454 color: inherit; 1455} 1456.tree-table .other { 1457 width: 13em; 1458} 1459.tree-table .other a { 1460 display: block; 1461 color: inherit; 1462} 1463.tree-table .balance-children { 1464 display: block; 1465 opacity: 0.7; 1466} 1467.tree-table .has-balance .balance { 1468 display: block; 1469} 1470.tree-table .has-balance .balance-children { 1471 display: none; 1472} 1473.tree-table .toggled ol { 1474 display: none; 1475} 1476.tree-table .toggled .balance { 1477 display: none; 1478} 1479.tree-table .toggled .balance-children { 1480 display: block; 1481 color: var(--color-text); 1482} 1483.tree-table .toggled .has-children::before { 1484 transform: rotate(270deg); 1485} 1486.tree-table .expand-all { 1487 margin-left: 15px; 1488 font-weight: normal; 1489 color: inherit; 1490 opacity: 0.5; 1491} 1492.tree-table .diff { 1493 margin-right: 3px; 1494 font-size: 0.9em; 1495 color: var(--color-budget-zero); 1496 white-space: nowrap; 1497} 1498.tree-table .diff.negative { 1499 color: var(--color-budget-negative); 1500} 1501.tree-table .diff.positive { 1502 color: var(--color-budget-positive); 1503} 1504.two-currencies { 1505 font-size: 0.9em; 1506} 1507.two-currencies .num { 1508 width: 8em; 1509} 1510.two-currencies .other { 1511 width: 11em; 1512} 1513 1514/* node_modules/codemirror/addon/dialog/dialog.css */ 1515.CodeMirror-dialog { 1516 position: absolute; 1517 left: 0; 1518 right: 0; 1519 background: inherit; 1520 z-index: 15; 1521 padding: .1em .8em; 1522 overflow: hidden; 1523 color: inherit; 1524} 1525.CodeMirror-dialog-top { 1526 border-bottom: 1px solid #eee; 1527 top: 0; 1528} 1529.CodeMirror-dialog-bottom { 1530 border-top: 1px solid #eee; 1531 bottom: 0; 1532} 1533.CodeMirror-dialog input { 1534 border: none; 1535 outline: none; 1536 background: transparent; 1537 width: 20em; 1538 color: inherit; 1539 font-family: monospace; 1540} 1541.CodeMirror-dialog button { 1542 font-size: 70%; 1543} 1544 1545/* node_modules/codemirror/addon/fold/foldgutter.css */ 1546.CodeMirror-foldmarker { 1547 color: blue; 1548 text-shadow: #b9f 1px 1px 2px, #b9f -1px -1px 2px, #b9f 1px -1px 2px, #b9f -1px 1px 2px; 1549 font-family: arial; 1550 line-height: .3; 1551 cursor: pointer; 1552} 1553.CodeMirror-foldgutter { 1554 width: .7em; 1555} 1556.CodeMirror-foldgutter-open, 1557.CodeMirror-foldgutter-folded { 1558 cursor: pointer; 1559} 1560.CodeMirror-foldgutter-open:after { 1561 content: "\25be"; 1562} 1563.CodeMirror-foldgutter-folded:after { 1564 content: "\25b8"; 1565} 1566 1567/* node_modules/codemirror/addon/hint/show-hint.css */ 1568.CodeMirror-hints { 1569 position: absolute; 1570 z-index: 10; 1571 overflow: hidden; 1572 list-style: none; 1573 margin: 0; 1574 padding: 2px; 1575 -webkit-box-shadow: 2px 3px 5px rgba(0, 0, 0, .2); 1576 -moz-box-shadow: 2px 3px 5px rgba(0, 0, 0, .2); 1577 box-shadow: 2px 3px 5px rgba(0, 0, 0, .2); 1578 border-radius: 3px; 1579 border: 1px solid silver; 1580 background: white; 1581 font-size: 90%; 1582 font-family: monospace; 1583 max-height: 20em; 1584 overflow-y: auto; 1585} 1586.CodeMirror-hint { 1587 margin: 0; 1588 padding: 0 4px; 1589 border-radius: 2px; 1590 white-space: pre; 1591 color: black; 1592 cursor: pointer; 1593} 1594li.CodeMirror-hint-active { 1595 background: #08f; 1596 color: white; 1597} 1598 1599/* node_modules/codemirror/lib/codemirror.css */ 1600.CodeMirror { 1601 font-family: monospace; 1602 height: 300px; 1603 color: black; 1604 direction: ltr; 1605} 1606.CodeMirror-lines { 1607 padding: 4px 0; 1608} 1609.CodeMirror pre.CodeMirror-line, 1610.CodeMirror pre.CodeMirror-line-like { 1611 padding: 0 4px; 1612} 1613.CodeMirror-scrollbar-filler, 1614.CodeMirror-gutter-filler { 1615 background-color: transparent; 1616} 1617.CodeMirror-gutters { 1618 border-right: 1px solid #ddd; 1619 background-color: #f7f7f7; 1620 white-space: nowrap; 1621} 1622.CodeMirror-linenumbers { 1623} 1624.CodeMirror-linenumber { 1625 padding: 0 3px 0 5px; 1626 min-width: 20px; 1627 text-align: right; 1628 color: #999; 1629 white-space: nowrap; 1630} 1631.CodeMirror-guttermarker { 1632 color: black; 1633} 1634.CodeMirror-guttermarker-subtle { 1635 color: #999; 1636} 1637.CodeMirror-cursor { 1638 border-left: 1px solid black; 1639 border-right: none; 1640 width: 0; 1641} 1642.CodeMirror div.CodeMirror-secondarycursor { 1643 border-left: 1px solid silver; 1644} 1645.cm-fat-cursor .CodeMirror-cursor { 1646 width: auto; 1647 border: 0 !important; 1648 background: #7e7; 1649} 1650.cm-fat-cursor div.CodeMirror-cursors { 1651 z-index: 1; 1652} 1653.cm-fat-cursor-mark { 1654 background-color: rgba(20, 255, 20, 0.5); 1655 -webkit-animation: blink 1.06s steps(1) infinite; 1656 -moz-animation: blink 1.06s steps(1) infinite; 1657 animation: blink 1.06s steps(1) infinite; 1658} 1659.cm-animate-fat-cursor { 1660 width: auto; 1661 border: 0; 1662 -webkit-animation: blink 1.06s steps(1) infinite; 1663 -moz-animation: blink 1.06s steps(1) infinite; 1664 animation: blink 1.06s steps(1) infinite; 1665 background-color: #7e7; 1666} 1667@-moz-keyframes blink { 1668 0% { 1669 } 1670 50% { 1671 background-color: transparent; 1672 } 1673 100% { 1674 } 1675} 1676@-webkit-keyframes blink { 1677 0% { 1678 } 1679 50% { 1680 background-color: transparent; 1681 } 1682 100% { 1683 } 1684} 1685@keyframes blink { 1686 0% { 1687 } 1688 50% { 1689 background-color: transparent; 1690 } 1691 100% { 1692 } 1693} 1694.CodeMirror-overwrite .CodeMirror-cursor { 1695} 1696.cm-tab { 1697 display: inline-block; 1698 text-decoration: inherit; 1699} 1700.CodeMirror-rulers { 1701 position: absolute; 1702 left: 0; 1703 right: 0; 1704 top: -50px; 1705 bottom: 0; 1706 overflow: hidden; 1707} 1708.CodeMirror-ruler { 1709 border-left: 1px solid #ccc; 1710 top: 0; 1711 bottom: 0; 1712 position: absolute; 1713} 1714.cm-s-default .cm-header { 1715 color: blue; 1716} 1717.cm-s-default .cm-quote { 1718 color: #090; 1719} 1720.cm-negative { 1721 color: #d44; 1722} 1723.cm-positive { 1724 color: #292; 1725} 1726.cm-header, 1727.cm-strong { 1728 font-weight: bold; 1729} 1730.cm-em { 1731 font-style: italic; 1732} 1733.cm-link { 1734 text-decoration: underline; 1735} 1736.cm-strikethrough { 1737 text-decoration: line-through; 1738} 1739.cm-s-default .cm-keyword { 1740 color: #708; 1741} 1742.cm-s-default .cm-atom { 1743 color: #219; 1744} 1745.cm-s-default .cm-number { 1746 color: #164; 1747} 1748.cm-s-default .cm-def { 1749 color: #00f; 1750} 1751.cm-s-default .cm-variable, 1752.cm-s-default .cm-punctuation, 1753.cm-s-default .cm-property, 1754.cm-s-default .cm-operator { 1755} 1756.cm-s-default .cm-variable-2 { 1757 color: #05a; 1758} 1759.cm-s-default .cm-variable-3, 1760.cm-s-default .cm-type { 1761 color: #085; 1762} 1763.cm-s-default .cm-comment { 1764 color: #a50; 1765} 1766.cm-s-default .cm-string { 1767 color: #a11; 1768} 1769.cm-s-default .cm-string-2 { 1770 color: #f50; 1771} 1772.cm-s-default .cm-meta { 1773 color: #555; 1774} 1775.cm-s-default .cm-qualifier { 1776 color: #555; 1777} 1778.cm-s-default .cm-builtin { 1779 color: #30a; 1780} 1781.cm-s-default .cm-bracket { 1782 color: #997; 1783} 1784.cm-s-default .cm-tag { 1785 color: #170; 1786} 1787.cm-s-default .cm-attribute { 1788 color: #00c; 1789} 1790.cm-s-default .cm-hr { 1791 color: #999; 1792} 1793.cm-s-default .cm-link { 1794 color: #00c; 1795} 1796.cm-s-default .cm-error { 1797 color: #f00; 1798} 1799.cm-invalidchar { 1800 color: #f00; 1801} 1802.CodeMirror-composing { 1803 border-bottom: 2px solid; 1804} 1805div.CodeMirror span.CodeMirror-matchingbracket { 1806 color: #0b0; 1807} 1808div.CodeMirror span.CodeMirror-nonmatchingbracket { 1809 color: #a22; 1810} 1811.CodeMirror-matchingtag { 1812 background: rgba(255, 150, 0, .3); 1813} 1814.CodeMirror-activeline-background { 1815 background: #e8f2ff; 1816} 1817.CodeMirror { 1818 position: relative; 1819 overflow: hidden; 1820 background: white; 1821} 1822.CodeMirror-scroll { 1823 overflow: scroll !important; 1824 margin-bottom: -50px; 1825 margin-right: -50px; 1826 padding-bottom: 50px; 1827 height: 100%; 1828 outline: none; 1829 position: relative; 1830} 1831.CodeMirror-sizer { 1832 position: relative; 1833 border-right: 50px solid transparent; 1834} 1835.CodeMirror-vscrollbar, 1836.CodeMirror-hscrollbar, 1837.CodeMirror-scrollbar-filler, 1838.CodeMirror-gutter-filler { 1839 position: absolute; 1840 z-index: 6; 1841 display: none; 1842 outline: none; 1843} 1844.CodeMirror-vscrollbar { 1845 right: 0; 1846 top: 0; 1847 overflow-x: hidden; 1848 overflow-y: scroll; 1849} 1850.CodeMirror-hscrollbar { 1851 bottom: 0; 1852 left: 0; 1853 overflow-y: hidden; 1854 overflow-x: scroll; 1855} 1856.CodeMirror-scrollbar-filler { 1857 right: 0; 1858 bottom: 0; 1859} 1860.CodeMirror-gutter-filler { 1861 left: 0; 1862 bottom: 0; 1863} 1864.CodeMirror-gutters { 1865 position: absolute; 1866 left: 0; 1867 top: 0; 1868 min-height: 100%; 1869 z-index: 3; 1870} 1871.CodeMirror-gutter { 1872 white-space: normal; 1873 height: 100%; 1874 display: inline-block; 1875 vertical-align: top; 1876 margin-bottom: -50px; 1877} 1878.CodeMirror-gutter-wrapper { 1879 position: absolute; 1880 z-index: 4; 1881 background: none !important; 1882 border: none !important; 1883} 1884.CodeMirror-gutter-background { 1885 position: absolute; 1886 top: 0; 1887 bottom: 0; 1888 z-index: 4; 1889} 1890.CodeMirror-gutter-elt { 1891 position: absolute; 1892 cursor: default; 1893 z-index: 4; 1894} 1895.CodeMirror-gutter-wrapper ::selection { 1896 background-color: transparent; 1897} 1898.CodeMirror-gutter-wrapper ::-moz-selection { 1899 background-color: transparent; 1900} 1901.CodeMirror-lines { 1902 cursor: text; 1903 min-height: 1px; 1904} 1905.CodeMirror pre.CodeMirror-line, 1906.CodeMirror pre.CodeMirror-line-like { 1907 -moz-border-radius: 0; 1908 -webkit-border-radius: 0; 1909 border-radius: 0; 1910 border-width: 0; 1911 background: transparent; 1912 font-family: inherit; 1913 font-size: inherit; 1914 margin: 0; 1915 white-space: pre; 1916 word-wrap: normal; 1917 line-height: inherit; 1918 color: inherit; 1919 z-index: 2; 1920 position: relative; 1921 overflow: visible; 1922 -webkit-tap-highlight-color: transparent; 1923 -webkit-font-variant-ligatures: contextual; 1924 font-variant-ligatures: contextual; 1925} 1926.CodeMirror-wrap pre.CodeMirror-line, 1927.CodeMirror-wrap pre.CodeMirror-line-like { 1928 word-wrap: break-word; 1929 white-space: pre-wrap; 1930 word-break: normal; 1931} 1932.CodeMirror-linebackground { 1933 position: absolute; 1934 left: 0; 1935 right: 0; 1936 top: 0; 1937 bottom: 0; 1938 z-index: 0; 1939} 1940.CodeMirror-linewidget { 1941 position: relative; 1942 z-index: 2; 1943 padding: 0.1px; 1944} 1945.CodeMirror-widget { 1946} 1947.CodeMirror-rtl pre { 1948 direction: rtl; 1949} 1950.CodeMirror-code { 1951 outline: none; 1952} 1953.CodeMirror-scroll, 1954.CodeMirror-sizer, 1955.CodeMirror-gutter, 1956.CodeMirror-gutters, 1957.CodeMirror-linenumber { 1958 -moz-box-sizing: content-box; 1959 box-sizing: content-box; 1960} 1961.CodeMirror-measure { 1962 position: absolute; 1963 width: 100%; 1964 height: 0; 1965 overflow: hidden; 1966 visibility: hidden; 1967} 1968.CodeMirror-cursor { 1969 position: absolute; 1970 pointer-events: none; 1971} 1972.CodeMirror-measure pre { 1973 position: static; 1974} 1975div.CodeMirror-cursors { 1976 visibility: hidden; 1977 position: relative; 1978 z-index: 3; 1979} 1980div.CodeMirror-dragcursors { 1981 visibility: visible; 1982} 1983.CodeMirror-focused div.CodeMirror-cursors { 1984 visibility: visible; 1985} 1986.CodeMirror-selected { 1987 background: #d9d9d9; 1988} 1989.CodeMirror-focused .CodeMirror-selected { 1990 background: #d7d4f0; 1991} 1992.CodeMirror-crosshair { 1993 cursor: crosshair; 1994} 1995.CodeMirror-line::selection, 1996.CodeMirror-line > span::selection, 1997.CodeMirror-line > span > span::selection { 1998 background: #d7d4f0; 1999} 2000.CodeMirror-line::-moz-selection, 2001.CodeMirror-line > span::-moz-selection, 2002.CodeMirror-line > span > span::-moz-selection { 2003 background: #d7d4f0; 2004} 2005.cm-searching { 2006 background-color: #ffa; 2007 background-color: rgba(255, 255, 0, .4); 2008} 2009.cm-force-border { 2010 padding-right: .1px; 2011} 2012@media print { 2013 .CodeMirror div.CodeMirror-cursors { 2014 visibility: hidden; 2015 } 2016} 2017.cm-tab-wrap-hack:after { 2018 content: ""; 2019} 2020span.CodeMirror-selectedtext { 2021 background: none; 2022} 2023 2024/* src/charts/ChartSwitcher.svelte.css */ 2025div.svelte-zrq527.svelte-zrq527 { 2026 margin-bottom: 1.5em; 2027 font-size: 1em; 2028 color: var(--color-text-lightest); 2029 text-align: center; 2030} 2031span.svelte-zrq527.svelte-zrq527 { 2032 padding: 0 0.5em; 2033 cursor: pointer; 2034} 2035span.svelte-zrq527 + span.svelte-zrq527 { 2036 border-left: 1px solid var(--color-text-lighter); 2037} 2038span.selected.svelte-zrq527.svelte-zrq527, 2039span.svelte-zrq527.svelte-zrq527:hover { 2040 color: var(--color-text-lighter); 2041} 2042 2043/* src/documents/Documents.svelte.css */ 2044.fixed-fullsize-container.svelte-11pwv1r { 2045 display: grid; 2046 grid-template-columns: 1fr 2fr 3fr; 2047} 2048.fixed-fullsize-container.svelte-11pwv1r > * { 2049 height: 100%; 2050 overflow: auto; 2051 resize: horizontal; 2052} 2053.fixed-fullsize-container.svelte-11pwv1r > * + * { 2054 border-left: thin solid var(--color-sidebar-border); 2055} 2056 2057/* src/editor/SourceEditor.svelte.css */ 2058form.svelte-9k35va { 2059 background: var(--color-sidebar-background); 2060} 2061div.svelte-9k35va { 2062 position: fixed; 2063 top: calc(var(--header-height) + var(--source-editor-fieldset-height)); 2064 bottom: 0; 2065 width: 100%; 2066} 2067div.svelte-9k35va .CodeMirror-lines { 2068 border-top: 1px solid var(--color-sidebar-border); 2069} 2070div.svelte-9k35va .CodeMirror { 2071 width: 100%; 2072 height: 100%; 2073 margin: 0; 2074 border: 0; 2075} 2076 2077/* src/header/FilterForm.svelte.css */ 2078form.svelte-1m3xpwc { 2079 display: flex; 2080 flex-wrap: wrap; 2081 padding-top: 7px; 2082 margin: 0; 2083 color: var(--color-text); 2084 --color-placeholder: var(--color-header-tinted); 2085 --background-placeholder: var(--color-header-light); 2086} 2087form.svelte-1m3xpwc > span { 2088 max-width: 18rem; 2089 margin: 0 4px 6px 0; 2090} 2091form.svelte-1m3xpwc input { 2092 padding: 8px 25px 8px 10px; 2093 background-color: var(--color-background); 2094 border: 0; 2095 outline: none; 2096} 2097form.svelte-1m3xpwc [type=text]:focus { 2098 background-color: var(--color-background); 2099} 2100[type=submit].svelte-1m3xpwc { 2101 display: none; 2102} 2103@media print { 2104 form.svelte-1m3xpwc { 2105 display: none; 2106 } 2107} 2108 2109/* src/import/Import.svelte.css */ 2110.header.svelte-1a2aigf.svelte-1a2aigf { 2111 padding: 0.5rem; 2112 margin: 0.5rem 0; 2113 cursor: pointer; 2114 background-color: var(--color-table-header-background); 2115} 2116.header.svelte-1a2aigf button.svelte-1a2aigf { 2117 float: right; 2118} 2119.fixed-fullsize-container.svelte-1a2aigf.svelte-1a2aigf { 2120 display: flex; 2121 align-items: stretch; 2122} 2123.fixed-fullsize-container.svelte-1a2aigf > .svelte-1a2aigf { 2124 flex: 1 1 40%; 2125 overflow: auto; 2126} 2127.filelist.svelte-1a2aigf.svelte-1a2aigf { 2128 padding: 1rem; 2129} 2130 2131/* src/query/Query.svelte.css */ 2132details.svelte-yulyqv > div.svelte-yulyqv { 2133 max-height: 80vh; 2134 overflow: auto; 2135} 2136div.svelte-yulyqv .query-error { 2137 font-family: var(--font-family-monospaced); 2138 color: var(--color-background); 2139 background: var(--color-error); 2140} 2141 2142/* src/documents/Accounts.svelte.css */ 2143ul.svelte-15y6nay { 2144 padding: 0 0 0 0.5em; 2145} 2146p.svelte-15y6nay { 2147 margin-bottom: -1px; 2148 overflow: hidden; 2149 cursor: pointer; 2150 border: 1px solid var(--color-table-border); 2151} 2152.selected.svelte-15y6nay, 2153.drag.svelte-15y6nay { 2154 background-color: var(--color-table-header-background); 2155} 2156 2157/* src/documents/DocumentPreview.svelte.css */ 2158object.svelte-1lgci0p { 2159 width: 100%; 2160 height: 100%; 2161} 2162 2163/* src/documents/Table.svelte.css */ 2164table.svelte-1gus9z9 { 2165 width: 100%; 2166} 2167tr.svelte-1gus9z9 { 2168 cursor: pointer; 2169} 2170.selected.svelte-1gus9z9, 2171tr.svelte-1gus9z9:hover { 2172 background-color: var(--color-table-header-background); 2173} 2174 2175/* src/editor/EditorMenu.svelte.css */ 2176li.svelte-1hul25p.svelte-1hul25p.svelte-1hul25p.svelte-1hul25p { 2177 cursor: pointer; 2178} 2179.fieldset.svelte-1hul25p.svelte-1hul25p.svelte-1hul25p.svelte-1hul25p { 2180 height: var(--source-editor-fieldset-height); 2181 padding-left: 0.5em; 2182 border-bottom: 1px solid var(--color-sidebar-border); 2183} 2184.dropdown.svelte-1hul25p.svelte-1hul25p.svelte-1hul25p.svelte-1hul25p { 2185 display: flex; 2186 height: 100%; 2187 margin: 0; 2188} 2189.dropdown.svelte-1hul25p .selected.svelte-1hul25p.svelte-1hul25p.svelte-1hul25p::before { 2190 content: "\203a"; 2191} 2192.dropdown.svelte-1hul25p > li.svelte-1hul25p.svelte-1hul25p.svelte-1hul25p { 2193 position: relative; 2194 height: var(--source-editor-fieldset-height); 2195 margin-right: 10px; 2196 line-height: var(--source-editor-fieldset-height); 2197 cursor: default; 2198} 2199.dropdown.svelte-1hul25p > li.svelte-1hul25p > ul.svelte-1hul25p.svelte-1hul25p { 2200 position: absolute; 2201 top: var(--source-editor-fieldset-height); 2202 z-index: var(--z-index-floating-ui); 2203 display: none; 2204 width: 500px; 2205 max-height: 400px; 2206 margin-left: -10px; 2207 overflow-y: auto; 2208 line-height: 1.5; 2209 background-color: var(--color-background); 2210 border: 1px solid var(--color-background-darker); 2211 border-bottom-right-radius: 3px; 2212 border-bottom-left-radius: 3px; 2213 box-shadow: 0 3px 6px var(--color-transparent-black); 2214} 2215.dropdown.svelte-1hul25p > li.svelte-1hul25p > ul.svelte-1hul25p > li.svelte-1hul25p { 2216 padding: 2px 10px; 2217} 2218.dropdown.svelte-1hul25p > li > ul > li span.svelte-1hul25p.svelte-1hul25p.svelte-1hul25p { 2219 float: right; 2220} 2221.dropdown.svelte-1hul25p li.svelte-1hul25p:hover > ul.svelte-1hul25p.svelte-1hul25p { 2222 display: block; 2223} 2224 2225/* src/import/Extract.svelte.css */ 2226pre.svelte-kordbm { 2227 font-size: 0.9em; 2228 white-space: pre-wrap; 2229} 2230.duplicate.svelte-kordbm { 2231 opacity: 0.5; 2232} 2233 2234/* src/modals/ModalBase.svelte.css */ 2235.background.svelte-x1kse4 { 2236 position: fixed; 2237 width: 100%; 2238 height: 100%; 2239 cursor: pointer; 2240 background: var(--overlay-wrapper-background); 2241} 2242.overlay.svelte-x1kse4 { 2243 position: fixed; 2244 top: 0; 2245 right: 0; 2246 bottom: 0; 2247 left: 0; 2248 z-index: var(--z-index-overlay); 2249 display: none; 2250} 2251.overlay.shown.svelte-x1kse4 { 2252 display: flex; 2253 align-items: center; 2254 justify-content: center; 2255} 2256.close.svelte-x1kse4 { 2257 position: absolute; 2258 top: 1em; 2259 right: 1em; 2260 margin: 0; 2261 color: var(--color-text-lighter); 2262} 2263.content.svelte-x1kse4 { 2264 position: relative; 2265 display: flex; 2266 width: 100%; 2267 max-width: 767px; 2268 max-height: 100%; 2269 padding: 1em; 2270 margin: 0.5em; 2271 background: var(--color-background); 2272 box-shadow: 0 0 20px var(--overlay-wrapper-background); 2273} 2274.content.svelte-x1kse4 form, 2275.content.svelte-x1kse4 > div { 2276 width: 100%; 2277} 2278 2279/* src/query/QueryEditor.svelte.css */ 2280form.svelte-1xc24s1 { 2281 display: flex; 2282 align-items: center; 2283 padding-bottom: 1em; 2284} 2285button.svelte-1xc24s1 { 2286 margin: 0; 2287} 2288form.svelte-1xc24s1 .CodeMirror { 2289 flex-grow: 1; 2290 width: 100%; 2291 height: auto; 2292 margin: 0; 2293 margin-right: 0.5em; 2294 font-family: var(--font-family-editor); 2295 font-size: 16px; 2296 border: 1px solid var(--color-background-darker); 2297} 2298 2299/* src/query/QueryLinks.svelte.css */ 2300span.svelte-1j4mih2 { 2301 color: var(--color-text-lighter); 2302} 2303 2304/* src/AutocompleteInput.svelte.css */ 2305span.svelte-11ahi2m { 2306 position: relative; 2307 display: inline-block; 2308} 2309input.svelte-11ahi2m { 2310 width: 100%; 2311} 2312ul.svelte-11ahi2m { 2313 position: fixed; 2314 z-index: var(--z-index-autocomplete); 2315 overflow-x: hidden; 2316 overflow-y: auto; 2317 background-color: var(--color-background); 2318 border: 1px solid var(--color-background-darkest); 2319 box-shadow: 0 3px 3px var(--color-background-darker); 2320} 2321li.svelte-11ahi2m { 2322 min-width: 8rem; 2323 padding: 0 0.5em; 2324 white-space: nowrap; 2325 cursor: pointer; 2326} 2327li.selected.svelte-11ahi2m, 2328li.svelte-11ahi2m:hover { 2329 color: var(--color-background); 2330 background-color: var(--color-links); 2331} 2332button.svelte-11ahi2m { 2333 position: absolute; 2334 top: 8px; 2335 right: 4px; 2336 background: transparent; 2337} 2338li.svelte-11ahi2m span { 2339 height: 1.2em; 2340 padding: 0 0.05em; 2341 margin: 0 -0.05em; 2342 background-color: var(--color-autocomplete-match); 2343 border-radius: 2px; 2344} 2345 2346/* src/charts/BarChart.svelte.css */ 2347.axis-group-box.svelte-1es9imu.svelte-1es9imu { 2348 cursor: pointer; 2349 opacity: 0; 2350} 2351.group-box.svelte-1es9imu.svelte-1es9imu { 2352 opacity: 0; 2353} 2354.group.svelte-1es9imu:hover .group-box.svelte-1es9imu { 2355 opacity: 0.1; 2356} 2357.budget.svelte-1es9imu.svelte-1es9imu { 2358 opacity: 0.3; 2359} 2360 2361/* src/charts/ChartLegend.svelte.css */ 2362span.svelte-1unp29f, 2363i.svelte-1unp29f { 2364 display: inline-block; 2365} 2366i.svelte-1unp29f { 2367 width: 10px; 2368 height: 10px; 2369 margin-left: 5px; 2370 border-radius: 10px; 2371} 2372 2373/* src/charts/LineChart.svelte.css */ 2374svg.svelte-1f3fe4k > g.svelte-1f3fe4k { 2375 pointer-events: all; 2376} 2377.lines.svelte-1f3fe4k path.svelte-1f3fe4k { 2378 fill: none; 2379 stroke-width: 2px; 2380} 2381.area.svelte-1f3fe4k path.svelte-1f3fe4k { 2382 opacity: 0.3; 2383} 2384 2385/* src/charts/ScatterPlot.svelte.css */ 2386svg.svelte-16xd8ih > g.svelte-16xd8ih { 2387 pointer-events: all; 2388} 2389 2390/* src/editor/Editor.svelte.css */ 2391div.svelte-1n43zu { 2392 width: 100%; 2393 height: 100%; 2394} 2395div.svelte-1n43zu .CodeMirror-lines { 2396 border-top: 1px solid var(--color-sidebar-border); 2397} 2398div.svelte-1n43zu .CodeMirror { 2399 width: 100%; 2400 height: 100%; 2401 margin: 0; 2402 border: 0; 2403} 2404 2405/* src/editor/SliceEditor.svelte.css */ 2406div.svelte-1lgp5rh .CodeMirror { 2407 height: auto; 2408} 2409 2410/* src/charts/Sunburst.svelte.css */ 2411.half.svelte-1as0v9d { 2412 opacity: 0.5; 2413} 2414.account.svelte-1as0v9d { 2415 fill: var(--color-text); 2416} 2417.balance.svelte-1as0v9d { 2418 font-family: var(--font-family-monospaced); 2419} 2420path.svelte-1as0v9d { 2421 cursor: pointer; 2422} 2423 2424/* src/charts/Treemap.svelte.css */ 2425svg.svelte-lrs8nl { 2426 shape-rendering: crispEdges; 2427} 2428rect.svelte-lrs8nl { 2429 stroke: var(--color-treemap-text); 2430 stroke-width: 2px; 2431} 2432text.svelte-lrs8nl { 2433 cursor: pointer; 2434} 2435 2436/* src/entry-forms/Balance.svelte.css */ 2437div.svelte-unorr4 .currency { 2438 width: 6em; 2439} 2440 2441/* src/entry-forms/Note.svelte.css */ 2442textarea.svelte-s9o1z4 { 2443 flex-grow: 1; 2444 width: 100%; 2445 padding: 8px; 2446 font: inherit; 2447} 2448 2449/* src/entry-forms/Transaction.svelte.css */ 2450input[name=flag].svelte-12mv83z.svelte-12mv83z { 2451 width: 1.5em; 2452 padding-right: 2px; 2453 padding-left: 2px; 2454 text-align: center; 2455} 2456div.svelte-12mv83z .payee { 2457 flex-basis: 100px; 2458 flex-grow: 1; 2459} 2460input[name=narration].svelte-12mv83z.svelte-12mv83z { 2461 flex-basis: 200px; 2462 flex-grow: 1; 2463} 2464label.svelte-12mv83z > span.svelte-12mv83z:first-child, 2465.label.svelte-12mv83z > span.svelte-12mv83z:first-child { 2466 display: none; 2467} 2468@media (max-width: 767px) { 2469 label.svelte-12mv83z > span.svelte-12mv83z:first-child, 2470 .label.svelte-12mv83z > span.svelte-12mv83z:first-child { 2471 display: initial; 2472 width: 100%; 2473 } 2474} 2475 2476/* src/entry-forms/EntryMetadata.svelte.css */ 2477div.svelte-1v6bu4l { 2478 padding-left: 56px; 2479 font-size: 0.8em; 2480} 2481input.key.svelte-1v6bu4l { 2482 width: 10em; 2483} 2484input.value.svelte-1v6bu4l { 2485 flex-grow: 1; 2486 max-width: 15em; 2487} 2488@media (max-width: 767px) { 2489 div.svelte-1v6bu4l { 2490 padding-left: 0; 2491 } 2492} 2493 2494/* src/entry-forms/Posting.svelte.css */ 2495.drag.svelte-164exxa.svelte-164exxa { 2496 box-shadow: 0 0 5px var(--color-text); 2497} 2498div.svelte-164exxa.svelte-164exxa { 2499 padding-left: 50px; 2500 cursor: grab; 2501} 2502div.svelte-164exxa > .svelte-164exxa { 2503 cursor: initial; 2504} 2505div.svelte-164exxa .add-row.svelte-164exxa { 2506 display: none; 2507} 2508div.svelte-164exxa:last-child .add-row.svelte-164exxa { 2509 display: initial; 2510} 2511div.svelte-164exxa .amount { 2512 width: 220px; 2513} 2514div.svelte-164exxa:last-child .amount { 2515 width: 192px; 2516} 2517@media (max-width: 767px) { 2518 div.svelte-164exxa.svelte-164exxa { 2519 padding-left: 0; 2520 } 2521} 2522