diff --git a/popup-theme.css b/popup-theme.css new file mode 100644 index 0000000..5c9b440 --- /dev/null +++ b/popup-theme.css @@ -0,0 +1,83 @@ +/* api#353 / Preland: согласованный светлый канон PDF/guest-quota. + * Геометрию, состояния и тёмную тему задают существующие компоненты. + * Этот файл совпадает с popup-theme.css прелендингов. */ +body:not(.theme-dark) { + --popup-surface: linear-gradient(180deg, #edf4fd, #faf0fa); + --popup-title: #202334; + --popup-text: #4b4f61; + --popup-focus: #6439aa; + --popup-shadow: 0 24px 80px rgb(25 31 49 / 18%); + --popup-border: rgb(25 31 49 / 12%); +} + +body:not(.theme-dark) .input-choice-popup, +body:not(.theme-dark) .upload-error-popup, +body:not(.theme-dark) .dp-overlay { + background: rgb(25 31 49 / 35%); +} +body:not(.theme-dark) .modal-backdrop { background: #191f31; } +body:not(.theme-dark) .modal-backdrop.show { opacity: .35; } + +body:not(.theme-dark) .input-choice-popup .input-choice-card, +body:not(.theme-dark) .upload-error-popup .upload-error-card, +body:not(.theme-dark) .modal-payment .modal-content, +body:not(.theme-dark) .dp-dialog { + background: var(--popup-surface); + color: var(--popup-title); + color-scheme: light; + border-color: var(--popup-border); + box-shadow: var(--popup-shadow); +} + +body:not(.theme-dark) .input-choice-popup h2, +body:not(.theme-dark) .input-choice-popup .input-choice-option, +body:not(.theme-dark) .modal-payment .close, +body:not(.theme-dark) .dp-close, +body:not(.theme-dark) .dp-retry { + color: var(--popup-title); + text-shadow: none; +} +body:not(.theme-dark) .input-choice-popup .input-choice-lead, +body:not(.theme-dark) .input-choice-popup .input-choice-or, +body:not(.theme-dark) .upload-error-popup p, +body:not(.theme-dark) .upload-error-popup .upload-error-close, +body:not(.theme-dark) .payment-modal-message-text span { + color: var(--popup-text); +} +body:not(.theme-dark) .input-choice-popup .input-choice-other { + color: #007bff; +} +body:not(.theme-dark) .input-choice-popup .input-choice-error { + color: #c8322b; +} +body:not(.theme-dark) .payment-modal-link { + color: var(--popup-title); + background: rgb(255 255 255 / 80%); +} +body:not(.theme-dark) .payment-modal-link:hover { + color: var(--popup-title); + background: #fff; +} + +body:not(.theme-dark) .input-choice-popup button:focus-visible, +body:not(.theme-dark) .input-choice-popup input:focus-visible, +body:not(.theme-dark) .upload-error-popup button:focus-visible, +body:not(.theme-dark) .upload-error-popup a:focus-visible, +body:not(.theme-dark) .modal-payment button:focus-visible, +body:not(.theme-dark) .modal-payment a:focus-visible, +body:not(.theme-dark) .dp-dialog button:focus-visible { + outline: 2px solid var(--popup-focus); + outline-offset: 3px; +} +body:not(.theme-dark) .dp-input { + color: var(--popup-title); + background: #fff; + border-color: #ced4da; +} +body:not(.theme-dark) .dp-input::placeholder { color: #6c757d; } +body:not(.theme-dark) .dp-input:focus { border-color: #3d87e3; } +body:not(.theme-dark) .dp-input:focus-visible { + outline: 2px solid var(--popup-focus); + outline-offset: 2px; +} +body:not(.theme-dark) .dp-input.dp-invalid { border-color: #c8322b; } diff --git a/release/assets.json b/release/assets.json index 55d0ebd..5d3811b 100644 --- a/release/assets.json +++ b/release/assets.json @@ -3,6 +3,10 @@ "captured": "2026-10-21", "hashing": "SHA-256; SVG/CSS/HTML/webmanifest CRLF normalized to LF", "files": { + "popup-theme.css": { + "sha256": "4d8ed6e142dacf34da6d61394c8dee0297309a8eb570000cd8549bc0c920df4c", + "source": "api#353: approved popup light theme" + }, "1/01_desk_1-source.avif": { "sha256": "d81af6d3757d0e932af04d956cd4083e7c7c547c9fbac290d27f5ce8bbaede1c", "source": "https://zoomstage.online/1/01_desk_1-source.avif" diff --git a/template.php b/template.php index 8a7b095..8a7a4fb 100644 --- a/template.php +++ b/template.php @@ -50,6 +50,7 @@ +