commit 67c0ed0f6196ba1b95990017ec5708cf25ca68ec
Author: root <root@hub.scroll.pub>
Date: 2024-12-31 06:00:49 +0000
Subject: Initial commit
diff --git a/body.html b/body.html
new file mode 100644
index 0000000..10eb261
--- /dev/null
+++ b/body.html
@@ -0,0 +1,86 @@
+<header>
+ <nav class="main-nav">
+ <div class="logo">FundHub</div>
+ <div class="nav-links">
+ <a href="#funds">Funds</a>
+ <a href="#analysis">Analysis</a>
+ <a href="#portfolio">Portfolio</a>
+ <a href="#news">News</a>
+ </div>
+ <button class="mobile-menu" aria-label="Menu">☰</button>
+ </nav>
+</header>
+
+<main>
+ <section class="hero">
+ <h1>智能基金投资管理平台</h1>
+ <p>专业的基金数据分析与投资组合管理工具</p>
+ <button class="cta-button">开始投资</button>
+ </section>
+
+ <section id="funds" class="fund-section">
+ <h2>热门基金</h2>
+ <div class="fund-grid">
+ <div class="fund-card">
+ <h3>股票型基金</h3>
+ <div class="fund-stats">
+ <div class="stat">
+ <span class="value">+12.5%</span>
+ <span class="label">年收益率</span>
+ </div>
+ <div class="stat">
+ <span class="value">4.8</span>
+ <span class="label">风险等级</span>
+ </div>
+ </div>
+ </div>
+ <div class="fund-card">
+ <h3>债券型基金</h3>
+ <div class="fund-stats">
+ <div class="stat">
+ <span class="value">+5.2%</span>
+ <span class="label">年收益率</span>
+ </div>
+ <div class="stat">
+ <span class="value">2.1</span>
+ <span class="label">风险等级</span>
+ </div>
+ </div>
+ </div>
+ <div class="fund-card">
+ <h3>混合型基金</h3>
+ <div class="fund-stats">
+ <div class="stat">
+ <span class="value">+8.7%</span>
+ <span class="label">年收益率</span>
+ </div>
+ <div class="stat">
+ <span class="value">3.5</span>
+ <span class="label">风险等级</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="analysis" class="analysis-section">
+ <h2>市场分析</h2>
+ <div class="chart-container">
+ <canvas id="marketChart"></canvas>
+ </div>
+ </section>
+</main>
+
+<footer>
+ <div class="footer-content">
+ <div class="footer-section">
+ <h4>关于我们</h4>
+ <p>FundHub致力于为投资者提供专业的基金投资解决方案</p>
+ </div>
+ <div class="footer-section">
+ <h4>联系方式</h4>
+ <p>邮箱: contact@fundhub.scroll.pub</p>
+ <p>电话: 400-888-8888</p>
+ </div>
+ </div>
+</footer>
diff --git a/index.scroll b/index.scroll
new file mode 100644
index 0000000..f73941a
--- /dev/null
+++ b/index.scroll
@@ -0,0 +1,10 @@
+buildHtml
+baseUrl https://fundhub.scroll.pub
+metaTags
+ description "Professional fund management and investment tracking platform. Get real-time fund data, analysis tools, and portfolio management."
+ keywords "fund management, investment tracking, portfolio analysis, mutual funds, ETFs"
+editButton /edit.html
+title FundHub - Smart Fund Management Platform
+style.css
+body.html
+script.js
diff --git a/prompt.json b/prompt.json
new file mode 100644
index 0000000..5cc1324
--- /dev/null
+++ b/prompt.json
@@ -0,0 +1,20 @@
+{
+ "id": "msg_01GpwF1Xg2qi6oTxQ3c6XWy5",
+ "type": "message",
+ "role": "assistant",
+ "model": "claude-3-5-sonnet-20241022",
+ "content": [
+ {
+ "type": "text",
+ "text": "I'll create a professional fund/investment website.\n\n---domain---\nfundhub.scroll.pub\n\n---index.scroll---\nbuildHtml\nbaseUrl https://fundhub.scroll.pub\nmetaTags\n description \"Professional fund management and investment tracking platform. Get real-time fund data, analysis tools, and portfolio management.\"\n keywords \"fund management, investment tracking, portfolio analysis, mutual funds, ETFs\"\neditButton /edit.html\ntitle FundHub - Smart Fund Management Platform\nstyle.css\nbody.html\nscript.js\n\n---body.html---\n<header>\n <nav class=\"main-nav\">\n <div class=\"logo\">FundHub</div>\n <div class=\"nav-links\">\n <a href=\"#funds\">Funds</a>\n <a href=\"#analysis\">Analysis</a>\n <a href=\"#portfolio\">Portfolio</a>\n <a href=\"#news\">News</a>\n </div>\n <button class=\"mobile-menu\" aria-label=\"Menu\">☰</button>\n </nav>\n</header>\n\n<main>\n <section class=\"hero\">\n <h1>智能基金投资管理平台</h1>\n <p>专业的基金数据分析与投资组合管理工具</p>\n <button class=\"cta-button\">开始投资</button>\n </section>\n\n <section id=\"funds\" class=\"fund-section\">\n <h2>热门基金</h2>\n <div class=\"fund-grid\">\n <div class=\"fund-card\">\n <h3>股票型基金</h3>\n <div class=\"fund-stats\">\n <div class=\"stat\">\n <span class=\"value\">+12.5%</span>\n <span class=\"label\">年收益率</span>\n </div>\n <div class=\"stat\">\n <span class=\"value\">4.8</span>\n <span class=\"label\">风险等级</span>\n </div>\n </div>\n </div>\n <div class=\"fund-card\">\n <h3>债券型基金</h3>\n <div class=\"fund-stats\">\n <div class=\"stat\">\n <span class=\"value\">+5.2%</span>\n <span class=\"label\">年收益率</span>\n </div>\n <div class=\"stat\">\n <span class=\"value\">2.1</span>\n <span class=\"label\">风险等级</span>\n </div>\n </div>\n </div>\n <div class=\"fund-card\">\n <h3>混合型基金</h3>\n <div class=\"fund-stats\">\n <div class=\"stat\">\n <span class=\"value\">+8.7%</span>\n <span class=\"label\">年收益率</span>\n </div>\n <div class=\"stat\">\n <span class=\"value\">3.5</span>\n <span class=\"label\">风险等级</span>\n </div>\n </div>\n </div>\n </div>\n </section>\n\n <section id=\"analysis\" class=\"analysis-section\">\n <h2>市场分析</h2>\n <div class=\"chart-container\">\n <canvas id=\"marketChart\"></canvas>\n </div>\n </section>\n</main>\n\n<footer>\n <div class=\"footer-content\">\n <div class=\"footer-section\">\n <h4>关于我们</h4>\n <p>FundHub致力于为投资者提供专业的基金投资解决方案</p>\n </div>\n <div class=\"footer-section\">\n <h4>联系方式</h4>\n <p>邮箱: contact@fundhub.scroll.pub</p>\n <p>电话: 400-888-8888</p>\n </div>\n </div>\n</footer>\n\n---style.css---\n:root {\n --primary-color: #2c3e50;\n --accent-color: #3498db;\n --background-color: #f8f9fa;\n --text-color: #2c3e50;\n --card-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\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, sans-serif;\n color: var(--text-color);\n line-height: 1.6;\n}\n\n.main-nav {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 1rem 2rem;\n background: var(--primary-color);\n color: white;\n position: fixed;\n width: 100%;\n top: 0;\n z-index: 1000;\n}\n\n.logo {\n font-size: 1.5rem;\n font-weight: bold;\n background: linear-gradient(45deg, #3498db, #2ecc71);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n\n.nav-links a {\n color: white;\n text-decoration: none;\n margin-left: 2rem;\n transition: color 0.3s ease;\n}\n\n.nav-links a:hover {\n color: var(--accent-color);\n}\n\n.mobile-menu {\n display: none;\n background: none;\n border: none;\n color: white;\n font-size: 1.5rem;\n cursor: pointer;\n}\n\n.hero {\n height: 100vh;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n text-align: center;\n background: linear-gradient(135deg, #2c3e50, #3498db);\n color: white;\n padding: 2rem;\n}\n\n.hero h1 {\n font-size: 3rem;\n margin-bottom: 1rem;\n animation: fadeInUp 1s ease;\n}\n\n.hero p {\n font-size: 1.2rem;\n margin-bottom: 2rem;\n animation: fadeInUp 1s ease 0.2s;\n opacity: 0;\n animation-fill-mode: forwards;\n}\n\n.cta-button {\n padding: 1rem 2rem;\n font-size: 1.1rem;\n background: var(--accent-color);\n color: white;\n border: none;\n border-radius: 5px;\n cursor: pointer;\n transition: transform 0.3s ease;\n animation: fadeInUp 1s ease 0.4s;\n opacity: 0;\n animation-fill-mode: forwards;\n}\n\n.cta-button:hover {\n transform: translateY(-2px);\n}\n\n.fund-section {\n padding: 4rem 2rem;\n background: var(--background-color);\n}\n\n.fund-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n gap: 2rem;\n margin-top: 2rem;\n}\n\n.fund-card {\n background: white;\n padding: 2rem;\n border-radius: 10px;\n box-shadow: var(--card-shadow);\n transition: transform 0.3s ease;\n}\n\n.fund-card:hover {\n transform: translateY(-5px);\n}\n\n.fund-stats {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 1rem;\n margin-top: 1rem;\n}\n\n.stat {\n text-align: center;\n}\n\n.value {\n font-size: 1.5rem;\n font-weight: bold;\n color: var(--accent-color);\n}\n\n.label {\n font-size: 0.9rem;\n color: #666;\n}\n\n@keyframes fadeInUp {\n from {\n opacity: 0;\n transform: translateY(20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@media (max-width: 768px) {\n .mobile-menu {\n display: block;\n }\n\n .nav-links {\n display: none;\n }\n\n .nav-links.active {\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n background: var(--primary-color);\n padding: 1rem;\n }\n\n .nav-links.active a {\n margin: 0.5rem 0;\n }\n\n .hero h1 {\n font-size: 2rem;\n }\n}\n\n---script.js---\ndocument.addEventListener('DOMContentLoaded', function() {\n // Mobile menu toggle\n const mobileMenu = document.querySelector('.mobile-menu');\n const navLinks = document.querySelector('.nav-links');\n\n mobileMenu.addEventListener('click', () => {\n navLinks.classList.toggle('active');\n });\n\n // Smooth scroll for navigation links\n document.querySelectorAll('a[href^=\"#\"]').forEach(anchor => {\n anchor.addEventListener('click', function (e) {\n e.preventDefault();\n document.querySelector(this.getAttribute('href')).scrollIntoView({\n behavior: 'smooth'\n });\n });\n });\n\n // Market chart initialization\n const ctx = document.getElementById('marketChart').getContext('2d');\n const labels = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'];\n const data = [65, 59, 80, 81, 56, 55];\n\n function drawChart() {\n ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);\n ctx.beginPath();\n ctx.moveTo(0, ctx.canvas.height - data[0]);\n \n for (let i = 1; i < data.length; i++) {\n const x = (ctx.canvas.width / (data.length - 1)) * i;\n const y = ctx.canvas.height - data[i];\n ctx.lineTo(x, y);\n }\n \n ctx.strokeStyle = '#3498db';\n ctx.lineWidth = 2;\n ctx.stroke();\n }\n\n // Resize chart on window resize\n window.addEventListener('resize', () => {\n ctx.canvas.width = ctx.canvas.parentNode.offsetWidth;\n ctx.canvas.height = 300;\n drawChart();\n });\n\n // Initial chart draw\n ctx.canvas.width = ctx.canvas.parentNode.offsetWidth;\n ctx.canvas.height = 300;\n drawChart();\n});\n\n---end---"
+ }
+ ],
+ "stop_reason": "end_turn",
+ "stop_sequence": null,
+ "usage": {
+ "input_tokens": 281,
+ "cache_creation_input_tokens": 0,
+ "cache_read_input_tokens": 0,
+ "output_tokens": 2799
+ }
+}
\ No newline at end of file
diff --git a/readme.scroll b/readme.scroll
new file mode 100644
index 0000000..4586840
--- /dev/null
+++ b/readme.scroll
@@ -0,0 +1,2 @@
+# fundhub.scroll.pub
+Website generated by Claude from prompt: 给我一个基金相关的网站
\ No newline at end of file
diff --git a/script.js b/script.js
new file mode 100644
index 0000000..e747937
--- /dev/null
+++ b/script.js
@@ -0,0 +1,52 @@
+document.addEventListener('DOMContentLoaded', function() {
+ // Mobile menu toggle
+ const mobileMenu = document.querySelector('.mobile-menu');
+ const navLinks = document.querySelector('.nav-links');
+
+ mobileMenu.addEventListener('click', () => {
+ navLinks.classList.toggle('active');
+ });
+
+ // Smooth scroll for navigation links
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+ anchor.addEventListener('click', function (e) {
+ e.preventDefault();
+ document.querySelector(this.getAttribute('href')).scrollIntoView({
+ behavior: 'smooth'
+ });
+ });
+ });
+
+ // Market chart initialization
+ const ctx = document.getElementById('marketChart').getContext('2d');
+ const labels = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'];
+ const data = [65, 59, 80, 81, 56, 55];
+
+ function drawChart() {
+ ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
+ ctx.beginPath();
+ ctx.moveTo(0, ctx.canvas.height - data[0]);
+
+ for (let i = 1; i < data.length; i++) {
+ const x = (ctx.canvas.width / (data.length - 1)) * i;
+ const y = ctx.canvas.height - data[i];
+ ctx.lineTo(x, y);
+ }
+
+ ctx.strokeStyle = '#3498db';
+ ctx.lineWidth = 2;
+ ctx.stroke();
+ }
+
+ // Resize chart on window resize
+ window.addEventListener('resize', () => {
+ ctx.canvas.width = ctx.canvas.parentNode.offsetWidth;
+ ctx.canvas.height = 300;
+ drawChart();
+ });
+
+ // Initial chart draw
+ ctx.canvas.width = ctx.canvas.parentNode.offsetWidth;
+ ctx.canvas.height = 300;
+ drawChart();
+});
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..cd04486
--- /dev/null
+++ b/style.css
@@ -0,0 +1,190 @@
+:root {
+ --primary-color: #2c3e50;
+ --accent-color: #3498db;
+ --background-color: #f8f9fa;
+ --text-color: #2c3e50;
+ --card-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+}
+
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+
+body {
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+ color: var(--text-color);
+ line-height: 1.6;
+}
+
+.main-nav {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 1rem 2rem;
+ background: var(--primary-color);
+ color: white;
+ position: fixed;
+ width: 100%;
+ top: 0;
+ z-index: 1000;
+}
+
+.logo {
+ font-size: 1.5rem;
+ font-weight: bold;
+ background: linear-gradient(45deg, #3498db, #2ecc71);
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+}
+
+.nav-links a {
+ color: white;
+ text-decoration: none;
+ margin-left: 2rem;
+ transition: color 0.3s ease;
+}
+
+.nav-links a:hover {
+ color: var(--accent-color);
+}
+
+.mobile-menu {
+ display: none;
+ background: none;
+ border: none;
+ color: white;
+ font-size: 1.5rem;
+ cursor: pointer;
+}
+
+.hero {
+ height: 100vh;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ background: linear-gradient(135deg, #2c3e50, #3498db);
+ color: white;
+ padding: 2rem;
+}
+
+.hero h1 {
+ font-size: 3rem;
+ margin-bottom: 1rem;
+ animation: fadeInUp 1s ease;
+}
+
+.hero p {
+ font-size: 1.2rem;
+ margin-bottom: 2rem;
+ animation: fadeInUp 1s ease 0.2s;
+ opacity: 0;
+ animation-fill-mode: forwards;
+}
+
+.cta-button {
+ padding: 1rem 2rem;
+ font-size: 1.1rem;
+ background: var(--accent-color);
+ color: white;
+ border: none;
+ border-radius: 5px;
+ cursor: pointer;
+ transition: transform 0.3s ease;
+ animation: fadeInUp 1s ease 0.4s;
+ opacity: 0;
+ animation-fill-mode: forwards;
+}
+
+.cta-button:hover {
+ transform: translateY(-2px);
+}
+
+.fund-section {
+ padding: 4rem 2rem;
+ background: var(--background-color);
+}
+
+.fund-grid {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+ gap: 2rem;
+ margin-top: 2rem;
+}
+
+.fund-card {
+ background: white;
+ padding: 2rem;
+ border-radius: 10px;
+ box-shadow: var(--card-shadow);
+ transition: transform 0.3s ease;
+}
+
+.fund-card:hover {
+ transform: translateY(-5px);
+}
+
+.fund-stats {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ gap: 1rem;
+ margin-top: 1rem;
+}
+
+.stat {
+ text-align: center;
+}
+
+.value {
+ font-size: 1.5rem;
+ font-weight: bold;
+ color: var(--accent-color);
+}
+
+.label {
+ font-size: 0.9rem;
+ color: #666;
+}
+
+@keyframes fadeInUp {
+ from {
+ opacity: 0;
+ transform: translateY(20px);
+ }
+ to {
+ opacity: 1;
+ transform: translateY(0);
+ }
+}
+
+@media (max-width: 768px) {
+ .mobile-menu {
+ display: block;
+ }
+
+ .nav-links {
+ display: none;
+ }
+
+ .nav-links.active {
+ display: flex;
+ flex-direction: column;
+ position: absolute;
+ top: 100%;
+ left: 0;
+ right: 0;
+ background: var(--primary-color);
+ padding: 1rem;
+ }
+
+ .nav-links.active a {
+ margin: 0.5rem 0;
+ }
+
+ .hero h1 {
+ font-size: 2rem;
+ }
+}