pattern.css (1649B)
1 /* ===== Cyrillic dot-matrix page-marker ===== 2 Desktop: marker sits ON the frame's top border (right side, ~320px), 3 reading as part of the border itself. 4 Mobile: marker sits ON the header's bottom border. */ 5 6 .tui .frame { position: relative; } 7 8 /* Hide V5's native right-meta strip (data-meta on .frame::after) — the 9 marker replaces it on this theme. */ 10 .tui .frame::after { display: none; } 11 12 /* Desktop marker. 13 The SVG itself contains a full-width centerline at y=H/2 stroked in the 14 same color as the frame's border-top, so the two lines pixel-align and 15 read as one continuous rule. */ 16 .tui .frame > .frame-marker { 17 position: absolute; 18 /* -16.5px (not -16px) so the SVG's 1px centerline pixel-aligns with the 19 frame's 1px border-top — otherwise the two lines sit half a pixel apart 20 and read as two slightly-shifted rules. */ 21 top: -16.5px; 22 right: 8px; 23 width: 320px; 24 height: 32px; 25 background: var(--bg); 26 pointer-events: none; 27 display: block; 28 } 29 30 /* Mobile marker — hidden on desktop. */ 31 .tui .frame-marker-mobile { display: none; } 32 33 /* Real-viewport mobile (≤560px) — desktop marker off, mobile marker on 34 the header's bottom-border. */ 35 @media (max-width: 560px) { 36 .tui .frame > .frame-marker { display: none; } 37 38 .tui header.site { 39 position: relative; 40 padding-bottom: 12px; 41 } 42 43 .tui header.site .frame-marker-mobile { 44 display: block; 45 position: absolute; 46 /* Keep visually centered on the header's bottom border: bottom = -height/2 */ 47 bottom: -13px; 48 right: 6px; 49 width: 320px; 50 height: 26px; 51 background: var(--bg); 52 pointer-events: none; 53 } 54 }