Stable run with tailwind

This commit is contained in:
2026-07-18 12:08:14 +02:00
parent c9a5d3a79c
commit e3a735acda
116 changed files with 8230 additions and 66158 deletions
+99 -47
View File
@@ -1,79 +1,131 @@
@page "/terms"
@rendermode InteractiveServer
@page "/terms"
@namespace MidrandBooks.Components.Pages
@using Microsoft.AspNetCore.Components
@inject IJSRuntime JSRuntime
<div class="legal-page-container py-5">
<header class="legal-header mb-5">
<span class="text-uppercase font-monospace text-muted tracking-wider small d-block mb-1">Commercial Agreement</span>
<h1 class="legal-main-title fw-bold">Terms of Sale & Service</h1>
<p class="text-muted small font-monospace mt-2">
Midrand Books is a trading name for <strong>Lite Charms (Pty) Ltd</strong>, a private company incorporated and governed under the regulations of the Companies Act of the Republic of South Africa.
</p>
<div id="terms-razor" class="w-full max-w-7xl mx-auto px-4 sm:px-6 my-10 space-y-8 min-h-[600px] animate-in fade-in duration-300">
<!-- Header Hero Banner -->
<header class="relative overflow-hidden rounded-3xl border border-violet-500/30 bg-slate-900 p-8 md:p-12 shadow-xl flex flex-col justify-between gap-6">
<div class="absolute top-0 right-0 h-64 w-64 bg-violet-600/10 rounded-full blur-3xl pointer-events-none" />
<div class="absolute bottom-0 left-0 h-40 w-40 bg-indigo-600/10 rounded-full blur-2xl pointer-events-none" />
<div class="space-y-4 max-w-3xl relative z-10">
<div class="inline-flex items-center gap-1.5 px-3 py-1 rounded-full bg-violet-500/20 border border-violet-500/30 text-xs font-mono font-bold text-violet-300">
<svg class="h-3.5 w-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
</svg>
Commercial Legal Framework
</div>
<h1 class="font-serif text-3xl md:text-4xl font-black text-white tracking-tight">
Terms of Sale &amp; Service
</h1>
<p class="text-xs md:text-sm text-slate-300 leading-relaxed font-medium font-sans">
Midrand Books is designed, maintained, owned, and hosted by <strong class="text-violet-300">LiteCharms (PTY) Ltd</strong> (<a href="https://www.litecharms.co.za" target="_blank" rel="noopener noreferrer" class="text-violet-400 hover:text-violet-300 underline">www.litecharms.co.za</a>), a private corporation duly registered and governed in accordance with the corporate statutes of the Companies Act of the Republic of South Africa (Registration No: <span class="font-mono text-xs">2020/269438/07</span>).
</p>
</div>
</header>
<div class="row g-5">
<div class="col-lg-3 d-none d-lg-block">
<div class="legal-nav-index font-monospace text-uppercase small gap-3 d-flex flex-column">
<button @onclick='() => ScrollToSection("section-formation")' class="index-btn text-start">1. Contract Formation</button>
<button @onclick='() => ScrollToSection("section-pricing")' class="index-btn text-start">2. Currency & Pricing</button>
<button @onclick='() => ScrollToSection("section-logistics")' class="index-btn text-start">3. Delivery & Risk</button>
<button @onclick='() => ScrollToSection("section-cooling")' class="index-btn text-start">4. CPA Cooling-Off</button>
<button @onclick='() => ScrollToSection("section-liability")' class="index-btn text-start">5. Liability Shield</button>
<button @onclick='() => ScrollToSection("section-jurisdiction")' class="index-btn text-start">6. Jurisdiction</button>
<div class="grid grid-cols-1 lg:grid-cols-12 gap-8 items-start">
<!-- Sidebar Navigation Index -->
<div class="lg:col-span-3 lg:sticky lg:top-24 hidden lg:block">
<div class="rounded-2xl border border-white/10 bg-slate-900/60 backdrop-blur-md p-5 space-y-4 shadow-sm">
<span class="text-[10px] font-mono font-bold tracking-wider text-slate-400 uppercase block pb-2 border-b border-white/5">
Agreement Index
</span>
<nav class="flex flex-col gap-2 font-mono text-[11px] font-bold text-slate-300 uppercase">
<button @onclick='() => ScrollToSection("section-formation")' class="px-3 py-2.5 rounded-xl hover:bg-white/5 text-left transition-all hover:text-white cursor-pointer hover:pl-4">
1. Contract Formation
</button>
<button @onclick='() => ScrollToSection("section-pricing")' class="px-3 py-2.5 rounded-xl hover:bg-white/5 text-left transition-all hover:text-white cursor-pointer hover:pl-4">
2. Pricing &amp; VAT
</button>
<button @onclick='() => ScrollToSection("section-logistics")' class="px-3 py-2.5 rounded-xl hover:bg-white/5 text-left transition-all hover:text-white cursor-pointer hover:pl-4">
3. Delivery &amp; Risk
</button>
<button @onclick='() => ScrollToSection("section-cooling")' class="px-3 py-2.5 rounded-xl hover:bg-white/5 text-left transition-all hover:text-white cursor-pointer hover:pl-4">
4. CPA Cooling-Off
</button>
<button @onclick='() => ScrollToSection("section-liability")' class="px-3 py-2.5 rounded-xl hover:bg-white/5 text-left transition-all hover:text-white cursor-pointer hover:pl-4 text-rose-300 hover:text-rose-200">
5. Liability Shield
</button>
<button @onclick='() => ScrollToSection("section-jurisdiction")' class="px-3 py-2.5 rounded-xl hover:bg-white/5 text-left transition-all hover:text-white cursor-pointer hover:pl-4">
6. Jurisdiction
</button>
</nav>
</div>
</div>
<div class="col-lg-9">
<article class="legal-article-body">
<section id="section-formation" class="legal-section mb-5">
<h3 class="section-title">1. Electronic Contract Formation</h3>
<p>
By placing an order on this digital repository layout, you accept these Terms and Conditions in full. In accordance with Section 11 of the <strong>Electronic Communications and Transactions Act, No. 25 of 2002 (ECTA)</strong>, these terms are legally binding and enforceable from the second you submit an item request. An order request is only confirmed as a final contract of sale once funds are cleared and the physical inventory has been packed for transit by Lite Charms (Pty) Ltd.
<!-- Scrollable Legal Article Body -->
<div class="lg:col-span-9 space-y-6">
<div class="rounded-2xl border border-white/10 bg-slate-900/40 backdrop-blur-md p-6 sm:p-8 shadow-sm space-y-8 text-slate-200 text-xs sm:text-sm leading-relaxed">
<section id="section-formation" class="space-y-3 scroll-mt-28">
<h3 class="font-serif text-lg sm:text-xl font-bold text-white border-b border-white/5 pb-2">
1. Electronic Contract Formation
</h3>
<p class="font-medium text-slate-300">
By placing an order on this digital repository layout, you accept these Terms and Conditions in full. In accordance with Section 11 of the <strong class="text-white">Electronic Communications and Transactions Act, No. 25 of 2002 (ECTA)</strong>, these terms are legally binding and enforceable from the second you submit an item request. An order request is only confirmed as a final contract of sale once funds are cleared and the physical inventory has been packed for transit by LiteCharms (PTY) Ltd.
</p>
</section>
<section id="section-pricing" class="legal-section mb-5">
<h3 class="section-title">2. Currency, Value Added Tax, & Inventory Realism</h3>
<p>
All book pricing listed on our site is formatted exclusively in <strong>South African Rand (ZAR)</strong>. While we endeavor to ensure immaculate catalog records, typographical pricing errors may occasionally manifest due to currency valuation updates. In such rare anomalies, we explicitly retain the legal prerogative to cancel any affected items prior to dispatch and refund your transaction balance.
<section id="section-pricing" class="space-y-3 scroll-mt-28">
<h3 class="font-serif text-lg sm:text-xl font-bold text-white border-b border-white/5 pb-2">
2. Currency, Value Added Tax, &amp; Inventory Realism
</h3>
<p class="font-medium text-slate-300">
All book pricing listed on our site is formatted exclusively in <strong class="text-white">South African Rand (ZAR)</strong>. While we endeavor to ensure immaculate catalog records, typographical pricing errors may occasionally manifest due to currency valuation updates. In such rare anomalies, we explicitly retain the legal prerogative to cancel any affected items prior to dispatch and refund your transaction balance.
</p>
</section>
<section id="section-logistics" class="legal-section mb-5">
<h3 class="section-title">3. Logistics Dispatch & Risk Pass-Through</h3>
<p>
<section id="section-logistics" class="space-y-3 scroll-mt-28">
<h3 class="font-serif text-lg sm:text-xl font-bold text-white border-b border-white/5 pb-2">
3. Logistics Dispatch &amp; Risk Pass-Through
</h3>
<p class="font-medium text-slate-300">
Delivery fulfillment is handled via trusted independent third-party domestic courier providers. Ownership and operational risk concerning physical destruction, item degradation, or total package loss transit pass directly to the consumer at the immediate instant the shipment container leaves our local loading bay docks.
</p>
</section>
<section id="section-cooling" class="legal-section mb-5">
<h3 class="section-title">4. Statutory Returns & CPA Cooling-Off Windows</h3>
<p>
Pursuant to Section 44 of ECTA and the directives of the <strong>Consumer Protection Act, No. 68 of 2008 (CPA)</strong>, you maintain a statutory cooling-off window of <strong>seven (7) days</strong> following delivery receipt to cancel your transaction without justification, provided the items remain perfectly pristine, unread, and factory-sealed. Return logistics freight costs under a simple cooling-off exercise remain entirely the accountability of the purchaser.
<section id="section-cooling" class="space-y-3 scroll-mt-28">
<h3 class="font-serif text-lg sm:text-xl font-bold text-white border-b border-white/5 pb-2">
4. Statutory Returns &amp; CPA Cooling-Off Windows
</h3>
<p class="font-medium text-slate-300">
Pursuant to Section 44 of ECTA and the directives of the <strong class="text-white">Consumer Protection Act, No. 68 of 2008 (CPA)</strong>, you maintain a statutory cooling-off window of <strong class="text-white">seven (7) days</strong> following delivery receipt to cancel your transaction without justification, provided the items remain perfectly pristine, unread, and factory-sealed. Return logistics freight costs under a simple cooling-off exercise remain entirely the accountability of the purchaser.
</p>
</section>
<section id="section-liability" class="legal-section mb-5 protective-shield-callout">
<h3 class="section-title text-danger-serif">5. Complete Limitation of Liability Shield</h3>
<p class="fw-bold">
<section id="section-liability" class="space-y-3 scroll-mt-28 p-5 rounded-2xl bg-rose-500/10 border border-rose-500/20">
<h3 class="font-serif text-lg sm:text-xl font-bold text-rose-300 flex items-center gap-2">
<svg class="h-5.5 w-5.5 text-rose-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
</svg>
5. Complete Limitation of Liability Shield
</h3>
<p class="font-mono text-[10px] font-bold text-rose-400 uppercase tracking-wider block">
CRITICAL LEGAL CLAUSE — PLEASE READ CAREFULLY:
</p>
<p>
To the maximum limit permitted by Section 61 of the Consumer Protection Act, Lite Charms (Pty) Ltd, its underlying software system developers, and structural directors maintain zero liability for any direct, collateral, accidental, or punitive damages resulting from server connectivity breaks, digital database interruptions, payment handoff errors, or systemic down-times. We offer our catalog system entirely on an "As-Is" and "As-Available" functional framework.
<p class="font-semibold text-rose-100">
To the maximum limit permitted by Section 61 of the Consumer Protection Act, LiteCharms (PTY) Ltd, its underlying software system developers, and structural directors maintain zero liability for any direct, collateral, accidental, or punitive damages resulting from server connectivity breaks, digital database interruptions, payment handoff errors, or systemic down-times. We offer our catalog system entirely on an "As-Is" and "As-Available" functional framework.
</p>
</section>
<section id="section-jurisdiction" class="legal-section mb-5">
<h3 class="section-title">6. Governing Law & Jurisdiction</h3>
<p>
This commercial agreement, catalog usage framework, and transaction architecture are subject strictly to the laws and legal structures of the <strong>Republic of South Africa</strong>. Any disputes arising directly out of these digital terms shall be filed and litigated exclusively under the jurisdiction of the High Court of South Africa.
<section id="section-jurisdiction" class="space-y-3 scroll-mt-28">
<h3 class="font-serif text-lg sm:text-xl font-bold text-white border-b border-white/5 pb-2">
6. Governing Law &amp; Jurisdiction
</h3>
<p class="font-medium text-slate-300">
This commercial agreement, catalog usage framework, and transaction architecture are subject strictly to the laws and legal structures of the <strong class="text-white">Republic of South Africa</strong>. Any disputes arising directly out of these digital terms shall be filed and litigated exclusively under the jurisdiction of the High Court of South Africa.
</p>
</section>
</article>
</div>
</div>
</div>
</div>
@code {
@@ -86,4 +138,4 @@
}}
");
}
}
}