diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte index fb4cefe..9131a88 100644 --- a/frontend/src/App.svelte +++ b/frontend/src/App.svelte @@ -1439,6 +1439,9 @@ } function primaryPayActionLabel() { + if (!subscription.active && appSettings?.trial_enabled && appSettings?.trial_available) { + return t("wa_pay_full_subscription", {}, "Оплатить полную подписку"); + } if (trafficMode || selectedPlan?.sale_mode === "traffic_package") return t("wa_buy_traffic"); return subscription.active ? t("wa_renew") : t("wa_pay_subscription"); } diff --git a/frontend/src/styles/webapp.css b/frontend/src/styles/webapp.css index 1fc1fbc..61e199d 100644 --- a/frontend/src/styles/webapp.css +++ b/frontend/src/styles/webapp.css @@ -467,12 +467,21 @@ a { } .trial-card { - padding: 13px 14px; + display: grid; + gap: 12px; + padding: 14px; +} + +.trial-offer-card { + border-color: color-mix(in srgb, var(--accent) 36%, var(--border)); + background: + linear-gradient(135deg, color-mix(in srgb, var(--accent) 11%, transparent), transparent 48%), + linear-gradient(135deg, var(--surface-sheen), var(--surface-sheen-soft)); } .trial-card-head { display: flex; - align-items: center; + align-items: flex-start; gap: 11px; } @@ -498,6 +507,46 @@ a { line-height: 1.28; } +.trial-card-description { + margin: 0; + color: var(--muted); + font-size: 12px; + line-height: 1.42; +} + +.trial-card-facts { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 8px; +} + +.trial-card-facts span { + display: grid; + gap: 3px; + min-width: 0; + padding: 9px 10px; + border: 1px solid var(--surface-subtle-border); + border-radius: 12px; + background: var(--surface-subtle); +} + +.trial-card-facts small { + color: var(--muted); + font-size: 10px; + line-height: 1.2; +} + +.trial-card-facts strong { + overflow-wrap: anywhere; + color: var(--text); + font-size: 12px; + line-height: 1.2; +} + +.trial-card-action { + margin-top: 2px; +} + .devices-summary-card { display: grid; gap: 10px; diff --git a/frontend/src/webapp/screens/HomeScreen.svelte b/frontend/src/webapp/screens/HomeScreen.svelte index c34f032..579264b 100644 --- a/frontend/src/webapp/screens/HomeScreen.svelte +++ b/frontend/src/webapp/screens/HomeScreen.svelte @@ -69,6 +69,17 @@ const limit = Number(appSettings?.trial_traffic_limit_gb || 0); return limit > 0 ? formatTrafficGb(limit) : t("wa_unlimited_traffic"); } + function trialDurationLabel() { + const days = Number(appSettings?.trial_duration_days || 0); + return t("wa_sub_term_value_unit", { + value: days, + unit: termUnitLabel(days, "day"), + }); + } + + $: trialOfferAvailable = Boolean( + !subscription?.active && appSettings?.trial_enabled && appSettings?.trial_available + ); export let activateTrial = () => {}; export let openConnectLink = () => {}; @@ -214,20 +225,36 @@ {/if} - {:else if appSettings?.trial_enabled && appSettings?.trial_available} - + {:else if trialOfferAvailable} +
- {t("wa_trial_title")} - {t("wa_trial_details", { - days: Number(appSettings?.trial_duration_days || 0), - traffic: trialTrafficLabel(), - })} + {t("wa_trial_offer_title", {}, "Можно начать с льготного периода")} + {t("wa_trial_title")}
+

+ {t( + "wa_trial_offer_description", + { duration: trialDurationLabel(), traffic: trialTrafficLabel() }, + "Активируйте триал: {duration} доступа и {traffic} для скачивания без оплаты." + )} +

+
+ + {t("wa_trial_duration_label", {}, "Срок")} + {trialDurationLabel()} + + + {t("wa_trial_download_traffic_label", {}, "Доступно для скачивания")} + {trialTrafficLabel()} + +
+
{/if} @@ -250,12 +277,6 @@ {/if} {primaryPayActionLabel()} - {#if !subscription.active && appSettings?.trial_enabled && appSettings?.trial_available} - - {/if} {#if canChangeTariff}