fix: pricing section toggle and translation fallbacks
1. Fix monthly/annual toggle:
- Price suffix now changes between /month and /year using Alpine.js
- Added € currency symbol to prices
2. Fix language translations:
- Section title/subtitle now fall back to locale files when CMS
content doesn't have translations for the selected language
- Uses cms.platform.pricing.title and .subtitle from locale files
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -12,23 +12,23 @@
|
||||
{% if pricing and pricing.enabled %}
|
||||
<section id="pricing" class="py-16 lg:py-24 bg-gray-50 dark:bg-gray-900">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
{# Section header #}
|
||||
{# Section header - tries CMS content first, falls back to locale files #}
|
||||
<div class="text-center mb-12">
|
||||
{% set title = pricing.title.translations.get(lang) or pricing.title.translations.get(default_lang) or '' %}
|
||||
{% if title %}
|
||||
{% set title = (pricing.title.translations.get(lang) if pricing.title and pricing.title.translations else none)
|
||||
or (pricing.title.translations.get(default_lang) if pricing.title and pricing.title.translations else none)
|
||||
or _('cms.platform.pricing.title') or 'Simple, Transparent Pricing' %}
|
||||
<h2 class="text-3xl md:text-4xl font-bold text-gray-900 dark:text-white mb-4">
|
||||
{{ title }}
|
||||
</h2>
|
||||
{% endif %}
|
||||
|
||||
{% if pricing.subtitle and pricing.subtitle.translations %}
|
||||
{% set subtitle = pricing.subtitle.translations.get(lang) or pricing.subtitle.translations.get(default_lang) %}
|
||||
{% set subtitle = (pricing.subtitle.translations.get(lang) if pricing.subtitle and pricing.subtitle.translations else none)
|
||||
or (pricing.subtitle.translations.get(default_lang) if pricing.subtitle and pricing.subtitle.translations else none)
|
||||
or _('cms.platform.pricing.subtitle') or '' %}
|
||||
{% if subtitle %}
|
||||
<p class="text-lg text-gray-600 dark:text-gray-400 max-w-2xl mx-auto">
|
||||
{{ subtitle }}
|
||||
</p>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{# Pricing toggle (monthly/annual) #}
|
||||
@@ -73,11 +73,13 @@
|
||||
|
||||
{# Price #}
|
||||
<div class="mb-6">
|
||||
<span class="text-4xl font-extrabold text-gray-900 dark:text-white"
|
||||
x-text="annual ? '{{ tier.price_annual or (tier.price_monthly * 10)|int }}' : '{{ tier.price_monthly }}'">
|
||||
{{ tier.price_monthly }}
|
||||
<span class="text-4xl font-extrabold text-gray-900 dark:text-white">
|
||||
€<span x-text="annual ? '{{ tier.price_annual or (tier.price_monthly * 10)|int }}' : '{{ tier.price_monthly }}'">{{ tier.price_monthly }}</span>
|
||||
</span>
|
||||
<span class="text-gray-500 dark:text-gray-400"
|
||||
x-text="annual ? '{{ _('cms.platform.pricing.per_year') or '/year' }}' : '{{ _('cms.platform.pricing.per_month') or '/month' }}'">
|
||||
{{ _('cms.platform.pricing.per_month') or '/month' }}
|
||||
</span>
|
||||
<span class="text-gray-500 dark:text-gray-400">{{ _('cms.platform.pricing.per_month') or '/month' }}</span>
|
||||
</div>
|
||||
|
||||
{# CTA button #}
|
||||
|
||||
Reference in New Issue
Block a user