Текст конфігу: більше повітря між рядками й символами
Скарга: «жирний, зливається, текст не видно — просто лінії». На конфігах із довгими схожими рядками (ZTE на 33 тисячі) це перетворювалось на сіру масу. Причина не в кольорі й не в товщині шрифту як такій: світлий текст на майже чорному тлі Windows малює помітно товщим, ніж він є. Типове лікування — -webkit-font-smoothing: antialiased — на Windows у Chrome не працює взагалі, воно лише для macOS. Тому зроблено те, що там справді діє: рядок 22 px замість 20 і невеликий міжлітерний просвіт. Розмір лишився 12 px навмисно: на 33 тисячах рядків кожен зайвий піксель висоти — це ще один екран прокрутки. ROW_H оновлено разом із класом: воно мусить збігатися з розміткою, бо за ним рахується віртуальна прокрутка й позиція рамки на мінікарті.
This commit is contained in:
parent
04e1242c52
commit
ce61d41754
1 changed files with 16 additions and 4 deletions
|
|
@ -21,12 +21,24 @@ import { Minimap, buildShape } from './Minimap'
|
|||
* панель версій, і шапку.
|
||||
*/
|
||||
|
||||
/** Висота рядка коду. Мусить збігатися з leading-5 у розмітці. */
|
||||
export const ROW_H = 20
|
||||
/** Висота рядка коду. Мусить збігатися з leading-[22px] у розмітці. */
|
||||
export const ROW_H = 22
|
||||
|
||||
/** Шрифт коду. Один рядок на всі три місця, де він потрібен, — щоб
|
||||
* вимірювання ширини символа не розійшлося з тим, що намальовано. */
|
||||
export const CODE_FONT = 'font-mono text-[12px] leading-5'
|
||||
* вимірювання ширини символа не розійшлося з тим, що намальовано.
|
||||
*
|
||||
* Було `text-[12px] leading-5` (20 px на рядок) — і на конфігах, де
|
||||
* рядки довгі та схожі один на одного, це зливалось у сіру масу.
|
||||
* Причина не в кольорі: світлий текст на майже чорному тлі Windows
|
||||
* малює помітно товщим, ніж є, а типове лікування
|
||||
* (-webkit-font-smoothing) там не працює взагалі — воно лише для macOS.
|
||||
*
|
||||
* Тому додано те, що на Windows справді діє: більше повітря. Рядок
|
||||
* 22 px замість 20, і невеликий міжлітерний просвіт — символи
|
||||
* перестають чіплятись один за одного. Розмір лишився 12 px: на
|
||||
* 33 тисячах рядків ZTE кожен зайвий піксель висоти — це ще один
|
||||
* екран прокрутки. */
|
||||
export const CODE_FONT = 'font-mono text-[12px] leading-[22px] tracking-[0.02em]'
|
||||
|
||||
/** Останній рядок, що починається не нижче за y. */
|
||||
export function rowAt(offsets: Int32Array, y: number): number {
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue