Текст конфігу: більше повітря між рядками й символами
Скарга: «жирний, зливається, текст не видно — просто лінії». На конфігах із довгими схожими рядками (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 у розмітці. */
|
/** Висота рядка коду. Мусить збігатися з leading-[22px] у розмітці. */
|
||||||
export const ROW_H = 20
|
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. */
|
/** Останній рядок, що починається не нижче за y. */
|
||||||
export function rowAt(offsets: Int32Array, y: number): number {
|
export function rowAt(offsets: Int32Array, y: number): number {
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue