diff --git a/backend/app/views/layouts/marketing.html.erb b/backend/app/views/layouts/marketing.html.erb index ab7f636..c3d1e43 100644 --- a/backend/app/views/layouts/marketing.html.erb +++ b/backend/app/views/layouts/marketing.html.erb @@ -6,7 +6,7 @@ <%= content_for?(:title) ? yield(:title) : "Match Live TV" %> <%= render "shared/meta_tags" %> - + <%= render "shared/marketing_nav" %> diff --git a/backend/app/views/layouts/marketing_live.html.erb b/backend/app/views/layouts/marketing_live.html.erb index 5ef5573..5400857 100644 --- a/backend/app/views/layouts/marketing_live.html.erb +++ b/backend/app/views/layouts/marketing_live.html.erb @@ -6,7 +6,7 @@ <%= content_for?(:title) ? yield(:title) : "Match Live TV" %> <%= render "shared/meta_tags" %> - + <%= yield :head %> diff --git a/backend/app/views/shared/_plan_cards.html.erb b/backend/app/views/shared/_plan_cards.html.erb index 00573f8..a91a7f2 100644 --- a/backend/app/views/shared/_plan_cards.html.erb +++ b/backend/app/views/shared/_plan_cards.html.erb @@ -14,7 +14,8 @@ stripe_subscription_active: stripe_subscription_active?(subscription), current_interval: current_interval ) : nil %> -
"> + <% featured = billing_mode ? (plan.slug == current_slug) : (plan.slug == "premium_light") %> +
">

<%= plan.name %>

<% if plan.slug == "free" %>
€0
diff --git a/backend/public/marketing.css b/backend/public/marketing.css index c6eef7c..234b211 100644 --- a/backend/public/marketing.css +++ b/backend/public/marketing.css @@ -918,12 +918,40 @@ body.nav-menu-open { overflow: hidden; } object-fit: contain; filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.5)); } -.plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; margin-top: 24px; } -.plan-card { background: #14141c; border: 1px solid #2a2a36; border-radius: 14px; padding: 24px; } -.plan-card.featured { border-color: #e53935; } +.plans { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); + gap: 20px; + margin-top: 24px; + align-items: stretch; +} +.plan-card { + display: flex; + flex-direction: column; + height: 100%; + background: #14141c; + border: 1px solid #2a2a36; + border-radius: 14px; + padding: 24px; + box-sizing: border-box; +} +.plan-card.featured { + border-color: #2a2a36; + box-shadow: 0 0 0 2px #e53935; +} .plan-card h3 { margin: 0 0 8px; } .plan-price { font-size: 1.8rem; font-weight: 800; margin: 12px 0; } -.plan-card ul { padding-left: 18px; color: #bbb; margin: 0 0 20px; } +.plan-card ul { + flex: 1 1 auto; + padding-left: 18px; + color: #bbb; + margin: 0 0 20px; +} +.plan-card > .btn, +.plan-card > .plan-action-hint, +.plan-card > .plan-interval-actions { + margin-top: auto; +} .features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; } .feature-card { background: #14141c; border-radius: 12px; padding: 20px; border: 1px solid #2a2a36; } .feature-card h3 { margin: 0 0 8px; font-size: 1.05rem; }