commit 245defb368e82a7f155240f59a44a6ef0da85352
Author: root <root@hub.scroll.pub> Date: 2024-12-27 05:12:40 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..6ea3180 --- /dev/null +++ b/body.html @@ -0,0 +1,42 @@ +<header class="hero"> + <h1>Gold or Crypto: The 5-Year Investment Showdown</h1> + <p>Explore the historical trends, market correlations, and future potential of these two iconic assets.</p> +</header> + +<section class="comparison"> + <div class="asset gold"> + <h2>Gold</h2> + <p>The timeless store of value, gold has been a safe haven for centuries.</p> + <ul> + <li>Historical stability</li> + <li>Inflation hedge</li> + <li>Physical asset</li> + </ul> + </div> + <div class="asset crypto"> + <h2>Crypto</h2> + <p>The digital revolution in finance, cryptocurrencies offer high growth potential.</p> + <ul> + <li>High volatility</li> + <li>Decentralized</li> + <li>Technological innovation</li> + </ul> + </div> +</section> + +<section class="analysis"> + <h2>Historical Performance</h2> + <div class="chart-container"> + <canvas id="performanceChart"></canvas> + </div> + <p>Analyzing the past 5 years of gold and crypto performance reveals interesting trends.</p> +</section> + +<section class="future"> + <h2>Future Projections</h2> + <p>What does the next 5 years hold for these assets? We examine macroeconomic factors, technological advancements, and market sentiment.</p> +</section> + +<footer> + <p>Disclaimer: This is not financial advice. Always do your own research before investing.</p> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..62ddefa --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://goldorcrypto.scroll.pub +metaTags +editButton /edit.html +title Gold or Crypto: The 5-Year Investment Showdown +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..e4fe483 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# goldorcrypto.scroll.pub +Website generated by DeepSeek from prompt: I want to create a website that look at the decision to invest in crypto or gold in the next 5 years. Look at historical macro correlations and other market factors. Be creative! \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..63f8b5e --- /dev/null +++ b/script.js @@ -0,0 +1,31 @@ +document.addEventListener('DOMContentLoaded', function() { + const ctx = document.getElementById('performanceChart').getContext('2d'); + new Chart(ctx, { + type: 'line', + data: { + labels: ['2018', '2019', '2020', '2021', '2022', '2023'], + datasets: [ + { + label: 'Gold', + data: [1200, 1300, 1500, 1800, 1700, 1900], + borderColor: '#FFD700', + fill: false, + }, + { + label: 'Crypto', + data: [3000, 4000, 7000, 30000, 50000, 25000], + borderColor: '#4B33A8', + fill: false, + }, + ], + }, + options: { + responsive: true, + scales: { + y: { + beginAtZero: false, + }, + }, + }, + }); +}); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..dc4b783 --- /dev/null +++ b/style.css @@ -0,0 +1,100 @@ +:root { + --gold: #FFD700; + --crypto: #4B33A8; + --text: #333; + --background: #f4f4f4; +} + +body { + font-family: 'Arial', sans-serif; + color: var(--text); + background-color: var(--background); + margin: 0; + padding: 0; + line-height: 1.6; +} + +.hero { + background: linear-gradient(135deg, var(--gold), var(--crypto)); + color: white; + padding: 4rem 2rem; + text-align: center; +} + +.hero h1 { + font-size: 2.5rem; + margin-bottom: 1rem; +} + +.comparison { + display: flex; + justify-content: space-around; + padding: 2rem; + flex-wrap: wrap; +} + +.asset { + background: white; + padding: 2rem; + border-radius: 10px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + width: 45%; + margin: 1rem 0; +} + +.asset.gold { + border-bottom: 5px solid var(--gold); +} + +.asset.crypto { + border-bottom: 5px solid var(--crypto); +} + +.asset h2 { + font-size: 2rem; + margin-bottom: 1rem; +} + +.asset ul { + list-style: none; + padding: 0; +} + +.asset li { + margin: 0.5rem 0; +} + +.analysis, .future { + padding: 2rem; + background: white; + margin: 2rem 0; + border-radius: 10px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); +} + +.chart-container { + width: 100%; + max-width: 800px; + margin: 0 auto; +} + +footer { + text-align: center; + padding: 1rem; + background: var(--text); + color: white; +} + +@media (max-width: 768px) { + .comparison { + flex-direction: column; + } + + .asset { + width: 100%; + } + + .hero h1 { + font-size: 2rem; + } +} \ No newline at end of file