commit ce2d4f904a8bbf4f6ea22c016e845ed9c58ba4f5

Author: root <root@hub.scroll.pub> Date: 2024-12-30 18:42:17 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..1cfb3ff --- /dev/null +++ b/body.html @@ -0,0 +1,94 @@ +<header class="nav-header"> + <div class="container"> + <h1>ConverSales AI</h1> + <nav> + <ul> + <li><a href="#features">Features</a></li> + <li><a href="#results">Results</a></li> + <li><a href="#demo">Demo</a></li> + </ul> + </nav> + </div> +</header> + +<main> + <section class="hero"> + <div class="container"> + <h2>Turn Cold Leads Into Sales With Our ChatGPT Powered SMS Systems</h2> + <p class="subtitle">Performance-Based Partnership: Zero Upfront Costs!</p> + <div class="cta-buttons"> + <a href="#case-study" class="btn primary">Read Case Study</a> + <a href="#demo" class="btn secondary">Test Drive Now</a> + </div> + </div> + </section> + + <section id="features" class="features"> + <div class="container"> + <h2>Powerful Features for Maximum Conversion</h2> + <div class="features-grid"> + <div class="feature-card"> + <h3>Database Reactivation</h3> + <p>ChatGPT powered SMS Sales Android reactivates your old unconverted leads with human-like conversations.</p> + </div> + <div class="feature-card"> + <h3>48hr Sales Android</h3> + <p>Engage recent leads who've ignored calls, booking appointments before they go cold.</p> + </div> + <div class="feature-card"> + <h3>Cart Recovery</h3> + <p>Boost e-commerce revenue by converting abandoned carts through persuasive SMS conversations.</p> + </div> + </div> + </div> + </section> + + <section id="results" class="results"> + <div class="container"> + <h2>Client Results</h2> + <div class="stats-grid"> + <div class="stat-card"> + <span class="stat">40%</span> + <p>Labor Cost Reduction</p> + </div> + <div class="stat-card"> + <span class="stat">25%</span> + <p>Revenue Increase</p> + </div> + <div class="stat-card"> + <span class="stat">60</span> + <p>Hours Saved Monthly</p> + </div> + </div> + </div> + </section> + + <section id="demo" class="demo"> + <div class="container"> + <h2>Request a Demo</h2> + <form id="demoForm" class="demo-form"> + <div class="form-grid"> + <div class="form-group"> + <input type="text" id="name" required placeholder="Your Name"> + </div> + <div class="form-group"> + <input type="email" id="email" required placeholder="Business Email"> + </div> + <div class="form-group"> + <input type="text" id="company" required placeholder="Company Name"> + </div> + <div class="form-group"> + <input type="text" id="title" required placeholder="Job Title"> + </div> + </div> + <button type="submit" class="btn primary">Request Demo</button> + </form> + </div> + </section> +</main> + +<footer> + <div class="container"> + <p>2024 ConverSales AI</p> + </div> +</footer> diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..9cdf795 --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://conversales.scroll.pub +metaTags +editButton /edit.html +title ConverSales AI - Transform Cold Leads Into Sales +style.css +body.html +script.js diff --git a/prompt.json b/prompt.json new file mode 100644 index 0000000..a0fcfb7 --- /dev/null +++ b/prompt.json @@ -0,0 +1,20 @@ +{ + "id": "msg_01FWjy4ZRhVEEgtEBYcJaFPS", + "type": "message", + "role": "assistant", + "model": "claude-3-5-sonnet-20241022", + "content": [ + { + "type": "text", + "text": "Here's a complete implementation:\n\n---domain---\nconversales.scroll.pub\n\n---index.scroll---\nbuildHtml\nbaseUrl https://conversales.scroll.pub\nmetaTags\neditButton /edit.html\ntitle ConverSales AI - Transform Cold Leads Into Sales\nstyle.css\nbody.html\nscript.js\n\n---body.html---\n<header class=\"nav-header\">\n <div class=\"container\">\n <h1>ConverSales AI</h1>\n <nav>\n <ul>\n <li><a href=\"#features\">Features</a></li>\n <li><a href=\"#results\">Results</a></li>\n <li><a href=\"#demo\">Demo</a></li>\n </ul>\n </nav>\n </div>\n</header>\n\n<main>\n <section class=\"hero\">\n <div class=\"container\">\n <h2>Turn Cold Leads Into Sales With Our ChatGPT Powered SMS Systems</h2>\n <p class=\"subtitle\">Performance-Based Partnership: Zero Upfront Costs!</p>\n <div class=\"cta-buttons\">\n <a href=\"#case-study\" class=\"btn primary\">Read Case Study</a>\n <a href=\"#demo\" class=\"btn secondary\">Test Drive Now</a>\n </div>\n </div>\n </section>\n\n <section id=\"features\" class=\"features\">\n <div class=\"container\">\n <h2>Powerful Features for Maximum Conversion</h2>\n <div class=\"features-grid\">\n <div class=\"feature-card\">\n <h3>Database Reactivation</h3>\n <p>ChatGPT powered SMS Sales Android reactivates your old unconverted leads with human-like conversations.</p>\n </div>\n <div class=\"feature-card\">\n <h3>48hr Sales Android</h3>\n <p>Engage recent leads who've ignored calls, booking appointments before they go cold.</p>\n </div>\n <div class=\"feature-card\">\n <h3>Cart Recovery</h3>\n <p>Boost e-commerce revenue by converting abandoned carts through persuasive SMS conversations.</p>\n </div>\n </div>\n </div>\n </section>\n\n <section id=\"results\" class=\"results\">\n <div class=\"container\">\n <h2>Client Results</h2>\n <div class=\"stats-grid\">\n <div class=\"stat-card\">\n <span class=\"stat\">40%</span>\n <p>Labor Cost Reduction</p>\n </div>\n <div class=\"stat-card\">\n <span class=\"stat\">25%</span>\n <p>Revenue Increase</p>\n </div>\n <div class=\"stat-card\">\n <span class=\"stat\">60</span>\n <p>Hours Saved Monthly</p>\n </div>\n </div>\n </div>\n </section>\n\n <section id=\"demo\" class=\"demo\">\n <div class=\"container\">\n <h2>Request a Demo</h2>\n <form id=\"demoForm\" class=\"demo-form\">\n <div class=\"form-grid\">\n <div class=\"form-group\">\n <input type=\"text\" id=\"name\" required placeholder=\"Your Name\">\n </div>\n <div class=\"form-group\">\n <input type=\"email\" id=\"email\" required placeholder=\"Business Email\">\n </div>\n <div class=\"form-group\">\n <input type=\"text\" id=\"company\" required placeholder=\"Company Name\">\n </div>\n <div class=\"form-group\">\n <input type=\"text\" id=\"title\" required placeholder=\"Job Title\">\n </div>\n </div>\n <button type=\"submit\" class=\"btn primary\">Request Demo</button>\n </form>\n </div>\n </section>\n</main>\n\n<footer>\n <div class=\"container\">\n <p>2024 ConverSales AI</p>\n </div>\n</footer>\n\n---style.css---\n:root {\n --primary: #2563eb;\n --secondary: #1e40af;\n --text: #1f2937;\n --background: #ffffff;\n --accent: #dbeafe;\n}\n\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n}\n\nbody {\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, sans-serif;\n line-height: 1.6;\n color: var(--text);\n}\n\n.container {\n max-width: 1200px;\n margin: 0 auto;\n padding: 0 2rem;\n}\n\n.nav-header {\n background: var(--background);\n box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n position: fixed;\n width: 100%;\n top: 0;\n z-index: 100;\n}\n\n.nav-header .container {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 1rem 2rem;\n}\n\nnav ul {\n display: flex;\n gap: 2rem;\n list-style: none;\n}\n\nnav a {\n text-decoration: none;\n color: var(--text);\n font-weight: 500;\n transition: color 0.3s ease;\n}\n\nnav a:hover {\n color: var(--primary);\n}\n\n.hero {\n padding: 8rem 0 4rem;\n background: linear-gradient(135deg, var(--accent), var(--background));\n text-align: center;\n}\n\n.hero h2 {\n font-size: 3rem;\n margin-bottom: 1rem;\n line-height: 1.2;\n}\n\n.subtitle {\n font-size: 1.25rem;\n margin-bottom: 2rem;\n}\n\n.btn {\n display: inline-block;\n padding: 0.75rem 1.5rem;\n border-radius: 0.5rem;\n text-decoration: none;\n font-weight: 600;\n transition: transform 0.3s ease;\n}\n\n.btn:hover {\n transform: translateY(-2px);\n}\n\n.btn.primary {\n background: var(--primary);\n color: white;\n}\n\n.btn.secondary {\n background: var(--background);\n color: var(--primary);\n border: 2px solid var(--primary);\n margin-left: 1rem;\n}\n\n.features, .results, .demo {\n padding: 4rem 0;\n}\n\n.features-grid, .stats-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n gap: 2rem;\n margin-top: 2rem;\n}\n\n.feature-card, .stat-card {\n padding: 2rem;\n background: var(--background);\n border-radius: 1rem;\n box-shadow: 0 4px 6px rgba(0,0,0,0.1);\n transition: transform 0.3s ease;\n}\n\n.feature-card:hover, .stat-card:hover {\n transform: translateY(-5px);\n}\n\n.stat {\n font-size: 3rem;\n font-weight: 700;\n color: var(--primary);\n display: block;\n margin-bottom: 0.5rem;\n}\n\n.demo-form {\n max-width: 800px;\n margin: 2rem auto;\n}\n\n.form-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));\n gap: 1rem;\n margin-bottom: 2rem;\n}\n\n.form-group input {\n width: 100%;\n padding: 0.75rem;\n border: 2px solid var(--accent);\n border-radius: 0.5rem;\n font-size: 1rem;\n transition: border-color 0.3s ease;\n}\n\n.form-group input:focus {\n outline: none;\n border-color: var(--primary);\n}\n\nfooter {\n background: var(--text);\n color: var(--background);\n padding: 2rem 0;\n text-align: center;\n}\n\n@media (max-width: 768px) {\n .hero h2 {\n font-size: 2rem;\n }\n \n .nav-header .container {\n flex-direction: column;\n gap: 1rem;\n }\n \n nav ul {\n gap: 1rem;\n }\n \n .btn {\n display: block;\n margin: 1rem auto;\n width: 100%;\n max-width: 300px;\n }\n \n .btn.secondary {\n margin-left: 0;\n }\n}\n\n---script.js---\ndocument.addEventListener('DOMContentLoaded', function() {\n // Smooth scrolling for navigation links\n document.querySelectorAll('a[href^=\"#\"]').forEach(anchor => {\n anchor.addEventListener('click', function (e) {\n e.preventDefault();\n const target = document.querySelector(this.getAttribute('href'));\n if (target) {\n target.scrollIntoView({\n behavior: 'smooth',\n block: 'start'\n });\n }\n });\n });\n\n // Form submission handling\n const demoForm = document.getElementById('demoForm');\n if (demoForm) {\n demoForm.addEventListener('submit', function(e) {\n e.preventDefault();\n \n // Collect form data\n const formData = {\n name: document.getElementById('name').value,\n email: document.getElementById('email').value,\n company: document.getElementById('company').value,\n title: document.getElementById('title').value\n };\n\n // Show success message (in production, you'd send this to a server)\n alert('Thank you for your interest! We will contact you shortly.');\n demoForm.reset();\n });\n }\n\n // Intersection Observer for animation\n const observerOptions = {\n threshold: 0.1,\n rootMargin: '0px'\n };\n\n const observer = new IntersectionObserver((entries) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n entry.target.classList.add('animate');\n observer.unobserve(entry.target);\n }\n });\n }, observerOptions);\n\n // Observe all cards\n document.querySelectorAll('.feature-card, .stat-card').forEach(card => {\n observer.observe(card);\n });\n});\n\n---end---\n\nThis implementation creates a modern, responsive, and engaging website for ConverSales AI. Key features include:\n\n1. Clean, semantic HTML5 structure\n2. Modern CSS with variables and fluid layouts\n3. Smooth scrolling navigation\n4. Responsive design that works on all devices\n5. Interactive animations and hover effects\n6. Form validation and submission handling\n7. Intersection Observer for scroll animations\n8. Accessible design patterns\n9. Performance optimized with minimal JavaScript\n10. Beautiful gradient backgrounds and card designs\n\nThe domain name \"conversales.scroll.pub\" is short, memorable, and directly relates to the business purpose. The website follows all modern best practices while maintaining simplicity and professionalism." + } + ], + "stop_reason": "end_turn", + "stop_sequence": null, + "usage": { + "input_tokens": 701, + "cache_creation_input_tokens": 0, + "cache_read_input_tokens": 0, + "output_tokens": 2898 + } +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..8d57d71 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# conversales1.scroll.pub +Website generated by Claude from prompt: ConverSales AI: Turn Cold Leads Into Sales With Our ChatGPT Powered SMS Systems Performance-Based Partnership: Zero Upfront Costs! Got unconverted leads? Our ChatGPT Powered SMS Androids open persuasive sms conversations that get up to 30% reply rates and 12-18% booking rates. Turn 'meh' into 'heck yeah'—it's like texting a buddy, but smarter and more persuasive. Ready to see it work? Let's go. Read G-doc Case Study (3min read) Test Drive Our Sales Android Now Tell us about yourself and your business. Your Name * Company Name * Main Product/Service * Start Conversation Powerful Features for Maximum Conversion Everything you need to transform your cold leads into sales opportunities Database Reactivation Sales Android This ChatGPT powered SMS Sales Android initiates human-like persuasive SMS conversations with your old unconverted leads database, intelligently persuading and converting them into sales/appointments. Pull new sales from leads you thought were dead 48hr Sales Android Expertly trained to open human-like SMS conversations, this Android engages leads from the last 48 hours through sms who've ignored your calls, keeping them warm and booking them into appointments before they go cold or turn to competitors. Abandoned Cart Recovery Android Proven to boost e-commerce revenue, this Android uses persuasive, human-like SMS conversations to reach out to abandoned cart customers, persuading them to complete their purchases and drive more sales. Some of Our Clients Have Seen Results Like These Our AI ChatGPT SMS Systems transforms your business operations and boosts your profits. 40% Labor Cost Reduction 25% Revenue Increase 60hrs/month Time Saved Request a Demo See how our AI-powered SMS system can transform your cold leads into sales opportunities. Name Business Email Company Name Job Title Request Demo © 2024 ConverSales AI. All rights reserved. \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..38a5f56 --- /dev/null +++ b/script.js @@ -0,0 +1,55 @@ +document.addEventListener('DOMContentLoaded', function() { + // Smooth scrolling for navigation links + document.querySelectorAll('a[href^="#"]').forEach(anchor => { + anchor.addEventListener('click', function (e) { + e.preventDefault(); + const target = document.querySelector(this.getAttribute('href')); + if (target) { + target.scrollIntoView({ + behavior: 'smooth', + block: 'start' + }); + } + }); + }); + + // Form submission handling + const demoForm = document.getElementById('demoForm'); + if (demoForm) { + demoForm.addEventListener('submit', function(e) { + e.preventDefault(); + + // Collect form data + const formData = { + name: document.getElementById('name').value, + email: document.getElementById('email').value, + company: document.getElementById('company').value, + title: document.getElementById('title').value + }; + + // Show success message (in production, you'd send this to a server) + alert('Thank you for your interest! We will contact you shortly.'); + demoForm.reset(); + }); + } + + // Intersection Observer for animation + const observerOptions = { + threshold: 0.1, + rootMargin: '0px' + }; + + const observer = new IntersectionObserver((entries) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('animate'); + observer.unobserve(entry.target); + } + }); + }, observerOptions); + + // Observe all cards + document.querySelectorAll('.feature-card, .stat-card').forEach(card => { + observer.observe(card); + }); +}); diff --git a/style.css b/style.css new file mode 100644 index 0000000..ce71084 --- /dev/null +++ b/style.css @@ -0,0 +1,190 @@ +:root { + --primary: #2563eb; + --secondary: #1e40af; + --text: #1f2937; + --background: #ffffff; + --accent: #dbeafe; +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, sans-serif; + line-height: 1.6; + color: var(--text); +} + +.container { + max-width: 1200px; + margin: 0 auto; + padding: 0 2rem; +} + +.nav-header { + background: var(--background); + box-shadow: 0 2px 4px rgba(0,0,0,0.1); + position: fixed; + width: 100%; + top: 0; + z-index: 100; +} + +.nav-header .container { + display: flex; + justify-content: space-between; + align-items: center; + padding: 1rem 2rem; +} + +nav ul { + display: flex; + gap: 2rem; + list-style: none; +} + +nav a { + text-decoration: none; + color: var(--text); + font-weight: 500; + transition: color 0.3s ease; +} + +nav a:hover { + color: var(--primary); +} + +.hero { + padding: 8rem 0 4rem; + background: linear-gradient(135deg, var(--accent), var(--background)); + text-align: center; +} + +.hero h2 { + font-size: 3rem; + margin-bottom: 1rem; + line-height: 1.2; +} + +.subtitle { + font-size: 1.25rem; + margin-bottom: 2rem; +} + +.btn { + display: inline-block; + padding: 0.75rem 1.5rem; + border-radius: 0.5rem; + text-decoration: none; + font-weight: 600; + transition: transform 0.3s ease; +} + +.btn:hover { + transform: translateY(-2px); +} + +.btn.primary { + background: var(--primary); + color: white; +} + +.btn.secondary { + background: var(--background); + color: var(--primary); + border: 2px solid var(--primary); + margin-left: 1rem; +} + +.features, .results, .demo { + padding: 4rem 0; +} + +.features-grid, .stats-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); + gap: 2rem; + margin-top: 2rem; +} + +.feature-card, .stat-card { + padding: 2rem; + background: var(--background); + border-radius: 1rem; + box-shadow: 0 4px 6px rgba(0,0,0,0.1); + transition: transform 0.3s ease; +} + +.feature-card:hover, .stat-card:hover { + transform: translateY(-5px); +} + +.stat { + font-size: 3rem; + font-weight: 700; + color: var(--primary); + display: block; + margin-bottom: 0.5rem; +} + +.demo-form { + max-width: 800px; + margin: 2rem auto; +} + +.form-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); + gap: 1rem; + margin-bottom: 2rem; +} + +.form-group input { + width: 100%; + padding: 0.75rem; + border: 2px solid var(--accent); + border-radius: 0.5rem; + font-size: 1rem; + transition: border-color 0.3s ease; +} + +.form-group input:focus { + outline: none; + border-color: var(--primary); +} + +footer { + background: var(--text); + color: var(--background); + padding: 2rem 0; + text-align: center; +} + +@media (max-width: 768px) { + .hero h2 { + font-size: 2rem; + } + + .nav-header .container { + flex-direction: column; + gap: 1rem; + } + + nav ul { + gap: 1rem; + } + + .btn { + display: block; + margin: 1rem auto; + width: 100%; + max-width: 300px; + } + + .btn.secondary { + margin-left: 0; + } +}