/* * PaperSense — Hebrew refinements (v4 Release B, design/v4/UX_SPEC.md §8, COPY_DECK §15). * * Everything else is written once with logical properties and serves both directions. This file holds only what a logical property * cannot say, and it only matters when : a headline face with no Hebrew letters, text inside SVG, Latin names inside * right-to-left text. Loaded by app.html, index.html, onepager.html and kitchen-sink.html after their other stylesheets; the selectors * start with :root:lang(he), so they win over the views' own rules (which load later) without !important. */ /* --- Text inside an SVG chart --------------------------------------------------------------------------------------------------- The charts stay left to right (time runs from the left, the axes' arrows point right and up), so their text is drawn from physical positions. A label that mixes Hebrew and a number ("טובה מ-92%") must still read in the Hebrew order: each takes the direction of its own first strong letter (Latin and plain numbers stay left to right). */ :root:lang(he) svg text { unicode-bidi: plaintext; } /* --- Names ---------------------------------------------------------------------------------------------------------------------- A company's name is Latin and ends in "Inc." or "Corp.": inside right-to-left text the final period would jump to the front. The views mark these spans dir="ltr" (an isolate, so the name keeps its own order); a block-level one stays aligned to the page's end. */ :root[dir='rtl'] :is(.dash-picks__name, .picks-inside-list__name, .holdings-table__name, .pick-card__name, .picks-row__name, .rankings-cell-text[dir='ltr'], .search-modal__result-name, .op-lead__name) { text-align: end; } /* The Portfolio's tables and company picker put the name in a inside a block that shortens it with an ellipsis. A right-to-left block would cut the BEGINNING of the name ("…oenix Education Partners, Inc."); run left to right, the cut is at the end, and the block still sits flush with the page's end. A block that also carries a Hebrew note (the name, then the note) keeps the page's direction: its order is right to left and the cut falls at the end of the note. */ :root[dir='rtl'] .pf-combo__name { direction: ltr; text-align: end; } :root[dir='rtl'] .pf-co:not(:has(> :not(bdi))) { direction: ltr; text-align: end; } /* --- Newsprint headlines ---------------------------------------------------------------------------------------------------------- League Gothic has no Hebrew, so the headline slots fall to Frank Ruhl Libre (tokens.css §12), which has weights where the gothic has one: the Hebrew mockup sets these heavy. The block below is generated (tools/gen_hebrew_weights.py): every rule that uses the gothic family. */ /* BEGIN GENERATED headline weights (tools/gen_hebrew_weights.py) */ /* One line per rule that uses the gothic family; 800 from 3rem up (the big headlines), 700 otherwise. */ :root:lang(he) .np-brief__hed { font-weight: 700; } :root:lang(he) .np-ear { font-weight: 700; } :root:lang(he) .np-foot__top { font-weight: 700; } :root:lang(he) .np-lead__hed { font-weight: 700; } :root:lang(he) .np-stamp { font-weight: 700; } :root:lang(he) .np-story__hed { font-weight: 700; } :root:lang(he) .np-table caption { font-weight: 700; } :root:lang(he) .op-disclaimer { font-weight: 700; } :root:lang(he) .op-ear { font-weight: 700; } :root:lang(he) .op-lead__name { font-weight: 700; } :root:lang(he) .op-msg { font-weight: 700; } :root:lang(he) .op-n__k { font-weight: 700; } :root:lang(he) .op-sec { font-weight: 700; } :root:lang(he) .op-stamp { font-weight: 700; } :root:lang(he) .op-view p::first-letter { font-weight: 700; } :root:lang(he) .pf-checklist-print h2 { font-weight: 700; } :root:lang(he) .pf-drawer__title { font-weight: 700; } :root:lang(he) .pf-ear { font-weight: 700; } :root:lang(he) .pf-env3__h { font-weight: 700; } :root:lang(he) .pf-fig__k { font-weight: 700; } :root:lang(he) .pf-foot b { font-weight: 700; } :root:lang(he) .pf-grp__h { font-weight: 700; } :root:lang(he) .pf-lead__title { font-weight: 800; } :root:lang(he) .pf-n__k { font-weight: 700; } :root:lang(he) .pf-plancard__title { font-weight: 700; } :root:lang(he) .pf-rec__st { font-weight: 700; } :root:lang(he) .pf-rules__k { font-weight: 700; } :root:lang(he) .pf-sec { font-weight: 700; } :root:lang(he) .pf-sec__n { font-weight: 700; } :root:lang(he) .pf-stamp { font-weight: 700; } :root:lang(he) .pf-stepof__v { font-weight: 800; } :root:lang(he) .pf-tab { font-weight: 700; } :root:lang(he) .pf-table thead th { font-weight: 700; } :root:lang(he) .pf-taxdisc__k { font-weight: 700; } :root:lang(he) .pf-taxev__t { font-weight: 700; } :root:lang(he) .pf-taxtotal b { font-weight: 700; } :root:lang(he) .pf-title { font-weight: 800; } /* END GENERATED headline weights */ /* --- Portfolio masthead: the ear (the next step's date) -------------------------------------------------------------------------- "15 באוק׳" is wider than "Oct 15": the date takes the whole width of the ear and the note ("בעוד 6 ימים") goes under it. */ :root:lang(he) .pf-ear { grid-template-columns: minmax(0, 1fr); row-gap: 0.125rem; } :root:lang(he) .pf-ear__k { grid-column: auto; } :root:lang(he) .pf-ear__v { font-size: 1.75rem; white-space: nowrap; } :root:lang(he) .pf-ear__s { text-align: start; padding-block-end: 0; } /* --- Sign-in and account forms: a field that holds left-to-right text ----------------------------------------------------------------- A handle, an invite or recovery code and a setup key are typed left to right (the field is direction: ltr). In a right-to-left form the text still starts at the leading (right) edge, like the Hebrew labels above it and the password field next to it, so the whole column lines up; the placeholder follows. */ :root[dir='rtl'] .au-input--ltr { text-align: end; }