mirror of
https://github.com/alam00000/bentopdf.git
synced 2026-09-23 02:04:51 +02:00
feat: add Kura and Hyper Compress product pages, redesign site
This commit is contained in:
alam00000
+142
-178
@@ -51,6 +51,7 @@
|
||||
<meta name="twitter:site" content="@BentoPDF" />
|
||||
|
||||
<link href="/src/css/styles.css" rel="stylesheet" />
|
||||
<link href="/src/css/landing.css" rel="stylesheet" />
|
||||
|
||||
<!-- Web App Manifest -->
|
||||
<link rel="manifest" href="/site.webmanifest" />
|
||||
@@ -77,186 +78,144 @@
|
||||
<link rel="icon" href="/favicon.ico" sizes="32x32" />
|
||||
</head>
|
||||
|
||||
<body class="antialiased bg-gray-900 text-gray-300">
|
||||
<body class="lp antialiased">
|
||||
{{> navbar }}
|
||||
|
||||
<div id="app" class="min-h-screen container mx-auto p-4 md:p-8">
|
||||
<section id="about-hero" class="text-center py-16 md:py-24">
|
||||
<h1 class="text-3xl md:text-6xl font-bold text-white mb-4">
|
||||
<span data-i18n="about.hero.title"
|
||||
>We believe PDF tools should be</span
|
||||
>
|
||||
<span class="marker-slanted" data-i18n="about.hero.subtitle"
|
||||
>fast, private, and free.</span
|
||||
>
|
||||
</h1>
|
||||
<p
|
||||
class="text-lg md:text-xl text-gray-400"
|
||||
data-i18n="about.hero.noCompromises"
|
||||
>
|
||||
No compromises.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<div class="section-divider"></div>
|
||||
|
||||
<section id="mission-section" class="py-16 max-w-4xl mx-auto">
|
||||
<div class="text-center">
|
||||
<i
|
||||
data-lucide="rocket"
|
||||
class="w-16 h-16 text-indigo-400 mx-auto mb-6"
|
||||
></i>
|
||||
<h2
|
||||
class="text-3xl md:text-4xl font-bold text-white mb-4"
|
||||
data-i18n="about.mission.title"
|
||||
>
|
||||
Our Mission
|
||||
</h2>
|
||||
<p
|
||||
class="text-lg text-gray-400 leading-relaxed"
|
||||
data-i18n="about.mission.description"
|
||||
>
|
||||
To provide the most comprehensive PDF toolbox that respects your
|
||||
privacy and never asks for payment. We believe essential document
|
||||
tools should be accessible to everyone, everywhere, without
|
||||
barriers.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div
|
||||
class="bg-gray-800 rounded-xl p-8 md:p-12 my-16 border border-gray-700"
|
||||
>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-12 items-center">
|
||||
<div class="text-center md:text-left">
|
||||
<span
|
||||
class="text-indigo-400 font-bold uppercase"
|
||||
data-i18n="about.philosophy.label"
|
||||
>Our Core Philosophy</span
|
||||
>
|
||||
<h2
|
||||
class="text-3xl md:text-4xl font-bold text-white mt-2 mb-4"
|
||||
data-i18n="about.philosophy.title"
|
||||
>
|
||||
Privacy First. Always.
|
||||
</h2>
|
||||
<p
|
||||
class="text-gray-400 leading-relaxed"
|
||||
data-i18n="about.philosophy.description"
|
||||
>
|
||||
In an era where data is a commodity, we take a different approach.
|
||||
All processing for BentoPDF tools happens locally in your browser.
|
||||
This means your files never touch our servers, we never see your
|
||||
documents, and we don't track what you do. Your documents remain
|
||||
completely and unequivocally private. It's not just a feature;
|
||||
it's our foundation.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex justify-center">
|
||||
<div class="relative w-48 h-48">
|
||||
<div
|
||||
class="absolute inset-0 bg-indigo-500 rounded-full opacity-20 animate-pulse"
|
||||
></div>
|
||||
<div
|
||||
class="absolute inset-4 bg-indigo-500 rounded-full opacity-30 animate-pulse delay-500"
|
||||
></div>
|
||||
<i
|
||||
data-lucide="shield-check"
|
||||
class="w-48 h-48 text-indigo-400"
|
||||
></i>
|
||||
<div id="app">
|
||||
<section id="about-hero" class="lp-sec lp-sec--first">
|
||||
<div class="lp-frame">
|
||||
<div class="lp-head lp-head--center">
|
||||
<div>
|
||||
<h1 class="lp-h2">
|
||||
<span class="line" data-i18n="about.hero.title"
|
||||
>We believe PDF tools should be</span
|
||||
>
|
||||
<span class="line dim" data-i18n="about.hero.subtitle"
|
||||
>fast, private, and free.</span
|
||||
>
|
||||
</h1>
|
||||
<p class="lp-head-p" data-i18n="about.hero.noCompromises">
|
||||
No compromises.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="why-Bentopdf" class="py-16">
|
||||
<h2 class="text-3xl md:text-4xl font-bold text-center text-white mb-12">
|
||||
<span data-i18n="about.whyBentopdf.title">Why</span>
|
||||
<span class="marker-slanted">BentoPDF?</span>
|
||||
</h2>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-5xl mx-auto">
|
||||
<div class="bg-gray-800 p-6 rounded-lg flex items-start gap-4">
|
||||
<i
|
||||
data-lucide="zap"
|
||||
class="w-10 h-10 text-indigo-400 flex-shrink-0 mt-1"
|
||||
></i>
|
||||
<section id="mission-section" class="lp-sec lp-band">
|
||||
<div class="lp-frame">
|
||||
<figure class="lp-manifesto lp-reveal">
|
||||
<p class="lp-kicker" data-i18n="about.mission.title">Our Mission</p>
|
||||
<blockquote
|
||||
class="lp-manifesto-text"
|
||||
data-i18n="about.mission.description"
|
||||
>
|
||||
To provide the most comprehensive PDF toolbox that respects your
|
||||
privacy and never asks for payment. We believe essential document
|
||||
tools should be accessible to everyone, everywhere, without
|
||||
barriers.
|
||||
</blockquote>
|
||||
<figcaption class="lp-manifesto-by">
|
||||
<img
|
||||
src="images/favicon-no-bg.svg"
|
||||
alt=""
|
||||
width="28"
|
||||
height="28"
|
||||
/>
|
||||
<span>BentoPDF</span>
|
||||
<a href="index.html#tools-header" data-i18n="about.cta.button"
|
||||
>Explore All Tools</a
|
||||
>
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="philosophy-section" class="lp-sec">
|
||||
<div class="lp-frame">
|
||||
<div class="lp-head lp-head--center">
|
||||
<div>
|
||||
<h3
|
||||
class="text-xl font-bold text-white"
|
||||
data-i18n="about.whyBentopdf.speed.title"
|
||||
>
|
||||
Built for Speed
|
||||
</h3>
|
||||
<p
|
||||
class="text-gray-400 mt-2"
|
||||
data-i18n="about.whyBentopdf.speed.description"
|
||||
>
|
||||
<h2 class="lp-h2">
|
||||
<span class="line" data-i18n="about.philosophy.title"
|
||||
>Privacy First. Always.</span
|
||||
>
|
||||
</h2>
|
||||
<p class="lp-head-p" data-i18n="about.philosophy.description">
|
||||
In an era where data is a commodity, we take a different
|
||||
approach. All processing for BentoPDF tools happens locally in
|
||||
your browser. This means your files never touch our servers, we
|
||||
never see your documents, and we don't track what you do. Your
|
||||
documents remain completely and unequivocally private. It's not
|
||||
just a feature; it's our foundation.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="lp-grid lp-grid--3 lp-cross">
|
||||
<div class="lp-cell lp-stat lp-cell--accent lp-reveal">
|
||||
<b>0</b
|
||||
><span data-i18n="features.noUploads.title">No Uploads</span>
|
||||
</div>
|
||||
<div class="lp-cell lp-stat lp-cell--white lp-reveal">
|
||||
<b>0</b><span data-i18n="hero.noSignups">No Signups</span>
|
||||
</div>
|
||||
<div class="lp-cell lp-stat lp-cell--hatch lp-reveal">
|
||||
<b>$0</b
|
||||
><span data-i18n="features.foreverFree.title">Forever Free</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="why-bentopdf" class="lp-sec lp-band">
|
||||
<div class="lp-frame">
|
||||
<div class="lp-head lp-head--center">
|
||||
<div>
|
||||
<h2 class="lp-h2">
|
||||
<span class="line" data-i18n="about.whyBentopdf.title"
|
||||
>Why</span
|
||||
>
|
||||
<span class="line dim">BentoPDF?</span>
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="lp-grid lp-grid--2 lp-cross">
|
||||
<div class="lp-cell lp-reveal">
|
||||
<span class="lp-tile"><i data-lucide="zap"></i></span>
|
||||
<h3 data-i18n="about.whyBentopdf.speed.title">Built for Speed</h3>
|
||||
<p data-i18n="about.whyBentopdf.speed.description">
|
||||
No waiting for uploads or downloads to a server. By processing
|
||||
files directly in your browser using modern web technologies
|
||||
like WebAssembly, we offer unparalleled speed for all our tools.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-gray-800 p-6 rounded-lg flex items-start gap-4">
|
||||
<i
|
||||
data-lucide="badge-dollar-sign"
|
||||
class="w-10 h-10 text-indigo-400 flex-shrink-0 mt-1"
|
||||
></i>
|
||||
<div>
|
||||
<h3
|
||||
class="text-xl font-bold text-white"
|
||||
data-i18n="about.whyBentopdf.free.title"
|
||||
>
|
||||
Completely Free
|
||||
</h3>
|
||||
<p
|
||||
class="text-gray-400 mt-2"
|
||||
data-i18n="about.whyBentopdf.free.description"
|
||||
>
|
||||
<div class="lp-cell lp-reveal">
|
||||
<span class="lp-tile"
|
||||
><i data-lucide="badge-dollar-sign"></i
|
||||
></span>
|
||||
<h3 data-i18n="about.whyBentopdf.free.title">Completely Free</h3>
|
||||
<p data-i18n="about.whyBentopdf.free.description">
|
||||
No trials, no subscriptions, no hidden fees, and no "premium"
|
||||
features held hostage. We believe powerful PDF tools should be a
|
||||
public utility, not a profit center.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-gray-800 p-6 rounded-lg flex items-start gap-4">
|
||||
<i
|
||||
data-lucide="user-plus"
|
||||
class="w-10 h-10 text-indigo-400 flex-shrink-0 mt-1"
|
||||
></i>
|
||||
<div>
|
||||
<h3
|
||||
class="text-xl font-bold text-white"
|
||||
data-i18n="about.whyBentopdf.noAccount.title"
|
||||
>
|
||||
<div class="lp-cell lp-reveal">
|
||||
<span class="lp-tile"><i data-lucide="user-plus"></i></span>
|
||||
<h3 data-i18n="about.whyBentopdf.noAccount.title">
|
||||
No Account Required
|
||||
</h3>
|
||||
<p
|
||||
class="text-gray-400 mt-2"
|
||||
data-i18n="about.whyBentopdf.noAccount.description"
|
||||
>
|
||||
<p data-i18n="about.whyBentopdf.noAccount.description">
|
||||
Start using any tool immediately. We don't need your email, a
|
||||
password, or any personal information. Your workflow should be
|
||||
frictionless and anonymous.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-gray-800 p-6 rounded-lg flex items-start gap-4">
|
||||
<i
|
||||
data-lucide="code-2"
|
||||
class="w-10 h-10 text-indigo-400 flex-shrink-0 mt-1"
|
||||
></i>
|
||||
<div>
|
||||
<h3
|
||||
class="text-xl font-bold text-white"
|
||||
data-i18n="about.whyBentopdf.openSource.title"
|
||||
>
|
||||
<div class="lp-cell lp-reveal">
|
||||
<span class="lp-tile"><i data-lucide="code-2"></i></span>
|
||||
<h3 data-i18n="about.whyBentopdf.openSource.title">
|
||||
Open Source Spirit
|
||||
</h3>
|
||||
<p
|
||||
class="text-gray-400 mt-2"
|
||||
data-i18n="about.whyBentopdf.openSource.description"
|
||||
>
|
||||
<p data-i18n="about.whyBentopdf.openSource.description">
|
||||
Built with transparency in mind. We leverage incredible
|
||||
open-source libraries like PDF-lib and PDF.js, and believe in
|
||||
the community-driven effort to make powerful tools accessible to
|
||||
@@ -267,30 +226,34 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="section-divider"></div>
|
||||
|
||||
<section id="cta-section" class="text-center py-16">
|
||||
<h2
|
||||
class="text-3xl font-bold text-white mb-4"
|
||||
data-i18n="about.cta.title"
|
||||
>
|
||||
Ready to get started?
|
||||
</h2>
|
||||
<p
|
||||
class="text-lg text-gray-400 mb-8 max-w-2xl mx-auto"
|
||||
data-i18n="about.cta.description"
|
||||
>
|
||||
Join thousands of users who trust BentoPDF for their daily document
|
||||
needs. Experience the difference that privacy and performance can
|
||||
make.
|
||||
</p>
|
||||
<a
|
||||
href="index.html#tools-header"
|
||||
class="inline-block px-8 py-3 rounded-full bg-gradient-to-b from-indigo-500 to-indigo-600 text-white font-semibold focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-900 focus:ring-indigo-400 hover:shadow-xl hover:shadow-indigo-500/30 transition-all duration-200 transform hover:-translate-y-1"
|
||||
data-i18n="about.cta.button"
|
||||
>
|
||||
Explore All Tools
|
||||
</a>
|
||||
<section id="cta-section" class="lp-sec">
|
||||
<div class="lp-frame">
|
||||
<div class="lp-cta">
|
||||
<h2 class="lp-h2" data-i18n="about.cta.title">
|
||||
Ready to get started?
|
||||
</h2>
|
||||
<p data-i18n="about.cta.description">
|
||||
Join thousands of users who trust BentoPDF for their daily
|
||||
document needs. Experience the difference that privacy and
|
||||
performance can make.
|
||||
</p>
|
||||
<div class="lp-cta-actions">
|
||||
<span class="lp-brackets">
|
||||
<a
|
||||
href="index.html#tools-header"
|
||||
class="lp-btn lp-btn--primary"
|
||||
>
|
||||
<span data-i18n="about.cta.button">Explore All Tools</span>
|
||||
<i data-lucide="arrow-right"></i>
|
||||
</a>
|
||||
</span>
|
||||
<a href="https://bentopdf.com/docs/" class="lp-btn lp-btn--ghost">
|
||||
<i data-lucide="book-open"></i>
|
||||
<span data-i18n="nav.docs">Docs</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
@@ -299,6 +262,7 @@
|
||||
<script type="module" src="src/js/utils/lucide-init.ts"></script>
|
||||
<script type="module" src="src/js/main.ts"></script>
|
||||
<script type="module" src="src/js/mobileMenu.ts"></script>
|
||||
<script type="module" src="src/js/landing.ts"></script>
|
||||
|
||||
<!-- JSON-LD Schema -->
|
||||
<script type="application/ld+json">
|
||||
|
||||
Reference in New Issue
Block a user