Створила стилі для друку на 637 рядків

Ситуація. Кейси сайту — це те, що хтось роздруковує й бере із собою на зустріч. Тож папір — повноцінний формат виведення, а не жест увічливості, і це зовсім інший носій, ніж вузький екран: розмір паперу в читача невідомий, орієнтація невідома, а поведінка браузера під час друку залежить від рушія так, що жоден попередній перегляд на екрані цього не покаже.

Завдання. Сайт мав правильно друкуватися на папері невідомого формату в обох колірних темах, без окремого документа, який довелося б підтримувати поруч із вебверсією.

Дія. Усе це — одна таблиця стилів на 637 рядків з єдиним правилом сторінки й одним блоком для друку. Правило сторінки задає поля й навмисно не задає розміру паперу, тож формат, який читач обере в діалоговому вікні друку, застосовується як є, а решта під нього підлаштовується. Кореневий розмір шрифту зафіксовано в пунктах, тож кожна відносна величина має фізичну точку відліку, а довжину рядка приблизно в сімдесят два символи застосовано до чотирьох блоків верхнього рівня — тут аркуш бере гору над дизайном, бо інакше на альбомній сторінці рядок розтягувався б приблизно до ста десяти символів. Чотири особливості поведінки рушіїв задокументовано як пастки, і кожна спричинила реальний дефект. Одиниці вікна перегляду в одному рушії обчислюються відносно області сторінки, а в іншому — відносно вікна, тож у другому сторінка, надрукована з широкого вікна, втрачає третину кожного рядка. Елементи з фіксованим положенням друкуються на кожному аркуші, тож декоративні прибрали, а два з них перетворили на бланк і колофон. Палітра за замовчуванням задає білий текст, бо тема за замовчуванням темна, і через це чотири підписи розділів на початку абзаців друкувалися білим по білому — слів просто не було. А на сторінкових носіях flex- чи grid‑контейнер не можна розірвати між сторінками, через що на сторінці досягнення з’являвся порожній перший аркуш. Усе це охоплює перевірка з шести частин: вона перевіряє шість комбінацій формату паперу й орієнтації, обидва налаштування колірної схеми та фактичну кількість сторінок порівняно з тією, яку передбачає висота вмісту.

Результат. Сайт друкується на папері невідомого формату в обох темах, а чотири особливості рушіїв записано разом із дефектом, який спричинила кожна. Відомі обмеження записано, а не приховано: немає ні номерів сторінок, ні колонтитулів, один рушій ігнорує контроль висячих рядків, а буквиці підтримуються не всюди. Одного разу зайвий символ кінця коментаря змусив лінтер CSS «проковтнути» ціле правило, і він двічі не знайшов жодної помилки — помітила це лише перевірка друку.