food-market/docs/pos-screenshots/index.html

<!doctype html><html lang="ru"><head><meta charset="utf-8"><title>Касса food-market — скриншоты</title><style>body{font:14px system-ui,Segoe UI,Roboto;margin:0;background:#0f172a;color:#e2e8f0}header{padding:18px 24px;background:#1e293b}h1{margin:0;font-size:20px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(420px,1fr));gap:16px;padding:20px}figure{margin:0;background:#1e293b;border:1px solid #334155;border-radius:10px;overflow:hidden}img{width:100%;display:block;background:#000;cursor:zoom-in}figcaption{padding:8px 10px;color:#cbd5e1;font-size:13px}</style></head><body><header><h1>Касса food-market — скриншоты процессов</h1><div style="color:#94a3b8">Светлая тема (Avalonia/Skia, headless, Linux) — 1920×1080 и 1366×768. Кадров: 24</div></header><header style="background:#eef2f0;color:#0f1f17"><h1 style="color:#16a34a">Стало (светлая тема)</h1></header><div class="grid"><figure><a href="01-login-1920x1080.png" target="_blank"><img src="01-login-1920x1080.png" loading="lazy"></a><figcaption>Вход кассира (адрес сервера, логин, пароль) (1920x1080)</figcaption></figure><figure><a href="01-login-1366x768.png" target="_blank"><img src="01-login-1366x768.png" loading="lazy"></a><figcaption>Вход кассира (адрес сервера, логин, пароль) (1366x768)</figcaption></figure><figure><a href="01b-login-pin-1920x1080.png" target="_blank"><img src="01b-login-pin-1920x1080.png" loading="lazy"></a><figcaption>Быстрый вход по PIN (зарегистрированное устройство) (1920x1080)</figcaption></figure><figure><a href="01b-login-pin-1366x768.png" target="_blank"><img src="01b-login-pin-1366x768.png" loading="lazy"></a><figcaption>Быстрый вход по PIN (зарегистрированное устройство) (1366x768)</figcaption></figure><figure><a href="02-shift-open-1920x1080.png" target="_blank"><img src="02-shift-open-1920x1080.png" loading="lazy"></a><figcaption>Смена: Z-отчёт/состояние смены (1920x1080)</figcaption></figure><figure><a href="02-shift-open-1366x768.png" target="_blank"><img src="02-shift-open-1366x768.png" loading="lazy"></a><figcaption>Смена: Z-отчёт/состояние смены (1366x768)</figcaption></figure><figure><a href="03-sale-empty-1920x1080.png" target="_blank"><img src="03-sale-empty-1920x1080.png" loading="lazy"></a><figcaption>Продажа: пустой чек, ожидание сканирования (с оболочкой) (1920x1080)</figcaption></figure><figure><a href="03-sale-empty-1366x768.png" target="_blank"><img src="03-sale-empty-1366x768.png" loading="lazy"></a><figcaption>Продажа: пустой чек, ожидание сканирования (с оболочкой) (1366x768)</figcaption></figure><figure><a href="04-sale-items-1920x1080.png" target="_blank"><img src="04-sale-items-1920x1080.png" loading="lazy"></a><figcaption>Продажа: чек с товарами + избранное (с оболочкой) (1920x1080)</figcaption></figure><figure><a href="04-sale-items-1366x768.png" target="_blank"><img src="04-sale-items-1366x768.png" loading="lazy"></a><figcaption>Продажа: чек с товарами + избранное (с оболочкой) (1366x768)</figcaption></figure><figure><a href="05-payment-cash-1920x1080.png" target="_blank"><img src="05-payment-cash-1920x1080.png" loading="lazy"></a><figcaption>Оплата наличными со сдачей (1920x1080)</figcaption></figure><figure><a href="05-payment-cash-1366x768.png" target="_blank"><img src="05-payment-cash-1366x768.png" loading="lazy"></a><figcaption>Оплата наличными со сдачей (1366x768)</figcaption></figure><figure><a href="06-payment-mixed-1920x1080.png" target="_blank"><img src="06-payment-mixed-1920x1080.png" loading="lazy"></a><figcaption>Оплата смешанная (нал+карта) (1920x1080)</figcaption></figure><figure><a href="06-payment-mixed-1366x768.png" target="_blank"><img src="06-payment-mixed-1366x768.png" loading="lazy"></a><figcaption>Оплата смешанная (нал+карта) (1366x768)</figcaption></figure><figure><a href="07-return-1920x1080.png" target="_blank"><img src="07-return-1920x1080.png" loading="lazy"></a><figcaption>Возврат по чеку (выбор позиций) (1920x1080)</figcaption></figure><figure><a href="07-return-1366x768.png" target="_blank"><img src="07-return-1366x768.png" loading="lazy"></a><figcaption>Возврат по чеку (выбор позиций) (1366x768)</figcaption></figure><figure><a href="08-shift-z-1920x1080.png" target="_blank"><img src="08-shift-z-1920x1080.png" loading="lazy"></a><figcaption>Z-отчёт при закрытии (должно/факт/разница) (1920x1080)</figcaption></figure><figure><a href="08-shift-z-1366x768.png" target="_blank"><img src="08-shift-z-1366x768.png" loading="lazy"></a><figcaption>Z-отчёт при закрытии (должно/факт/разница) (1366x768)</figcaption></figure><figure><a href="09-shell-offline-1920x1080.png" target="_blank"><img src="09-shell-offline-1920x1080.png" loading="lazy"></a><figcaption>Статус-бар: нет связи, чеки в очереди (1920x1080)</figcaption></figure><figure><a href="09-shell-offline-1366x768.png" target="_blank"><img src="09-shell-offline-1366x768.png" loading="lazy"></a><figcaption>Статус-бар: нет связи, чеки в очереди (1366x768)</figcaption></figure><figure><a href="10-shell-online-1920x1080.png" target="_blank"><img src="10-shell-online-1920x1080.png" loading="lazy"></a><figcaption>Статус-бар: на связи, очередь пуста (1920x1080)</figcaption></figure><figure><a href="10-shell-online-1366x768.png" target="_blank"><img src="10-shell-online-1366x768.png" loading="lazy"></a><figcaption>Статус-бар: на связи, очередь пуста (1366x768)</figcaption></figure><figure><a href="11-shell-dark-1920x1080.png" target="_blank"><img src="11-shell-dark-1920x1080.png" loading="lazy"></a><figcaption>Тёмная тема (опция в настройках, не по умолчанию) (1920x1080)</figcaption></figure><figure><a href="11-shell-dark-1366x768.png" target="_blank"><img src="11-shell-dark-1366x768.png" loading="lazy"></a><figcaption>Тёмная тема (опция в настройках, не по умолчанию) (1366x768)</figcaption></figure></div><header style="background:#1e293b;margin-top:8px"><h1 style="color:#e2e8f0">Было (тёмная тема)</h1><div style="color:#94a3b8">для сравнения — прежний мрачный интерфейс</div></header><div class="grid" style="background:#0f172a"><figure style="background:#1e293b;border-color:#334155"><a href="before/01-login-1366x768.png" target="_blank"><img src="before/01-login-1366x768.png" loading="lazy"></a><figcaption style="color:#cbd5e1">01-login-1366x768</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/01-login-1920x1080.png" target="_blank"><img src="before/01-login-1920x1080.png" loading="lazy"></a><figcaption style="color:#cbd5e1">01-login-1920x1080</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/01b-login-pin-1366x768.png" target="_blank"><img src="before/01b-login-pin-1366x768.png" loading="lazy"></a><figcaption style="color:#cbd5e1">01b-login-pin-1366x768</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/01b-login-pin-1920x1080.png" target="_blank"><img src="before/01b-login-pin-1920x1080.png" loading="lazy"></a><figcaption style="color:#cbd5e1">01b-login-pin-1920x1080</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/02-shift-open-1366x768.png" target="_blank"><img src="before/02-shift-open-1366x768.png" loading="lazy"></a><figcaption style="color:#cbd5e1">02-shift-open-1366x768</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/02-shift-open-1920x1080.png" target="_blank"><img src="before/02-shift-open-1920x1080.png" loading="lazy"></a><figcaption style="color:#cbd5e1">02-shift-open-1920x1080</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/03-sale-empty-1366x768.png" target="_blank"><img src="before/03-sale-empty-1366x768.png" loading="lazy"></a><figcaption style="color:#cbd5e1">03-sale-empty-1366x768</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/03-sale-empty-1920x1080.png" target="_blank"><img src="before/03-sale-empty-1920x1080.png" loading="lazy"></a><figcaption style="color:#cbd5e1">03-sale-empty-1920x1080</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/04-sale-items-1366x768.png" target="_blank"><img src="before/04-sale-items-1366x768.png" loading="lazy"></a><figcaption style="color:#cbd5e1">04-sale-items-1366x768</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/04-sale-items-1920x1080.png" target="_blank"><img src="before/04-sale-items-1920x1080.png" loading="lazy"></a><figcaption style="color:#cbd5e1">04-sale-items-1920x1080</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/05-payment-cash-1366x768.png" target="_blank"><img src="before/05-payment-cash-1366x768.png" loading="lazy"></a><figcaption style="color:#cbd5e1">05-payment-cash-1366x768</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/05-payment-cash-1920x1080.png" target="_blank"><img src="before/05-payment-cash-1920x1080.png" loading="lazy"></a><figcaption style="color:#cbd5e1">05-payment-cash-1920x1080</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/06-payment-mixed-1366x768.png" target="_blank"><img src="before/06-payment-mixed-1366x768.png" loading="lazy"></a><figcaption style="color:#cbd5e1">06-payment-mixed-1366x768</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/06-payment-mixed-1920x1080.png" target="_blank"><img src="before/06-payment-mixed-1920x1080.png" loading="lazy"></a><figcaption style="color:#cbd5e1">06-payment-mixed-1920x1080</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/07-return-1366x768.png" target="_blank"><img src="before/07-return-1366x768.png" loading="lazy"></a><figcaption style="color:#cbd5e1">07-return-1366x768</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/07-return-1920x1080.png" target="_blank"><img src="before/07-return-1920x1080.png" loading="lazy"></a><figcaption style="color:#cbd5e1">07-return-1920x1080</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/08-shift-z-1366x768.png" target="_blank"><img src="before/08-shift-z-1366x768.png" loading="lazy"></a><figcaption style="color:#cbd5e1">08-shift-z-1366x768</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/08-shift-z-1920x1080.png" target="_blank"><img src="before/08-shift-z-1920x1080.png" loading="lazy"></a><figcaption style="color:#cbd5e1">08-shift-z-1920x1080</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/09-shell-offline-1366x768.png" target="_blank"><img src="before/09-shell-offline-1366x768.png" loading="lazy"></a><figcaption style="color:#cbd5e1">09-shell-offline-1366x768</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/09-shell-offline-1920x1080.png" target="_blank"><img src="before/09-shell-offline-1920x1080.png" loading="lazy"></a><figcaption style="color:#cbd5e1">09-shell-offline-1920x1080</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/10-shell-online-1366x768.png" target="_blank"><img src="before/10-shell-online-1366x768.png" loading="lazy"></a><figcaption style="color:#cbd5e1">10-shell-online-1366x768</figcaption></figure><figure style="background:#1e293b;border-color:#334155"><a href="before/10-shell-online-1920x1080.png" target="_blank"><img src="before/10-shell-online-1920x1080.png" loading="lazy"></a><figcaption style="color:#cbd5e1">10-shell-online-1920x1080</figcaption></figure></div><header style="margin-top:8px"><h1>Windows 11 — реальное окно</h1><div style="color:#94a3b8">Снято на Windows 11 (VM, software-рендер — у VM нет GPU; консоль 1280×800). Подтверждает нативный рендер: кириллица, формат чисел «3 362 ₸», кнопки без обрезки. Высокое разрешение 1366/1920 — в headless-кадрах выше (тот же движок Avalonia/Skia/Inter).</div></header><div class="grid"><figure><a href="windows/windows11-payment.png" target="_blank"><img src="windows/windows11-payment.png" loading="lazy"></a><figcaption>Windows 11 — экран оплаты (реальное окно)</figcaption></figure><figure><a href="windows/windows11-sale.png" target="_blank"><img src="windows/windows11-sale.png" loading="lazy"></a><figcaption>Windows 11 — экран продажи (реальное окно)</figcaption></figure></div><header style="margin-top:8px"><h1>Адаптив — одно разрешение на кадр</h1><div style="color:#94a3b8">Правая панель сжимается по высоте (меньше отступы, скрыт блок «Последний чек», кнопки 44px), шапка — по ширине (сокращение чипов). Ничего не перекрывается на 1280×720/800, 1366×768, 1920×1080.</div></header><div class="grid"><figure><a href="density/sale-1280x720.png" target="_blank"><img src="density/sale-1280x720.png" loading="lazy"></a><figcaption>sale-1280x720</figcaption></figure><figure><a href="density/sale-1280x800.png" target="_blank"><img src="density/sale-1280x800.png" loading="lazy"></a><figcaption>sale-1280x800</figcaption></figure><figure><a href="density/sale-1366x768.png" target="_blank"><img src="density/sale-1366x768.png" loading="lazy"></a><figcaption>sale-1366x768</figcaption></figure><figure><a href="density/sale-1920x1080.png" target="_blank"><img src="density/sale-1920x1080.png" loading="lazy"></a><figcaption>sale-1920x1080</figcaption></figure></div></body></html>