front end fixes

This commit is contained in:
Mark Gregory
2026-07-27 07:37:11 +01:00
parent 0be7be48e7
commit 108f95dbfa
21 changed files with 687 additions and 423 deletions
File diff suppressed because one or more lines are too long
+87 -2
View File
@@ -1,9 +1,9 @@
{
"name": "Saasland",
"slug": "saasland",
"version": "1.1.0",
"version": "1.2.0",
"author": "ABSDEV",
"description": "Dark SaaS marketing theme with integrated feature, pricing, privacy and terms sections.",
"description": "Configurable premium SaaS frontend with CMS-driven content, pricing, blog, news, team, testimonials, FAQ and newsletter sections.",
"entry_view": "home",
"stylesheet": "css/theme.css",
"script": "js/app.js",
@@ -86,6 +86,91 @@
"type": "url",
"label": "LinkedIn URL",
"default": ""
},
"hero_eyebrow": {
"type": "text",
"label": "Hero eyebrow",
"default": "A better way to run your business"
},
"hero_description": {
"type": "textarea",
"label": "Hero description",
"default": "Streamline operations, boost productivity, and improve customer satisfaction with one connected platform built for modern teams."
},
"primary_cta_label": {
"type": "text",
"label": "Primary button label",
"default": "Get started free"
},
"primary_cta_url": {
"type": "text",
"label": "Primary button URL",
"default": "/register"
},
"secondary_cta_label": {
"type": "text",
"label": "Secondary button label",
"default": "Book demo"
},
"secondary_cta_url": {
"type": "text",
"label": "Secondary button URL",
"default": "#contact"
},
"show_metrics": {
"type": "checkbox",
"label": "Show performance preview",
"default": true
},
"show_features": {
"type": "checkbox",
"label": "Show features",
"default": true
},
"show_pricing": {
"type": "checkbox",
"label": "Show pricing",
"default": true
},
"show_testimonials": {
"type": "checkbox",
"label": "Show testimonials",
"default": true
},
"show_team": {
"type": "checkbox",
"label": "Show team",
"default": false
},
"show_blog": {
"type": "checkbox",
"label": "Show blog",
"default": true
},
"show_news": {
"type": "checkbox",
"label": "Show news",
"default": true
},
"show_faq": {
"type": "checkbox",
"label": "Show FAQ",
"default": true
},
"show_newsletter": {
"type": "checkbox",
"label": "Show newsletter signup",
"default": true
},
"cta_title": {
"type": "text",
"label": "Final CTA title",
"default": "Ready to transform your business?"
},
"cta_description": {
"type": "text",
"label": "Final CTA description",
"default": "Start building a faster, more connected operation today."
}
},
"seo": {
+57 -373
View File
@@ -3,386 +3,70 @@
@php($description = $siteDescription)
@php($hero = true)
@section('content')
<section class="hero">
<div class="glow one"></div>
<div class="glow two"></div>
@php
$enabled = fn (string $key, bool $default = true) => filter_var($themeSettings[$key] ?? $default, FILTER_VALIDATE_BOOL);
$heroTitle = filled($themeSettings['hero_title'] ?? null) ? $themeSettings['hero_title'] : 'Transform Your Business With Our SaaS Solution';
$heroText = filled($themeSettings['hero_description'] ?? null) ? $themeSettings['hero_description'] : 'Streamline operations, boost productivity, and improve customer satisfaction with one connected platform built for modern teams.';
@endphp
<section class="hero">
<div class="glow one"></div><div class="glow two"></div>
<div class="wrap hero-inner">
<span class="eyebrow">{{ $themeSettings['hero_eyebrow'] ?? 'A better way to run your business' }}</span>
<h1>{{ $heroTitle }}</h1>
<p>{{ $heroText }}</p>
<div class="actions">
<a class="btn primary" href="{{ $themeSettings['primary_cta_url'] ?? (Route::has('register') ? route('register') : '#contact') }}">{{ $themeSettings['primary_cta_label'] ?? 'Get started free' }} →</a>
<a class="btn secondary" href="{{ $themeSettings['secondary_cta_url'] ?? '#contact' }}">{{ $themeSettings['secondary_cta_label'] ?? 'Book demo' }}</a>
</div>
@if($enabled('show_metrics', true))
<div class="dashboard">
<div class="dash-top"><b>Performance overview</b><span>Live</span></div>
<div class="metrics"><article><small>Monthly revenue</small><strong>£48,240</strong><em>+18.4%</em></article><article><small>Active users</small><strong>12,842</strong><em>+9.2%</em></article><article><small>Conversion</small><strong>7.8%</strong><em>+2.1%</em></article></div>
<div class="chart" aria-label="Performance chart"><i style="height:28%"></i><i style="height:42%"></i><i style="height:35%"></i><i style="height:62%"></i><i style="height:54%"></i><i style="height:78%"></i><i style="height:92%"></i></div>
</div>
@endif
</div>
</section>
<div class="wrap hero-inner">
<span class="eyebrow">Introducing Saasland 2.0</span>
@if($enabled('show_features', true))
<section class="section" id="features"><div class="wrap"><div class="heading"><span>Powerful features</span><h2>Everything your team needs to grow</h2><p>Planning, collaboration, reporting, publishing, commerce and customer insight in one extensible platform.</p></div><div class="grid three">
@foreach([['Smart automation','Remove repetitive work and delays.'],['Real-time analytics','Turn activity into useful business insight.'],['Content operations','Create, review and publish confidently.'],['Secure by design','Protect users and data with dependable controls.'],['Flexible integrations','Connect the tools your organisation already uses.'],['Modular architecture','Activate only the capabilities each site needs.']] as $i => $feature)
<article class="card"><b>{{ str_pad((string)($i+1),2,'0',STR_PAD_LEFT) }}</b><h3>{{ $feature[0] }}</h3><p>{{ $feature[1] }}</p></article>
@endforeach
</div></div></section>
@endif
<h1>
Transform Your Business With Our
<span>SaaS Solution</span>
</h1>
@if($enabled('show_pricing', true) && $pricingPlans->isNotEmpty())
<section class="section alt" id="pricing"><div class="wrap"><div class="heading"><span>Simple pricing</span><h2>Choose a plan that fits</h2><p>Plans are managed from Products & Pricing in the CMS.</p></div><div class="grid three pricing">
@foreach($pricingPlans as $plan)
<article class="card plan {{ $plan->is_featured ? 'featured' : '' }}">@if($plan->is_featured)<div class="popular">Most popular</div>@endif<h3>{{ $plan->name }}</h3><strong>@if($plan->price !== null){{ $plan->currency === 'GBP' ? '£' : $plan->currency.' ' }}{{ rtrim(rtrim(number_format((float)$plan->price,2), '0'), '.') }}<small>/{{ $plan->billing_period ?: 'month' }}</small>@else Custom @endif</strong><p>{{ $plan->description }}</p><ul>@foreach((array)$plan->features as $feature)<li>{{ $feature }}</li>@endforeach</ul><a class="btn {{ $plan->is_featured ? 'primary' : 'secondary' }}" href="{{ $plan->cta_url ?: '#contact' }}">{{ $plan->cta_label ?: 'Learn more' }}</a></article>
@endforeach
</div></div></section>
@endif
<p>
Streamline operations, boost productivity, and improve customer satisfaction
with one connected platform built for modern teams.
</p>
@if($enabled('show_testimonials', true) && $testimonials->isNotEmpty())
<section class="section"><div class="wrap"><div class="heading"><span>Customer stories</span><h2>Trusted by ambitious teams</h2></div><div class="grid three">@foreach($testimonials as $testimonial)<blockquote class="card">“{{ $testimonial->content }}”<footer>{{ $testimonial->name }}@if($testimonial->company) · {{ $testimonial->company }}@endif</footer></blockquote>@endforeach</div></div></section>
@endif
<div class="actions">
<a class="btn primary" href="#pricing">Get Started Free →</a>
<a class="btn secondary" href="#contact">Book Demo</a>
</div>
@if($enabled('show_team', false) && $teamMembers->isNotEmpty())
<section class="section alt"><div class="wrap"><div class="heading"><span>Our team</span><h2>People behind the platform</h2></div><div class="grid three">@foreach($teamMembers as $member)<article class="card"><h3>{{ $member->name }}</h3><b>{{ $member->job_title }}</b><p>{{ $member->biography }}</p></article>@endforeach</div></div></section>
@endif
<div class="trust">
<div class="avatars" aria-hidden="true">
<i>A</i>
<i>B</i>
<i>C</i>
</div>
<small><b>500+</b> businesses already use our platform</small>
</div>
@if($enabled('show_blog', true) && $latestBlogPosts->isNotEmpty())
<section class="section"><div class="wrap"><div class="heading"><span>Insights</span><h2>Latest from the blog</h2></div><div class="grid three">@foreach($latestBlogPosts as $post)<article class="card"><b>{{ optional($post->published_at)->format('d M Y') }}</b><h3>{{ $post->title }}</h3><p>{{ $post->excerpt }}</p><a class="read-more" href="{{ route('blog.public.show',$post->slug) }}">Read article →</a></article>@endforeach</div></div></section>
@endif
<div class="dashboard">
<div class="dash-top">
<b>Performance overview</b>
<span>Live</span>
</div>
@if($enabled('show_news', true) && $latestNewsArticles->isNotEmpty())
<section class="section alt"><div class="wrap"><div class="heading"><span>Newsroom</span><h2>Latest news</h2></div><div class="grid three">@foreach($latestNewsArticles as $article)<article class="card"><b>{{ optional($article->published_at)->format('d M Y') }}</b><h3>{{ $article->title }}</h3><p>{{ $article->excerpt }}</p><a class="read-more" href="{{ route('news.public.show',$article->slug) }}">Read update →</a></article>@endforeach</div></div></section>
@endif
<div class="metrics">
<article>
<small>Monthly revenue</small>
<strong>£48,240</strong>
<em>+18.4%</em>
</article>
<article>
<small>Active users</small>
<strong>12,842</strong>
<em>+9.2%</em>
</article>
<article>
<small>Conversion</small>
<strong>7.8%</strong>
<em>+2.1%</em>
</article>
</div>
@if($enabled('show_faq', true) && $faqs->isNotEmpty())
<section class="section"><div class="wrap faq"><div><span class="section-label">FAQ</span><h2>Answers before you begin</h2></div><div>@foreach($faqs as $faq)<article><button type="button" @click="openFaq = openFaq === {{ $faq->id }} ? null : {{ $faq->id }}">{{ $faq->question }}<span>+</span></button><p x-cloak x-show="openFaq === {{ $faq->id }}">{{ $faq->answer }}</p></article>@endforeach</div></div></section>
@endif
<div class="chart" aria-label="Performance chart">
<i style="height: 28%"></i>
<i style="height: 42%"></i>
<i style="height: 35%"></i>
<i style="height: 62%"></i>
<i style="height: 54%"></i>
<i style="height: 78%"></i>
<i style="height: 92%"></i>
</div>
</div>
</div>
</section>
@if($enabled('show_newsletter', true))
<section class="section alt"><div class="wrap"><div class="content-card newsletter-panel"><div><span class="section-label">Newsletter</span><h2>Useful updates, no noise</h2><p>Receive product news, publishing guidance, and practical platform updates.</p></div><form method="POST" action="{{ route('newsletter.public.subscribe') }}">@csrf<input type="email" name="email" required placeholder="you@example.com" aria-label="Email address"><button class="btn primary" type="submit">Subscribe</button></form></div></div></section>
@endif
<section class="section" id="features">
<div class="wrap">
<div class="heading">
<span>Powerful features</span>
<h2>Everything your team needs to grow</h2>
<p>
Move faster with flexible tools that bring planning, collaboration,
reporting, and customer insight into one workspace.
</p>
</div>
<div class="grid three">
<article class="card">
<b>01</b>
<h3>Smart automation</h3>
<p>Automate routine processes and let your team focus on work that creates value.</p>
</article>
<article class="card">
<b>02</b>
<h3>Real-time analytics</h3>
<p>Understand performance instantly with useful dashboards and actionable reporting.</p>
</article>
<article class="card">
<b>03</b>
<h3>Team collaboration</h3>
<p>Keep discussions, decisions, documents, and delivery aligned in one place.</p>
</article>
<article class="card">
<b>04</b>
<h3>Secure by design</h3>
<p>Protect business data with robust access controls and dependable infrastructure.</p>
</article>
<article class="card">
<b>05</b>
<h3>Easy integrations</h3>
<p>Connect the services you already use without rebuilding your existing workflow.</p>
</article>
<article class="card">
<b>06</b>
<h3>Priority support</h3>
<p>Get expert assistance when you need it from a team that understands your goals.</p>
</article>
</div>
</div>
</section>
<section class="section alt" id="roadmap">
<div class="wrap split">
<div>
<span class="section-label">Built for momentum</span>
<h2>From first idea to measurable growth</h2>
<p>
Launch quickly, learn from every interaction, and scale with confidence
using a platform designed around clear outcomes.
</p>
<ul class="checks">
<li>Fast, guided onboarding</li>
<li>Custom workflows for every team</li>
<li>Live performance and usage insight</li>
<li>Enterprise-ready controls</li>
</ul>
</div>
<div class="roadmap">
<article>
<span>01</span>
<div>
<h3>Connect</h3>
<p>Bring your data and tools together.</p>
</div>
</article>
<article>
<span>02</span>
<div>
<h3>Automate</h3>
<p>Remove repetitive work and delays.</p>
</div>
</article>
<article>
<span>03</span>
<div>
<h3>Optimise</h3>
<p>Use evidence to improve every cycle.</p>
</div>
</article>
</div>
</div>
</section>
<section class="section" id="pricing">
<div class="wrap">
<div class="heading">
<span>Simple pricing</span>
<h2>Choose a plan that fits</h2>
</div>
<div class="grid three pricing">
<article class="card plan">
<h3>Starter</h3>
<strong>£19<small>/month</small></strong>
<p>For individuals and small teams getting started.</p>
<ul>
<li>5 team members</li>
<li>Core analytics</li>
<li>Email support</li>
</ul>
<a class="btn secondary" href="#contact">Start free</a>
</article>
<article class="card plan featured">
<div class="popular">Most popular</div>
<h3>Growth</h3>
<strong>£49<small>/month</small></strong>
<p>For growing businesses that need more control.</p>
<ul>
<li>25 team members</li>
<li>Advanced analytics</li>
<li>Automations</li>
<li>Priority support</li>
</ul>
<a class="btn primary" href="#contact">Choose Growth</a>
</article>
<article class="card plan">
<h3>Scale</h3>
<strong>Custom</strong>
<p>For established organisations with complex needs.</p>
<ul>
<li>Unlimited members</li>
<li>Custom integrations</li>
<li>Dedicated success manager</li>
</ul>
<a class="btn secondary" href="#contact">Contact sales</a>
</article>
</div>
</div>
</section>
<section class="section alt">
<div class="wrap">
<div class="heading">
<span>Customer stories</span>
<h2>Trusted by ambitious teams</h2>
</div>
<div class="grid three">
<blockquote class="card">
“Saasland gave us one clear view of the business and cut reporting time dramatically.”
<footer>Alex Morgan · Northstar</footer>
</blockquote>
<blockquote class="card">
“Our onboarding is faster, our handoffs are cleaner, and the team finally works from the same data.”
<footer>Priya Shah · Lumina</footer>
</blockquote>
<blockquote class="card">
“We launched in days and had enough insight to improve conversion in the first month.”
<footer>Daniel Reed · Orbit</footer>
</blockquote>
</div>
</div>
</section>
<section class="section">
<div class="wrap faq">
<div>
<span class="section-label">FAQ</span>
<h2>Answers before you begin</h2>
</div>
<div>
<article>
<button type="button" @click="openFaq = openFaq === 1 ? null : 1">
Can I try Saasland free?
<span>+</span>
</button>
<p x-show="openFaq === 1">
Yes. Start with a free trial and move to a paid plan when your team is ready.
</p>
</article>
<article>
<button type="button" @click="openFaq = openFaq === 2 ? null : 2">
Can I change plans later?
<span>+</span>
</button>
<p x-show="openFaq === 2">
You can upgrade or change your plan as your requirements evolve.
</p>
</article>
<article>
<button type="button" @click="openFaq = openFaq === 3 ? null : 3">
Does it integrate with existing tools?
<span>+</span>
</button>
<p x-show="openFaq === 3">
Yes. Saasland is designed to connect with common business platforms and custom services.
</p>
</article>
</div>
</div>
</section>
<section class="section alt legal-area" id="privacy">
<div class="wrap">
<div class="heading">
<span>Privacy</span>
<h2>Your data, handled responsibly</h2>
<p>
We collect only the information needed to provide, secure, and improve
Saasland. We do not sell your personal information.
</p>
</div>
<div class="grid three legal-grid">
<article class="card legal-card">
<b>01</b>
<h3>Information we collect</h3>
<p>
Account details, contact information, billing records, product usage,
support messages, and technical data such as browser and device details.
</p>
</article>
<article class="card legal-card">
<b>02</b>
<h3>How we use it</h3>
<p>
To operate the service, process payments, protect accounts, provide
support, improve features, and meet legal obligations.
</p>
</article>
<article class="card legal-card">
<b>03</b>
<h3>Your choices</h3>
<p>
You may request access, correction, export, or deletion of your data,
and you can change communication preferences at any time.
</p>
</article>
</div>
<div class="legal-note">
<strong>Privacy contact</strong>
<p>
Questions about privacy can be sent to
<a href="mailto:privacy@example.com">privacy@example.com</a>.
</p>
</div>
</div>
</section>
<section class="section legal-area" id="terms">
<div class="wrap">
<div class="heading">
<span>Terms</span>
<h2>Clear terms for using Saasland</h2>
<p>
By creating an account or using the service, you agree to use Saasland
lawfully and in accordance with these core terms.
</p>
</div>
<div class="grid three legal-grid">
<article class="card legal-card">
<b>01</b>
<h3>Account responsibilities</h3>
<p>
Keep account details accurate, protect login credentials, and ensure
activity under your account follows applicable laws and these terms.
</p>
</article>
<article class="card legal-card">
<b>02</b>
<h3>Subscriptions and billing</h3>
<p>
Paid plans renew according to the selected billing period. Fees are due
when stated and plan changes take effect under the displayed terms.
</p>
</article>
<article class="card legal-card">
<b>03</b>
<h3>Acceptable use</h3>
<p>
Do not misuse the platform, interfere with service availability, access
data without permission, or use Saasland for unlawful activity.
</p>
</article>
</div>
<div class="legal-note">
<strong>Legal contact</strong>
<p>
Questions about these terms can be sent to
<a href="mailto:legal@example.com">legal@example.com</a>.
</p>
</div>
</div>
</section>
<section class="cta" id="contact">
<div class="wrap">
<h2>Ready to transform your business?</h2>
<p>Start building a faster, more connected operation today.</p>
@auth
<a class="btn light" href="{{ route('dashboard') }}">Open dashboard →</a>
@else
@if (Route::has('register'))
<a class="btn light" href="{{ route('register') }}">Get started free →</a>
@endif
@endauth
</div>
</section>
<section class="cta" id="contact"><div class="wrap"><h2>{{ $themeSettings['cta_title'] ?? 'Ready to transform your business?' }}</h2><p>{{ $themeSettings['cta_description'] ?? 'Start building a faster, more connected operation today.' }}</p>@auth<a class="btn light" href="{{ route('dashboard') }}">Open dashboard →</a>@else @if(Route::has('register'))<a class="btn light" href="{{ route('register') }}">Get started free →</a>@endif @endauth</div></section>
@endsection
@@ -1,10 +1,11 @@
@php
$title = $title ?? null;
$description = $description ?? null;
$eyebrow = $eyebrow ?? null;
$hero = $hero ?? false;
$breadcrumbs = $breadcrumbs ?? [];
@endphp
@props([
'title' => null,
'description' => null,
'eyebrow' => null,
'hero' => false,
'breadcrumbs' => [],
])
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" id="top">
<head>
@@ -49,7 +50,7 @@
@endunless
<main class="{{ $hero ? 'marketing-main' : 'page-main' }}">
@yield('content')
{{ $slot }}
</main>
@include('stylist-theme-saasland::partials.footer')