Перенёс макет Mac-Claude (docs/pos-design/pos-mockup.html) в Avalonia по размерам, а не на глаз: - Оплата: модалка 880px поверх затемнённого экрана продажи (как в макете); сегменты Нал/Карта/Смешанная с векторными иконками (активный зелёный — иконка белая через стиль Button.seg.on Path); быстрые суммы 3×2 (без сдачи/4000/5000/10000/20000/своя сумма); клавиатура 3×4 по 72px. - Продажа: исправлена подсветка выбранной строки — локальные Background/IsVisible перекрывали сеттеры стиля :selected; теперь зелёный акцент слева + светло-зелёный фон работают. Бейдж «Отложенные · N». Чип связи «На связи · очередь пуста». - Демо: --demo-pay открывает модалку оплаты для скриншота на Windows; PayScrim в скриншотере рендерит оплату поверх реальной оболочки продажи. - Инструмент сверки: CompareRunner (--compare, SkiaSharp) складывает «макет | касса» рядом → docs/pos-design/compare-*.png. Скорость не ухудшена (старт 74мс, скан 13.7мс). --uitest OK, 82 unit зелёные. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
214 lines
11 KiB
XML
214 lines
11 KiB
XML
<Styles xmlns="https://github.com/avaloniaui"
|
||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||
|
||
<!-- ── Карточки ─────────────────────────────────────────────────── -->
|
||
<Style Selector="Border.card">
|
||
<Setter Property="Background" Value="{DynamicResource PosCard}"/>
|
||
<Setter Property="BorderBrush" Value="{DynamicResource PosBorder}"/>
|
||
<Setter Property="BorderThickness" Value="1"/>
|
||
<Setter Property="CornerRadius" Value="14"/>
|
||
<Setter Property="BoxShadow" Value="0 1 3 0 #14000000, 0 6 16 0 #0D000000"/>
|
||
</Style>
|
||
|
||
<!-- ── Чипы статуса (капсулы) ───────────────────────────────────── -->
|
||
<Style Selector="Border.chip">
|
||
<Setter Property="CornerRadius" Value="999"/>
|
||
<Setter Property="Padding" Value="12,6"/>
|
||
<Setter Property="Background" Value="{DynamicResource PosSubtle}"/>
|
||
</Style>
|
||
<Style Selector="Border.chip TextBlock">
|
||
<Setter Property="Foreground" Value="{DynamicResource PosTextMuted}"/>
|
||
<Setter Property="FontSize" Value="14"/>
|
||
<Setter Property="FontWeight" Value="SemiBold"/>
|
||
<Setter Property="VerticalAlignment" Value="Center"/>
|
||
</Style>
|
||
<Style Selector="Border.chip.ok">
|
||
<Setter Property="Background" Value="{DynamicResource PosBrandSoft}"/>
|
||
</Style>
|
||
<Style Selector="Border.chip.ok TextBlock"><Setter Property="Foreground" Value="{DynamicResource PosBrandDark}"/></Style>
|
||
<Style Selector="Border.chip.net"><Setter Property="Background" Value="{DynamicResource PosChipNet}"/></Style>
|
||
<Style Selector="Border.chip.warn">
|
||
<Setter Property="Background" Value="{DynamicResource PosWarnSoft}"/>
|
||
</Style>
|
||
<Style Selector="Border.chip.warn TextBlock"><Setter Property="Foreground" Value="{DynamicResource PosWarn}"/></Style>
|
||
|
||
<!-- ── Кнопки ───────────────────────────────────────────────────── -->
|
||
<Style Selector="Button.pos">
|
||
<Setter Property="Height" Value="50"/>
|
||
<Setter Property="MinHeight" Value="48"/>
|
||
<Setter Property="FontSize" Value="16"/>
|
||
<Setter Property="FontWeight" Value="SemiBold"/>
|
||
<Setter Property="Padding" Value="16,0"/>
|
||
<Setter Property="CornerRadius" Value="12"/>
|
||
<Setter Property="HorizontalContentAlignment" Value="Center"/>
|
||
<Setter Property="VerticalContentAlignment" Value="Center"/>
|
||
<Setter Property="Background" Value="{DynamicResource PosCard}"/>
|
||
<Setter Property="Foreground" Value="{DynamicResource PosText}"/>
|
||
<Setter Property="BorderBrush" Value="{DynamicResource PosBorder}"/>
|
||
<Setter Property="BorderThickness" Value="1"/>
|
||
<Setter Property="HorizontalAlignment" Value="Stretch"/>
|
||
</Style>
|
||
<Style Selector="Button.pos /template/ ContentPresenter">
|
||
<Setter Property="Transitions">
|
||
<Transitions><BrushTransition Property="Background" Duration="0:0:0.08"/></Transitions>
|
||
</Setter>
|
||
</Style>
|
||
<Style Selector="Button.pos TextBlock">
|
||
<Setter Property="TextWrapping" Value="Wrap"/>
|
||
<Setter Property="TextAlignment" Value="Center"/>
|
||
</Style>
|
||
|
||
<!-- Главная зелёная -->
|
||
<Style Selector="Button.primary">
|
||
<Setter Property="Background" Value="{DynamicResource PosBrand}"/>
|
||
<Setter Property="Foreground" Value="{DynamicResource PosBrandText}"/>
|
||
<Setter Property="BorderThickness" Value="0"/>
|
||
<Setter Property="FontWeight" Value="Bold"/>
|
||
</Style>
|
||
<Style Selector="Button.primary:pointerover /template/ ContentPresenter">
|
||
<Setter Property="Background" Value="{DynamicResource PosBrandHover}"/>
|
||
<Setter Property="TextElement.Foreground" Value="{DynamicResource PosBrandText}"/>
|
||
</Style>
|
||
<Style Selector="Button.primary:pressed /template/ ContentPresenter">
|
||
<Setter Property="Background" Value="{DynamicResource PosBrandPressed}"/>
|
||
</Style>
|
||
|
||
<!-- Вторичная (контур) -->
|
||
<Style Selector="Button.ghost">
|
||
<Setter Property="Background" Value="{DynamicResource PosCard}"/>
|
||
<Setter Property="Foreground" Value="{DynamicResource PosText}"/>
|
||
</Style>
|
||
<Style Selector="Button.ghost:pointerover /template/ ContentPresenter">
|
||
<Setter Property="Background" Value="{DynamicResource PosSubtle}"/>
|
||
<Setter Property="TextElement.Foreground" Value="{DynamicResource PosText}"/>
|
||
</Style>
|
||
|
||
<!-- Опасная (красный контур, без заливки) -->
|
||
<Style Selector="Button.danger">
|
||
<Setter Property="Background" Value="{DynamicResource PosCard}"/>
|
||
<Setter Property="Foreground" Value="{DynamicResource PosDanger}"/>
|
||
<Setter Property="BorderBrush" Value="{DynamicResource PosDangerBorder}"/>
|
||
</Style>
|
||
<Style Selector="Button.danger TextBlock"><Setter Property="Foreground" Value="{DynamicResource PosDanger}"/></Style>
|
||
<Style Selector="Button.danger:pointerover /template/ ContentPresenter">
|
||
<Setter Property="Background" Value="{DynamicResource PosDangerSoft}"/>
|
||
<Setter Property="TextElement.Foreground" Value="{DynamicResource PosDanger}"/>
|
||
</Style>
|
||
|
||
<!-- Клавиша клавиатуры/степпер -->
|
||
<Style Selector="Button.key">
|
||
<Setter Property="Background" Value="{DynamicResource PosCard}"/>
|
||
<Setter Property="Foreground" Value="{DynamicResource PosText}"/>
|
||
<Setter Property="FontSize" Value="22"/>
|
||
<Setter Property="FontWeight" Value="SemiBold"/>
|
||
<Setter Property="CornerRadius" Value="12"/>
|
||
<Setter Property="BorderBrush" Value="{DynamicResource PosBorder}"/>
|
||
<Setter Property="BorderThickness" Value="1"/>
|
||
<Setter Property="Padding" Value="0"/>
|
||
<Setter Property="HorizontalAlignment" Value="Stretch"/>
|
||
<Setter Property="HorizontalContentAlignment" Value="Center"/>
|
||
<Setter Property="VerticalContentAlignment" Value="Center"/>
|
||
</Style>
|
||
<Style Selector="Button.key /template/ ContentPresenter">
|
||
<Setter Property="HorizontalContentAlignment" Value="Center"/>
|
||
<Setter Property="VerticalContentAlignment" Value="Center"/>
|
||
</Style>
|
||
<Style Selector="Button.key:pointerover /template/ ContentPresenter">
|
||
<Setter Property="Background" Value="{DynamicResource PosSubtle}"/>
|
||
</Style>
|
||
|
||
<!-- Сегмент переключателя (выбранный — зелёный) -->
|
||
<Style Selector="Button.seg">
|
||
<Setter Property="Background" Value="{DynamicResource PosCard}"/>
|
||
<Setter Property="Foreground" Value="{DynamicResource PosText}"/>
|
||
<Setter Property="Height" Value="52"/>
|
||
<Setter Property="HorizontalAlignment" Value="Stretch"/>
|
||
<Setter Property="HorizontalContentAlignment" Value="Center"/>
|
||
<Setter Property="VerticalContentAlignment" Value="Center"/>
|
||
</Style>
|
||
<Style Selector="Button.seg /template/ ContentPresenter">
|
||
<Setter Property="HorizontalContentAlignment" Value="Center"/>
|
||
<Setter Property="VerticalContentAlignment" Value="Center"/>
|
||
</Style>
|
||
<Style Selector="Button.seg.on">
|
||
<Setter Property="Background" Value="{DynamicResource PosBrand}"/>
|
||
<Setter Property="Foreground" Value="{DynamicResource PosBrandText}"/>
|
||
<Setter Property="BorderThickness" Value="0"/>
|
||
</Style>
|
||
<Style Selector="Button.seg.on /template/ ContentPresenter">
|
||
<Setter Property="Background" Value="{DynamicResource PosBrand}"/>
|
||
</Style>
|
||
<Style Selector="Button.seg Path"><Setter Property="Stroke" Value="{DynamicResource PosTextMuted}"/></Style>
|
||
<Style Selector="Button.seg.on Path"><Setter Property="Stroke" Value="{DynamicResource PosBrandText}"/></Style>
|
||
|
||
<!-- ── Поля ввода ──────────────────────────────────────────────── -->
|
||
<Style Selector="TextBox.pos">
|
||
<Setter Property="FontSize" Value="17"/>
|
||
<Setter Property="Height" Value="52"/>
|
||
<Setter Property="VerticalContentAlignment" Value="Center"/>
|
||
<Setter Property="CornerRadius" Value="12"/>
|
||
<Setter Property="Background" Value="{DynamicResource PosCard}"/>
|
||
<Setter Property="Foreground" Value="{DynamicResource PosText}"/>
|
||
<Setter Property="BorderBrush" Value="{DynamicResource PosBorder}"/>
|
||
</Style>
|
||
<Style Selector="TextBox.search">
|
||
<Setter Property="FontSize" Value="19"/>
|
||
<Setter Property="Height" Value="58"/>
|
||
<Setter Property="VerticalContentAlignment" Value="Center"/>
|
||
<Setter Property="CornerRadius" Value="14"/>
|
||
<Setter Property="Background" Value="{DynamicResource PosCard}"/>
|
||
<Setter Property="Foreground" Value="{DynamicResource PosText}"/>
|
||
<Setter Property="BorderBrush" Value="{DynamicResource PosBorder}"/>
|
||
</Style>
|
||
|
||
<!-- Капсулы горячих клавиш -->
|
||
<Style Selector="Border.hotkey">
|
||
<Setter Property="Background" Value="{DynamicResource PosSubtle}"/>
|
||
<Setter Property="BorderBrush" Value="{DynamicResource PosBorder}"/>
|
||
<Setter Property="BorderThickness" Value="1"/>
|
||
<Setter Property="CornerRadius" Value="8"/>
|
||
<Setter Property="Padding" Value="9,4"/>
|
||
</Style>
|
||
|
||
<!-- kbd-капсула (как <kbd> в макете) -->
|
||
<Style Selector="Border.kbd">
|
||
<Setter Property="MinWidth" Value="30"/>
|
||
<Setter Property="Height" Value="24"/>
|
||
<Setter Property="Padding" Value="7,0"/>
|
||
<Setter Property="CornerRadius" Value="6"/>
|
||
<Setter Property="Background" Value="{DynamicResource PosCard}"/>
|
||
<Setter Property="BorderBrush" Value="{DynamicResource PosBorder}"/>
|
||
<Setter Property="BorderThickness" Value="1,1,1,2"/>
|
||
<Setter Property="VerticalAlignment" Value="Center"/>
|
||
</Style>
|
||
<Style Selector="Border.kbd > TextBlock">
|
||
<Setter Property="FontSize" Value="12"/>
|
||
<Setter Property="FontWeight" Value="SemiBold"/>
|
||
<Setter Property="Foreground" Value="{DynamicResource PosTextMuted}"/>
|
||
<Setter Property="HorizontalAlignment" Value="Center"/>
|
||
<Setter Property="VerticalAlignment" Value="Center"/>
|
||
</Style>
|
||
<Style Selector="Border.kbd.onbrand"><Setter Property="Background" Value="#33FFFFFF"/><Setter Property="BorderThickness" Value="0"/></Style>
|
||
<Style Selector="Border.kbd.onbrand > TextBlock"><Setter Property="Foreground" Value="White"/></Style>
|
||
|
||
<!-- Грань степпера (− / +) — слитный блок -->
|
||
<Style Selector="Button.stepbtn">
|
||
<Setter Property="Background" Value="{DynamicResource PosStepBg}"/>
|
||
<Setter Property="Foreground" Value="{DynamicResource PosText}"/>
|
||
<Setter Property="BorderThickness" Value="0"/>
|
||
<Setter Property="CornerRadius" Value="0"/>
|
||
<Setter Property="FontSize" Value="22"/>
|
||
<Setter Property="FontWeight" Value="Medium"/>
|
||
<Setter Property="Padding" Value="0"/>
|
||
<Setter Property="HorizontalAlignment" Value="Stretch"/>
|
||
<Setter Property="VerticalAlignment" Value="Stretch"/>
|
||
<Setter Property="HorizontalContentAlignment" Value="Center"/>
|
||
<Setter Property="VerticalContentAlignment" Value="Center"/>
|
||
</Style>
|
||
<Style Selector="Button.stepbtn /template/ ContentPresenter">
|
||
<Setter Property="HorizontalContentAlignment" Value="Center"/>
|
||
<Setter Property="VerticalContentAlignment" Value="Center"/>
|
||
</Style>
|
||
<Style Selector="Button.stepbtn:pointerover /template/ ContentPresenter"><Setter Property="Background" Value="{DynamicResource PosSubtle}"/></Style>
|
||
</Styles>
|