commit b99f95498c8f18491144c1b0728e5f46fc705a17
Author: root <root@hub.scroll.pub> Date: 2024-12-26 23:34:59 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..bd404b0 --- /dev/null +++ b/body.html @@ -0,0 +1,96 @@ +<header> + <nav class="navbar"> + <div class="logo">TradeWise</div> + <button class="mobile-menu" aria-label="Toggle menu"> + <span></span><span></span><span></span> + </button> + <ul class="nav-links"> + <li><a href="#home">Home</a></li> + <li><a href="#indicators">Indicators</a></li> + <li><a href="#pricing">Pricing</a></li> + <li><a href="#contact">Contact</a></li> + <li><a href="#login" class="login-btn">Login</a></li> + </ul> + </nav> +</header> + +<main> + <section id="home" class="hero"> + <div class="hero-content"> + <h1>Professional Trading Indicators</h1> + <p>Elevate your trading with our premium TradingView indicators</p> + <a href="#indicators" class="cta-button">Explore Indicators</a> + </div> + </section> + + <section id="indicators" class="indicators"> + <h2>Our Indicators</h2> + <div class="indicator-grid"> + <article class="indicator-card"> + <div class="indicator-preview"></div> + <h3>Trend Master Pro</h3> + <p>Advanced trend detection with multi-timeframe analysis</p> + <button class="preview-btn">Preview</button> + </article> + <article class="indicator-card"> + <div class="indicator-preview"></div> + <h3>Volume Flow Elite</h3> + <p>Smart volume analysis with institutional order flow</p> + <button class="preview-btn">Preview</button> + </article> + <article class="indicator-card"> + <div class="indicator-preview"></div> + <h3>Momentum Scanner</h3> + <p>Real-time momentum detection and signal generation</p> + <button class="preview-btn">Preview</button> + </article> + </div> + </section> + + <section id="pricing" class="pricing"> + <h2>Pricing Plans</h2> + <div class="pricing-grid"> + <div class="price-card"> + <h3>Basic</h3> + <p class="price">$29<span>/month</span></p> + <ul> + <li>2 Basic Indicators</li> + <li>Email Support</li> + <li>Basic Updates</li> + </ul> + <button class="subscribe-btn">Subscribe</button> + </div> + <div class="price-card featured"> + <h3>Pro</h3> + <p class="price">$49<span>/month</span></p> + <ul> + <li>All Indicators</li> + <li>Priority Support</li> + <li>Premium Updates</li> + </ul> + <button class="subscribe-btn">Subscribe</button> + </div> + </div> + </section> +</main> + +<footer> + <div class="footer-content"> + <div class="footer-section"> + <h4>TradeWise</h4> + <p>Professional trading indicators for serious traders</p> + </div> + <div class="footer-section"> + <h4>Quick Links</h4> + <ul> + <li><a href="#home">Home</a></li> + <li><a href="#indicators">Indicators</a></li> + <li><a href="#pricing">Pricing</a></li> + </ul> + </div> + <div class="footer-section"> + <h4>Contact</h4> + <p>support@tradewise.scroll.pub</p> + </div> + </div> +</footer> diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..42e6184 --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://tradewise.scroll.pub +metaTags +editButton /edit.html +title TradeWise - Premium Trading Indicators +style.css +body.html +script.js diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..4fdd58c --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# tradewise.scroll.pub +Website generated from prompt: copy of indicator service provider for tradingview with modern and clean ui \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..02655f6 --- /dev/null +++ b/script.js @@ -0,0 +1,44 @@ +document.addEventListener('DOMContentLoaded', () => { + // Mobile menu toggle + const mobileMenu = document.querySelector('.mobile-menu'); + const navLinks = document.querySelector('.nav-links'); + + mobileMenu?.addEventListener('click', () => { + navLinks.style.display = navLinks.style.display === 'flex' ? 'none' : 'flex'; + }); + + // Smooth scroll 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' + }); + } + }); + }); + + // Intersection Observer for fade-in animations + const observerOptions = { + threshold: 0.1, + rootMargin: '0px 0px -50px 0px' + }; + + const observer = new IntersectionObserver((entries) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.style.opacity = '1'; + entry.target.style.transform = 'translateY(0)'; + } + }); + }, observerOptions); + + document.querySelectorAll('.indicator-card, .price-card').forEach(el => { + el.style.opacity = '0'; + el.style.transform = 'translateY(20px)'; + el.style.transition = 'opacity 0.6s ease, transform 0.6s ease'; + observer.observe(el); + }); +}); diff --git a/style.css b/style.css new file mode 100644 index 0000000..051491d --- /dev/null +++ b/style.css @@ -0,0 +1,207 @@ +:root { + --primary: #2962ff; + --secondary: #0039cb; + --text: #333; + --bg: #ffffff; + --card-bg: #f8f9fa; + --accent: #7c4dff; +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; + line-height: 1.6; + color: var(--text); +} + +.navbar { + position: fixed; + width: 100%; + padding: 1rem 2rem; + background: rgba(255, 255, 255, 0.95); + backdrop-filter: blur(10px); + display: flex; + justify-content: space-between; + align-items: center; + z-index: 1000; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); +} + +.logo { + font-size: 1.5rem; + font-weight: 700; + color: var(--primary); +} + +.nav-links { + display: flex; + gap: 2rem; + list-style: none; +} + +.nav-links a { + text-decoration: none; + color: var(--text); + font-weight: 500; + transition: color 0.3s ease; +} + +.nav-links a:hover { + color: var(--primary); +} + +.login-btn { + background: var(--primary); + color: white !important; + padding: 0.5rem 1.5rem; + border-radius: 25px; + transition: background-color 0.3s ease; +} + +.login-btn:hover { + background: var(--secondary); +} + +.hero { + height: 100vh; + display: flex; + align-items: center; + justify-content: center; + text-align: center; + background: linear-gradient(135deg, #f5f7ff 0%, #e8eaff 100%); +} + +.hero-content { + padding: 2rem; +} + +.hero h1 { + font-size: 3.5rem; + margin-bottom: 1rem; + background: linear-gradient(45deg, var(--primary), var(--accent)); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +.cta-button { + display: inline-block; + padding: 1rem 2rem; + background: var(--primary); + color: white; + text-decoration: none; + border-radius: 30px; + font-weight: 600; + transition: transform 0.3s ease, box-shadow 0.3s ease; +} + +.cta-button:hover { + transform: translateY(-2px); + box-shadow: 0 4px 20px rgba(41, 98, 255, 0.3); +} + +.indicators { + padding: 5rem 2rem; +} + +.indicator-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 2rem; + margin-top: 3rem; +} + +.indicator-card { + background: var(--card-bg); + border-radius: 15px; + padding: 1.5rem; + transition: transform 0.3s ease; + box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05); +} + +.indicator-card:hover { + transform: translateY(-5px); +} + +.indicator-preview { + height: 200px; + background: linear-gradient(45deg, #e8eaff, #f5f7ff); + border-radius: 10px; + margin-bottom: 1rem; +} + +.pricing-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: 2rem; + padding: 2rem; +} + +.price-card { + background: var(--card-bg); + border-radius: 15px; + padding: 2rem; + text-align: center; + transition: transform 0.3s ease; +} + +.price-card.featured { + background: linear-gradient(135deg, var(--primary), var(--accent)); + color: white; +} + +.price { + font-size: 2.5rem; + font-weight: 700; + margin: 1rem 0; +} + +.price span { + font-size: 1rem; + opacity: 0.8; +} + +.subscribe-btn { + width: 100%; + padding: 1rem; + border: none; + border-radius: 25px; + background: var(--primary); + color: white; + font-weight: 600; + cursor: pointer; + transition: transform 0.3s ease; +} + +.subscribe-btn:hover { + transform: scale(1.05); +} + +footer { + background: #f8f9fa; + padding: 3rem 2rem; +} + +.footer-content { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: 2rem; +} + +@media (max-width: 768px) { + .mobile-menu { + display: block; + } + + .nav-links { + display: none; + } + + .hero h1 { + font-size: 2.5rem; + } +}