commit 5c8840fb7b019a5da7ffd00581ada2c1116bd6c7
Author: root <root@hub.scroll.pub>
Date: 2024-12-27 14:31:40 +0000
Subject: Initial commit
diff --git a/body.html b/body.html
new file mode 100644
index 0000000..d9218a7
--- /dev/null
+++ b/body.html
@@ -0,0 +1,40 @@
+<header>
+ <h1>Peaceful Path</h1>
+ <p>Empowering Choices for Peaceful Protest</p>
+</header>
+
+<main>
+ <section id="intro">
+ <h2>Welcome to Peaceful Path</h2>
+ <p>This interactive app helps you choose the best type of peaceful protest for your situation. Explore the options below and make your voice heard.</p>
+ </section>
+
+ <section id="protest-options">
+ <h2>Choose Your Protest</h2>
+ <div class="option" data-type="silent-vigil">
+ <h3>Silent Vigil</h3>
+ <p>A quiet, reflective protest that speaks volumes through presence.</p>
+ </div>
+ <div class="option" data-type="march">
+ <h3>March</h3>
+ <p>Join a group and walk together to show solidarity.</p>
+ </div>
+ <div class="option" data-type="artistic">
+ <h3>Artistic Expression</h3>
+ <p>Use art, music, or performance to convey your message.</p>
+ </div>
+ <div class="option" data-type="tiananmen">
+ <h3>Tiananmen Square</h3>
+ <p>Learn about the historical significance of Tiananmen Square.</p>
+ </div>
+ </section>
+
+ <section id="result">
+ <h2>Your Chosen Path</h2>
+ <div id="result-content"></div>
+ </section>
+</main>
+
+<footer>
+ <p>Stay safe and make your voice heard.</p>
+</footer>
\ No newline at end of file
diff --git a/index.scroll b/index.scroll
new file mode 100644
index 0000000..eb69747
--- /dev/null
+++ b/index.scroll
@@ -0,0 +1,8 @@
+buildHtml
+baseUrl https://peacefulpath.scroll.pub
+metaTags
+editButton /edit.html
+title Peaceful Path - Choose Your Protest
+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..defe818
--- /dev/null
+++ b/readme.scroll
@@ -0,0 +1,2 @@
+# peacefulpath.scroll.pub
+Website generated by DeepSeek from prompt: I am a chinese national with negative views on CCP and communism, and build me an interactive app with fancy css affects that helps me choose between types of peaceful protest, including one at Tiananmen square
\ No newline at end of file
diff --git a/script.js b/script.js
new file mode 100644
index 0000000..079eaaa
--- /dev/null
+++ b/script.js
@@ -0,0 +1,30 @@
+document.addEventListener('DOMContentLoaded', function () {
+ const options = document.querySelectorAll('.option');
+ const resultContent = document.getElementById('result-content');
+
+ options.forEach(option => {
+ option.addEventListener('click', function () {
+ const type = this.getAttribute('data-type');
+ let resultText = '';
+
+ switch (type) {
+ case 'silent-vigil':
+ resultText = 'You have chosen a Silent Vigil. This peaceful protest involves standing or sitting quietly in a public place to show solidarity and reflection.';
+ break;
+ case 'march':
+ resultText = 'You have chosen to March. Joining a group and walking together is a powerful way to show unity and demand change.';
+ break;
+ case 'artistic':
+ resultText = 'You have chosen Artistic Expression. Using art, music, or performance can convey your message in a creative and impactful way.';
+ break;
+ case 'tiananmen':
+ resultText = 'You have chosen to learn about Tiananmen Square. This historical site is a symbol of the struggle for democracy and human rights.';
+ break;
+ default:
+ resultText = 'Please choose a protest type.';
+ }
+
+ resultContent.innerHTML = `<p>${resultText}</p>`;
+ });
+ });
+});
\ No newline at end of file
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..fa3328f
--- /dev/null
+++ b/style.css
@@ -0,0 +1,77 @@
+body {
+ font-family: 'Arial', sans-serif;
+ margin: 0;
+ padding: 0;
+ background: linear-gradient(135deg, #f5f7fa, #c3cfe2);
+ color: #333;
+}
+
+header {
+ text-align: center;
+ padding: 2rem;
+ background: rgba(255, 255, 255, 0.8);
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+}
+
+h1 {
+ font-size: 2.5rem;
+ margin: 0;
+}
+
+p {
+ font-size: 1.2rem;
+}
+
+main {
+ padding: 2rem;
+}
+
+section {
+ margin-bottom: 2rem;
+}
+
+.option {
+ background: rgba(255, 255, 255, 0.9);
+ padding: 1rem;
+ margin: 1rem 0;
+ border-radius: 8px;
+ cursor: pointer;
+ transition: transform 0.3s ease, box-shadow 0.3s ease;
+}
+
+.option:hover {
+ transform: translateY(-5px);
+ box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
+}
+
+#result {
+ text-align: center;
+}
+
+#result-content {
+ background: rgba(255, 255, 255, 0.9);
+ padding: 1rem;
+ border-radius: 8px;
+ margin-top: 1rem;
+}
+
+footer {
+ text-align: center;
+ padding: 1rem;
+ background: rgba(255, 255, 255, 0.8);
+ box-shadow: 0 -4px 6px rgba(0, 0, 0, 0.1);
+}
+
+@media (max-width: 768px) {
+ h1 {
+ font-size: 2rem;
+ }
+
+ p {
+ font-size: 1rem;
+ }
+
+ .option {
+ padding: 0.8rem;
+ }
+}
\ No newline at end of file