commit 6fb1a4d0bce7b779b41be4747d1b74b3819b5765
Author: root <root@hub.scroll.pub> Date: 2024-12-27 09:10:10 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..278c20a --- /dev/null +++ b/body.html @@ -0,0 +1,51 @@ +<header class="hero"> + <div class="hero-content"> + <h1>Welcome to AppShowcase</h1> + <p>Your gateway to innovative and transformative applications</p> + <a href="#features" class="cta-button">Explore Features</a> + </div> +</header> + +<section id="features" class="features"> + <h2>Key Features</h2> + <div class="feature-grid"> + <div class="feature-card"> + <div class="icon">📱</div> + <h3>Intuitive Design</h3> + <p>Experience seamless navigation and user-friendly interfaces.</p> + </div> + <div class="feature-card"> + <div class="icon">⚡</div> + <h3>High Performance</h3> + <p>Enjoy fast and efficient performance across all devices.</p> + </div> + <div class="feature-card"> + <div class="icon">🔒</div> + <h3>Secure & Reliable</h3> + <p>Your data is protected with top-notch security measures.</p> + </div> + </div> +</section> + +<section class="testimonials"> + <h2>What Our Users Say</h2> + <div class="testimonial-slider"> + <div class="testimonial"> + <p>"AppShowcase has revolutionized the way I discover new apps. Highly recommended!"</p> + <p class="author">- Jane Doe</p> + </div> + <div class="testimonial"> + <p>"The intuitive design and performance are unmatched. A must-have for app enthusiasts."</p> + <p class="author">- John Smith</p> + </div> + </div> +</section> + +<footer> + <p>Connect with us on social media for the latest updates.</p> + <div class="social-links"> + <a href="#">Twitter</a> + <a href="#">Facebook</a> + <a href="#">Instagram</a> + </div> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..25f34ed --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://appshowcase.scroll.pub +metaTags +editButton /edit.html +title AppShowcase - Discover the Future of Apps +style.css +body.html +script.js \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..2f97b74 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# appshowcase.scroll.pub +Website generated by DeepSeek from prompt: 建立一个 app 介绍页 \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..87b40ae --- /dev/null +++ b/script.js @@ -0,0 +1,18 @@ +document.addEventListener('DOMContentLoaded', function() { + const testimonials = document.querySelectorAll('.testimonial'); + let currentTestimonial = 0; + + function showTestimonial(index) { + testimonials.forEach((testimonial, i) => { + testimonial.style.display = i === index ? 'block' : 'none'; + }); + } + + function nextTestimonial() { + currentTestimonial = (currentTestimonial + 1) % testimonials.length; + showTestimonial(currentTestimonial); + } + + setInterval(nextTestimonial, 5000); + showTestimonial(currentTestimonial); +}); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..3f5e453 --- /dev/null +++ b/style.css @@ -0,0 +1,168 @@ +:root { + --primary-color: #3498db; + --secondary-color: #2ecc71; + --background-color: #f4f4f4; + --text-color: #333; + --white: #fff; +} + +body { + font-family: 'Arial', sans-serif; + line-height: 1.6; + color: var(--text-color); + background-color: var(--background-color); + margin: 0; + padding: 0; +} + +.hero { + background: linear-gradient(135deg, var(--primary-color), var(--secondary-color)); + color: var(--white); + padding: 100px 20px; + text-align: center; +} + +.hero-content h1 { + font-size: 3rem; + margin-bottom: 20px; +} + +.hero-content p { + font-size: 1.2rem; + margin-bottom: 30px; +} + +.cta-button { + background-color: var(--white); + color: var(--primary-color); + padding: 10px 20px; + text-decoration: none; + border-radius: 5px; + font-weight: bold; + transition: background-color 0.3s ease; +} + +.cta-button:hover { + background-color: var(--secondary-color); + color: var(--white); +} + +.features { + padding: 50px 20px; + text-align: center; +} + +.features h2 { + font-size: 2.5rem; + margin-bottom: 40px; +} + +.feature-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: 20px; +} + +.feature-card { + background: var(--white); + padding: 20px; + border-radius: 10px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + transition: transform 0.3s ease; +} + +.feature-card:hover { + transform: translateY(-10px); +} + +.feature-card .icon { + font-size: 3rem; + margin-bottom: 20px; +} + +.feature-card h3 { + font-size: 1.5rem; + margin-bottom: 10px; +} + +.feature-card p { + font-size: 1rem; +} + +.testimonials { + background: var(--white); + padding: 50px 20px; + text-align: center; +} + +.testimonials h2 { + font-size: 2.5rem; + margin-bottom: 40px; +} + +.testimonial-slider { + display: flex; + justify-content: center; + gap: 20px; +} + +.testimonial { + background: var(--background-color); + padding: 20px; + border-radius: 10px; + max-width: 400px; +} + +.testimonial p { + font-size: 1rem; + margin-bottom: 10px; +} + +.testimonial .author { + font-weight: bold; +} + +footer { + background: var(--primary-color); + color: var(--white); + padding: 20px; + text-align: center; +} + +footer p { + margin-bottom: 10px; +} + +.social-links a { + color: var(--white); + text-decoration: none; + margin: 0 10px; + transition: color 0.3s ease; +} + +.social-links a:hover { + color: var(--secondary-color); +} + +@media (max-width: 768px) { + .hero-content h1 { + font-size: 2rem; + } + + .hero-content p { + font-size: 1rem; + } + + .features h2, .testimonials h2 { + font-size: 2rem; + } + + .feature-grid { + grid-template-columns: 1fr; + } + + .testimonial-slider { + flex-direction: column; + align-items: center; + } +} \ No newline at end of file