feat: Pulse CRM Landing Page
🫀 Der Herzschlag deines Business
Design:
- Teal/Türkis Farbschema
- Orange CTAs
- CRM-spezifische Icons
- Dunkler Hintergrund
Sektionen:
- Hero mit 360° Kundenansicht
- 6 CRM Features
- How It Works (3 Steps)
- Pricing (Starter/Pro/Enterprise)
- Testimonials
- FAQ
- CTA & Footer
Vollständig DE/EN übersetzt
This commit is contained in:
4
.gitignore
vendored
Normal file
4
.gitignore
vendored
Normal file
@@ -0,0 +1,4 @@
|
||||
node_modules
|
||||
dist
|
||||
.DS_Store
|
||||
*.local
|
||||
41
README.md
Normal file
41
README.md
Normal file
@@ -0,0 +1,41 @@
|
||||
# Vue3 Basis
|
||||
|
||||
Eine moderne Vue 3 Starter-Vorlage mit allen wichtigen Features.
|
||||
|
||||
## Features
|
||||
|
||||
- ⚡ **Vite** - Blitzschneller Build
|
||||
- 🎨 **TailwindCSS** - Utility-first CSS
|
||||
- 🌙 **Dark/Light Mode** - Automatischer Theme-Switch
|
||||
- 🌍 **i18n** - Deutsch & Englisch
|
||||
- 💎 **PrimeVue 4** - UI-Komponenten
|
||||
- 📦 **Pinia** - State Management
|
||||
- 🛣️ **Vue Router** - SPA Navigation
|
||||
|
||||
## Installation
|
||||
|
||||
```bash
|
||||
npm install
|
||||
npm run dev
|
||||
```
|
||||
|
||||
## Build
|
||||
|
||||
```bash
|
||||
npm run build
|
||||
```
|
||||
|
||||
## Struktur
|
||||
|
||||
```
|
||||
src/
|
||||
├── components/ # Wiederverwendbare Komponenten
|
||||
├── views/ # Seiten-Komponenten
|
||||
├── locales/ # Sprachdateien (de, en)
|
||||
├── router/ # Vue Router Konfiguration
|
||||
├── stores/ # Pinia Stores
|
||||
└── composables/ # Composition API Funktionen
|
||||
```
|
||||
|
||||
---
|
||||
Erstellt von OpenClaw 🤖
|
||||
13
index.html
Normal file
13
index.html
Normal file
@@ -0,0 +1,13 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Vue3 Basis</title>
|
||||
<link rel="icon" href="/favicon.ico">
|
||||
</head>
|
||||
<body class="antialiased">
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/src/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
3124
package-lock.json
generated
Normal file
3124
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
28
package.json
Normal file
28
package.json
Normal file
@@ -0,0 +1,28 @@
|
||||
{
|
||||
"name": "vue3-basis",
|
||||
"version": "1.0.0",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"@primevue/themes": "^4.0.0",
|
||||
"@vueuse/motion": "^3.0.3",
|
||||
"pinia": "^2.1.0",
|
||||
"primeicons": "^7.0.0",
|
||||
"primevue": "^4.0.0",
|
||||
"vue": "^3.4.0",
|
||||
"vue-i18n": "^9.9.0",
|
||||
"vue-router": "^4.2.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vitejs/plugin-vue": "^5.2.4",
|
||||
"autoprefixer": "^10.4.0",
|
||||
"postcss": "^8.4.0",
|
||||
"tailwindcss": "^3.4.0",
|
||||
"vite": "^5.4.21"
|
||||
}
|
||||
}
|
||||
6
postcss.config.js
Normal file
6
postcss.config.js
Normal file
@@ -0,0 +1,6 @@
|
||||
export default {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
}
|
||||
19
src/App.vue
Normal file
19
src/App.vue
Normal file
@@ -0,0 +1,19 @@
|
||||
<script setup>
|
||||
import { RouterView } from 'vue-router'
|
||||
import Navbar from './components/Navbar.vue'
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="app">
|
||||
<Navbar />
|
||||
<main>
|
||||
<RouterView />
|
||||
</main>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.app {
|
||||
min-height: 100vh;
|
||||
}
|
||||
</style>
|
||||
211
src/components/Navbar.vue
Normal file
211
src/components/Navbar.vue
Normal file
@@ -0,0 +1,211 @@
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import Button from 'primevue/button'
|
||||
|
||||
const { locale, t } = useI18n()
|
||||
const scrolled = ref(false)
|
||||
const mobileMenuOpen = ref(false)
|
||||
|
||||
onMounted(() => {
|
||||
window.addEventListener('scroll', () => {
|
||||
scrolled.value = window.scrollY > 50
|
||||
})
|
||||
})
|
||||
|
||||
function toggleLocale() {
|
||||
locale.value = locale.value === 'de' ? 'en' : 'de'
|
||||
localStorage.setItem('locale', locale.value)
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<nav class="navbar" :class="{ scrolled }">
|
||||
<div class="nav-container">
|
||||
<div class="nav-brand">
|
||||
<span class="brand-icon">💚</span>
|
||||
<span class="brand-text">Pulse</span>
|
||||
</div>
|
||||
|
||||
<div class="nav-links" :class="{ open: mobileMenuOpen }">
|
||||
<a href="#features" class="nav-link">{{ t('nav.features') }}</a>
|
||||
<a href="#pricing" class="nav-link">{{ t('nav.pricing') }}</a>
|
||||
<a href="#faq" class="nav-link">{{ t('nav.faq') }}</a>
|
||||
</div>
|
||||
|
||||
<div class="nav-actions">
|
||||
<button class="lang-toggle" @click="toggleLocale" :title="t('nav.switchLang')">
|
||||
{{ locale.toUpperCase() }}
|
||||
</button>
|
||||
<Button :label="t('nav.login')" class="btn-nav-ghost" text />
|
||||
<Button :label="t('nav.getStarted')" class="btn-nav-primary" />
|
||||
</div>
|
||||
|
||||
<button class="mobile-toggle" @click="mobileMenuOpen = !mobileMenuOpen">
|
||||
<i :class="mobileMenuOpen ? 'pi pi-times' : 'pi pi-bars'"></i>
|
||||
</button>
|
||||
</div>
|
||||
</nav>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.navbar {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 1000;
|
||||
padding: 1rem 2rem;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.navbar.scrolled {
|
||||
background: rgba(10, 10, 10, 0.8);
|
||||
backdrop-filter: blur(20px);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
|
||||
padding: 0.75rem 2rem;
|
||||
}
|
||||
|
||||
.nav-container {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.nav-brand {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.brand-icon {
|
||||
font-size: 1.75rem;
|
||||
}
|
||||
|
||||
.brand-text {
|
||||
background: linear-gradient(135deg, #fff, #5eead4);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
}
|
||||
|
||||
.nav-links {
|
||||
display: flex;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.nav-link {
|
||||
color: #94a3b8;
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
transition: color 0.2s ease;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.nav-link:hover {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.nav-link::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -4px;
|
||||
left: 0;
|
||||
width: 0;
|
||||
height: 2px;
|
||||
background: linear-gradient(90deg, #14b8a6, #06b6d4);
|
||||
transition: width 0.3s ease;
|
||||
}
|
||||
|
||||
.nav-link:hover::after {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.nav-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.lang-toggle {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 8px;
|
||||
color: #94a3b8;
|
||||
font-weight: 600;
|
||||
font-size: 0.75rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.lang-toggle:hover {
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
color: white;
|
||||
}
|
||||
|
||||
:deep(.btn-nav-ghost) {
|
||||
color: #94a3b8 !important;
|
||||
}
|
||||
|
||||
:deep(.btn-nav-ghost:hover) {
|
||||
color: white !important;
|
||||
background: rgba(255, 255, 255, 0.05) !important;
|
||||
}
|
||||
|
||||
:deep(.btn-nav-primary) {
|
||||
background: linear-gradient(135deg, #14b8a6, #0d9488) !important;
|
||||
border: none !important;
|
||||
font-weight: 600 !important;
|
||||
}
|
||||
|
||||
:deep(.btn-nav-primary:hover) {
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 10px 20px -5px rgba(20, 184, 166, 0.4);
|
||||
}
|
||||
|
||||
.mobile-toggle {
|
||||
display: none;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background: transparent;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 8px;
|
||||
color: white;
|
||||
font-size: 1.25rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.nav-links,
|
||||
.nav-actions {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mobile-toggle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.nav-links.open {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background: rgba(10, 10, 10, 0.95);
|
||||
backdrop-filter: blur(20px);
|
||||
padding: 2rem;
|
||||
gap: 1.5rem;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
151
src/locales/de.json
Normal file
151
src/locales/de.json
Normal file
@@ -0,0 +1,151 @@
|
||||
{
|
||||
"nav": {
|
||||
"toggleTheme": "Theme wechseln",
|
||||
"features": "Features",
|
||||
"pricing": "Preise",
|
||||
"faq": "FAQ",
|
||||
"login": "Anmelden",
|
||||
"getStarted": "Demo starten",
|
||||
"switchLang": "Sprache wechseln"
|
||||
},
|
||||
"hero": {
|
||||
"badge": "CRM der neuen Generation",
|
||||
"title1": "Der Herzschlag",
|
||||
"title2": "deines Business",
|
||||
"subtitle": "Pulse CRM verbindet alle Kundenbeziehungen an einem Ort. Leads verwalten, Deals abschließen, Kunden begeistern.",
|
||||
"cta": "Kostenlos testen",
|
||||
"secondary": "Demo ansehen"
|
||||
},
|
||||
"stats": {
|
||||
"uptime": "Verfügbarkeit",
|
||||
"faster": "Mehr Abschlüsse",
|
||||
"support": "Support"
|
||||
},
|
||||
"features": {
|
||||
"tag": "Features",
|
||||
"title": "Alles für dein Kundenmanagement",
|
||||
"subtitle": "Leistungsstarke Tools für maximale Kundenbindung",
|
||||
"speed": {
|
||||
"title": "360° Kundenansicht",
|
||||
"desc": "Alle Kundeninformationen, Kontakte und Historie auf einen Blick - nie wieder Daten suchen."
|
||||
},
|
||||
"ai": {
|
||||
"title": "AI Sales Assistant",
|
||||
"desc": "KI-gestützte Empfehlungen für den nächsten besten Schritt bei jedem Lead."
|
||||
},
|
||||
"security": {
|
||||
"title": "Pipeline Management",
|
||||
"desc": "Visualisiere deinen gesamten Sales-Funnel und behalte jeden Deal im Blick."
|
||||
},
|
||||
"scale": {
|
||||
"title": "Automatisierung",
|
||||
"desc": "Automatisiere Follow-ups, Erinnerungen und repetitive Tasks - spar wertvolle Zeit."
|
||||
},
|
||||
"integration": {
|
||||
"title": "Nahtlose Integration",
|
||||
"desc": "Verbinde E-Mail, Kalender, Telefonie und 100+ weitere Tools die du nutzt."
|
||||
},
|
||||
"analytics": {
|
||||
"title": "Sales Analytics",
|
||||
"desc": "Echtzeit-Dashboards und Forecasts für datengetriebene Entscheidungen."
|
||||
}
|
||||
},
|
||||
"howItWorks": {
|
||||
"tag": "So funktioniert's",
|
||||
"title": "In 3 Schritten zum Erfolg",
|
||||
"step1": {
|
||||
"title": "Kontakte importieren",
|
||||
"desc": "Importiere deine bestehenden Kontakte oder starte fresh - in unter 5 Minuten."
|
||||
},
|
||||
"step2": {
|
||||
"title": "Pipeline einrichten",
|
||||
"desc": "Definiere deine Sales-Stages und automatisiere Workflows."
|
||||
},
|
||||
"step3": {
|
||||
"title": "Deals abschließen",
|
||||
"desc": "Nutze KI-Insights um mehr Deals schneller abzuschließen."
|
||||
}
|
||||
},
|
||||
"pricing": {
|
||||
"tag": "Preise",
|
||||
"title": "Transparente Preise",
|
||||
"subtitle": "Wähle den Plan der zu deinem Team passt",
|
||||
"month": "Monat",
|
||||
"popular": "Beliebt",
|
||||
"cta": "Plan wählen",
|
||||
"starter": {
|
||||
"name": "Starter",
|
||||
"desc": "Für kleine Teams",
|
||||
"feature1": "Bis zu 1.000 Kontakte",
|
||||
"feature2": "2 Benutzer inklusive",
|
||||
"feature3": "E-Mail Integration",
|
||||
"feature4": "Basis Reporting"
|
||||
},
|
||||
"pro": {
|
||||
"name": "Pro",
|
||||
"desc": "Für wachsende Teams",
|
||||
"feature1": "Unbegrenzte Kontakte",
|
||||
"feature2": "10 Benutzer inklusive",
|
||||
"feature3": "AI Sales Assistant",
|
||||
"feature4": "Erweiterte Analytics"
|
||||
},
|
||||
"enterprise": {
|
||||
"name": "Enterprise",
|
||||
"desc": "Für große Unternehmen",
|
||||
"feature1": "Alles aus Pro",
|
||||
"feature2": "Unbegrenzte Benutzer",
|
||||
"feature3": "Dedicated Account Manager",
|
||||
"feature4": "Custom Integrationen"
|
||||
}
|
||||
},
|
||||
"testimonials": {
|
||||
"tag": "Kundenstimmen",
|
||||
"title": "Was unsere Kunden sagen",
|
||||
"quote1": "Mit Pulse haben wir unsere Conversion Rate um 40% gesteigert. Die 360° Kundenansicht ist ein Game-Changer.",
|
||||
"quote2": "Endlich ein CRM das nicht nervt. Intuitive Bedienung und die AI-Empfehlungen sind Gold wert.",
|
||||
"quote3": "Der Support ist fantastisch und das Tool hat sich in 2 Wochen amortisiert."
|
||||
},
|
||||
"faq": {
|
||||
"title": "Häufige Fragen",
|
||||
"faq1": {
|
||||
"q": "Kann ich meine bestehenden Kontakte importieren?",
|
||||
"a": "Ja! Du kannst Kontakte aus Excel, CSV, oder direkt aus anderen CRMs wie Salesforce, HubSpot oder Pipedrive importieren."
|
||||
},
|
||||
"faq2": {
|
||||
"q": "Gibt es eine kostenlose Testphase?",
|
||||
"a": "Ja! Du kannst Pulse 14 Tage kostenlos testen - keine Kreditkarte erforderlich. Danach kannst du upgraden oder beim kostenlosen Starter-Plan bleiben."
|
||||
},
|
||||
"faq3": {
|
||||
"q": "Welche Integrationen werden unterstützt?",
|
||||
"a": "Wir unterstützen über 100+ Integrationen inkl. Gmail, Outlook, Slack, Zoom, Calendly, Zapier und viele mehr."
|
||||
},
|
||||
"faq4": {
|
||||
"q": "Sind meine Kundendaten sicher?",
|
||||
"a": "Absolut. Wir nutzen AES-256 Verschlüsselung, sind SOC2 zertifiziert und DSGVO-konform. Deine Daten gehören dir."
|
||||
}
|
||||
},
|
||||
"cta": {
|
||||
"title": "Bereit mehr Deals abzuschließen?",
|
||||
"subtitle": "Starte jetzt kostenlos und erlebe CRM wie es sein sollte.",
|
||||
"button": "Kostenlos starten",
|
||||
"secondary": "Demo buchen"
|
||||
},
|
||||
"footer": {
|
||||
"tagline": "Das CRM das mit dir wächst. Kundenbeziehungen, neu gedacht.",
|
||||
"product": "Produkt",
|
||||
"company": "Unternehmen",
|
||||
"legal": "Rechtliches",
|
||||
"rights": "Alle Rechte vorbehalten.",
|
||||
"features": "Features",
|
||||
"pricing": "Preise",
|
||||
"changelog": "Changelog",
|
||||
"roadmap": "Roadmap",
|
||||
"about": "Über uns",
|
||||
"blog": "Blog",
|
||||
"careers": "Karriere",
|
||||
"contact": "Kontakt",
|
||||
"privacy": "Datenschutz",
|
||||
"terms": "AGB",
|
||||
"imprint": "Impressum"
|
||||
}
|
||||
}
|
||||
151
src/locales/en.json
Normal file
151
src/locales/en.json
Normal file
@@ -0,0 +1,151 @@
|
||||
{
|
||||
"nav": {
|
||||
"toggleTheme": "Toggle theme",
|
||||
"features": "Features",
|
||||
"pricing": "Pricing",
|
||||
"faq": "FAQ",
|
||||
"login": "Login",
|
||||
"getStarted": "Start demo",
|
||||
"switchLang": "Switch language"
|
||||
},
|
||||
"hero": {
|
||||
"badge": "Next-gen CRM",
|
||||
"title1": "The Heartbeat",
|
||||
"title2": "of your Business",
|
||||
"subtitle": "Pulse CRM connects all your customer relationships in one place. Manage leads, close deals, delight customers.",
|
||||
"cta": "Try for free",
|
||||
"secondary": "Watch demo"
|
||||
},
|
||||
"stats": {
|
||||
"uptime": "Uptime",
|
||||
"faster": "More Closes",
|
||||
"support": "Support"
|
||||
},
|
||||
"features": {
|
||||
"tag": "Features",
|
||||
"title": "Everything for your customer management",
|
||||
"subtitle": "Powerful tools for maximum customer retention",
|
||||
"speed": {
|
||||
"title": "360° Customer View",
|
||||
"desc": "All customer information, contacts and history at a glance - never search for data again."
|
||||
},
|
||||
"ai": {
|
||||
"title": "AI Sales Assistant",
|
||||
"desc": "AI-powered recommendations for the next best step with every lead."
|
||||
},
|
||||
"security": {
|
||||
"title": "Pipeline Management",
|
||||
"desc": "Visualize your entire sales funnel and keep every deal in sight."
|
||||
},
|
||||
"scale": {
|
||||
"title": "Automation",
|
||||
"desc": "Automate follow-ups, reminders and repetitive tasks - save valuable time."
|
||||
},
|
||||
"integration": {
|
||||
"title": "Seamless Integration",
|
||||
"desc": "Connect email, calendar, telephony and 100+ more tools you use."
|
||||
},
|
||||
"analytics": {
|
||||
"title": "Sales Analytics",
|
||||
"desc": "Real-time dashboards and forecasts for data-driven decisions."
|
||||
}
|
||||
},
|
||||
"howItWorks": {
|
||||
"tag": "How it works",
|
||||
"title": "3 Steps to Success",
|
||||
"step1": {
|
||||
"title": "Import Contacts",
|
||||
"desc": "Import your existing contacts or start fresh - in under 5 minutes."
|
||||
},
|
||||
"step2": {
|
||||
"title": "Set up Pipeline",
|
||||
"desc": "Define your sales stages and automate workflows."
|
||||
},
|
||||
"step3": {
|
||||
"title": "Close Deals",
|
||||
"desc": "Use AI insights to close more deals faster."
|
||||
}
|
||||
},
|
||||
"pricing": {
|
||||
"tag": "Pricing",
|
||||
"title": "Transparent Pricing",
|
||||
"subtitle": "Choose the plan that fits your team",
|
||||
"month": "month",
|
||||
"popular": "Popular",
|
||||
"cta": "Choose plan",
|
||||
"starter": {
|
||||
"name": "Starter",
|
||||
"desc": "For small teams",
|
||||
"feature1": "Up to 1,000 contacts",
|
||||
"feature2": "2 users included",
|
||||
"feature3": "Email integration",
|
||||
"feature4": "Basic reporting"
|
||||
},
|
||||
"pro": {
|
||||
"name": "Pro",
|
||||
"desc": "For growing teams",
|
||||
"feature1": "Unlimited contacts",
|
||||
"feature2": "10 users included",
|
||||
"feature3": "AI Sales Assistant",
|
||||
"feature4": "Advanced analytics"
|
||||
},
|
||||
"enterprise": {
|
||||
"name": "Enterprise",
|
||||
"desc": "For large companies",
|
||||
"feature1": "Everything in Pro",
|
||||
"feature2": "Unlimited users",
|
||||
"feature3": "Dedicated Account Manager",
|
||||
"feature4": "Custom integrations"
|
||||
}
|
||||
},
|
||||
"testimonials": {
|
||||
"tag": "Testimonials",
|
||||
"title": "What our customers say",
|
||||
"quote1": "With Pulse we increased our conversion rate by 40%. The 360° customer view is a game-changer.",
|
||||
"quote2": "Finally a CRM that doesn't annoy. Intuitive interface and the AI recommendations are worth gold.",
|
||||
"quote3": "The support is fantastic and the tool paid for itself in 2 weeks."
|
||||
},
|
||||
"faq": {
|
||||
"title": "Frequently Asked Questions",
|
||||
"faq1": {
|
||||
"q": "Can I import my existing contacts?",
|
||||
"a": "Yes! You can import contacts from Excel, CSV, or directly from other CRMs like Salesforce, HubSpot or Pipedrive."
|
||||
},
|
||||
"faq2": {
|
||||
"q": "Is there a free trial?",
|
||||
"a": "Yes! You can try Pulse free for 14 days - no credit card required. Then you can upgrade or stay on the free Starter plan."
|
||||
},
|
||||
"faq3": {
|
||||
"q": "Which integrations are supported?",
|
||||
"a": "We support 100+ integrations including Gmail, Outlook, Slack, Zoom, Calendly, Zapier and many more."
|
||||
},
|
||||
"faq4": {
|
||||
"q": "Is my customer data secure?",
|
||||
"a": "Absolutely. We use AES-256 encryption, are SOC2 certified and GDPR compliant. Your data belongs to you."
|
||||
}
|
||||
},
|
||||
"cta": {
|
||||
"title": "Ready to close more deals?",
|
||||
"subtitle": "Start for free and experience CRM as it should be.",
|
||||
"button": "Start for free",
|
||||
"secondary": "Book a demo"
|
||||
},
|
||||
"footer": {
|
||||
"tagline": "The CRM that grows with you. Customer relationships, reimagined.",
|
||||
"product": "Product",
|
||||
"company": "Company",
|
||||
"legal": "Legal",
|
||||
"rights": "All rights reserved.",
|
||||
"features": "Features",
|
||||
"pricing": "Pricing",
|
||||
"changelog": "Changelog",
|
||||
"roadmap": "Roadmap",
|
||||
"about": "About",
|
||||
"blog": "Blog",
|
||||
"careers": "Careers",
|
||||
"contact": "Contact",
|
||||
"privacy": "Privacy",
|
||||
"terms": "Terms",
|
||||
"imprint": "Imprint"
|
||||
}
|
||||
}
|
||||
34
src/main.js
Normal file
34
src/main.js
Normal file
@@ -0,0 +1,34 @@
|
||||
import { createApp } from 'vue'
|
||||
import { createPinia } from 'pinia'
|
||||
import { createI18n } from 'vue-i18n'
|
||||
import PrimeVue from 'primevue/config'
|
||||
import Aura from '@primevue/themes/aura'
|
||||
import 'primeicons/primeicons.css'
|
||||
import './style.css'
|
||||
import App from './App.vue'
|
||||
import router from './router'
|
||||
import de from './locales/de.json'
|
||||
import en from './locales/en.json'
|
||||
|
||||
const i18n = createI18n({
|
||||
legacy: false,
|
||||
locale: localStorage.getItem('locale') || 'de',
|
||||
fallbackLocale: 'en',
|
||||
messages: { de, en }
|
||||
})
|
||||
|
||||
const app = createApp(App)
|
||||
|
||||
app.use(createPinia())
|
||||
app.use(router)
|
||||
app.use(i18n)
|
||||
app.use(PrimeVue, {
|
||||
theme: {
|
||||
preset: Aura,
|
||||
options: {
|
||||
darkModeSelector: '.dark'
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
app.mount('#app')
|
||||
20
src/router/index.js
Normal file
20
src/router/index.js
Normal file
@@ -0,0 +1,20 @@
|
||||
import { createRouter, createWebHistory } from 'vue-router'
|
||||
import HomeView from '../views/HomeView.vue'
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHistory(import.meta.env.BASE_URL),
|
||||
routes: [
|
||||
{
|
||||
path: '/',
|
||||
name: 'home',
|
||||
component: HomeView
|
||||
},
|
||||
{
|
||||
path: '/about',
|
||||
name: 'about',
|
||||
component: () => import('../views/AboutView.vue')
|
||||
}
|
||||
]
|
||||
})
|
||||
|
||||
export default router
|
||||
62
src/style.css
Normal file
62
src/style.css
Normal file
@@ -0,0 +1,62 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
|
||||
|
||||
:root {
|
||||
--color-bg: #0a0a0a;
|
||||
--color-surface: #111827;
|
||||
--color-primary: #14b8a6;
|
||||
--color-secondary: #06b6d4;
|
||||
--color-accent: #f97316;
|
||||
--color-text: #f8fafc;
|
||||
--color-text-muted: #94a3b8;
|
||||
}
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Inter', system-ui, -apple-system, sans-serif;
|
||||
background: var(--color-bg);
|
||||
color: var(--color-text);
|
||||
line-height: 1.6;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: rgba(20, 184, 166, 0.3);
|
||||
color: white;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: var(--color-bg);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
/* PrimeVue Overrides */
|
||||
.p-button {
|
||||
border-radius: 12px !important;
|
||||
transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
|
||||
}
|
||||
12
src/views/AboutView.vue
Normal file
12
src/views/AboutView.vue
Normal file
@@ -0,0 +1,12 @@
|
||||
<script setup>
|
||||
import { useI18n } from 'vue-i18n'
|
||||
|
||||
const { t } = useI18n()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="max-w-2xl mx-auto">
|
||||
<h1 class="text-3xl font-bold mb-4">{{ t('about.title') }}</h1>
|
||||
<p class="text-gray-600 dark:text-gray-400">{{ t('about.content') }}</p>
|
||||
</div>
|
||||
</template>
|
||||
1039
src/views/HomeView.vue
Normal file
1039
src/views/HomeView.vue
Normal file
File diff suppressed because it is too large
Load Diff
12
tailwind.config.js
Normal file
12
tailwind.config.js
Normal file
@@ -0,0 +1,12 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: [
|
||||
"./index.html",
|
||||
"./src/**/*.{vue,js,ts,jsx,tsx}",
|
||||
],
|
||||
darkMode: 'class',
|
||||
theme: {
|
||||
extend: {},
|
||||
},
|
||||
plugins: [],
|
||||
}
|
||||
11
vite.config.js
Normal file
11
vite.config.js
Normal file
@@ -0,0 +1,11 @@
|
||||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [vue()],
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': '/src'
|
||||
}
|
||||
}
|
||||
})
|
||||
Reference in New Issue
Block a user