commit 0512b081d1f0e4cec1222d459143d111f0059c8e
Author: root <root@hub.scroll.pub>
Date: 2024-12-27 15:02:32 +0000
Subject: Initial commit
diff --git a/body.html b/body.html
new file mode 100644
index 0000000..c3126d6
--- /dev/null
+++ b/body.html
@@ -0,0 +1,40 @@
+<header>
+ <h1>Peaceful Voice</h1>
+ <p>Empowering peaceful expression</p>
+</header>
+
+<main>
+ <section class="intro">
+ <h2>Choose Your Path of Peaceful Protest</h2>
+ <p>Select the type of protest that resonates with your values and circumstances.</p>
+ </section>
+
+ <section class="options">
+ <div class="card" data-type="silent">
+ <h3>Silent Vigil</h3>
+ <p>A quiet, respectful gathering to express dissent.</p>
+ <button>Learn More</button>
+ </div>
+
+ <div class="card" data-type="art">
+ <h3>Artistic Expression</h3>
+ <p>Use creativity to convey your message peacefully.</p>
+ <button>Learn More</button>
+ </div>
+
+ <div class="card" data-type="tiananmen">
+ <h3>Tiananmen Memorial</h3>
+ <p>Honor the past while advocating for change.</p>
+ <button>Learn More</button>
+ </div>
+ </section>
+
+ <section class="details">
+ <h2>Protest Details</h2>
+ <div id="protest-info"></div>
+ </section>
+</main>
+
+<footer>
+ <p>Remember: Peaceful protest is a fundamental right.</p>
+</footer>
\ No newline at end of file
diff --git a/index.scroll b/index.scroll
new file mode 100644
index 0000000..164e340
--- /dev/null
+++ b/index.scroll
@@ -0,0 +1,8 @@
+buildHtml
+baseUrl https://peacefulvoice.scroll.pub
+metaTags
+editButton /edit.html
+title Peaceful Voice - Choose Your Protest
+style.css
+body.html
+script.js
\ No newline at end of file
diff --git a/prompt.json b/prompt.json
new file mode 100644
index 0000000..53157a6
--- /dev/null
+++ b/prompt.json
@@ -0,0 +1,25 @@
+{
+ "id": "8d7b060e-8584-4edd-bab5-b65480d5af06",
+ "object": "chat.completion",
+ "created": 1735311732,
+ "model": "deepseek-chat",
+ "choices": [
+ {
+ "index": 0,
+ "message": {
+ "role": "assistant",
+ "content": "---domain---\npeacefulvoice.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://peacefulvoice.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Peaceful Voice - Choose Your Protest\nstyle.css\nbody.html\nscript.js\n---body.html---\n<header>\n <h1>Peaceful Voice</h1>\n <p>Empowering peaceful expression</p>\n</header>\n\n<main>\n <section class=\"intro\">\n <h2>Choose Your Path of Peaceful Protest</h2>\n <p>Select the type of protest that resonates with your values and circumstances.</p>\n </section>\n\n <section class=\"options\">\n <div class=\"card\" data-type=\"silent\">\n <h3>Silent Vigil</h3>\n <p>A quiet, respectful gathering to express dissent.</p>\n <button>Learn More</button>\n </div>\n \n <div class=\"card\" data-type=\"art\">\n <h3>Artistic Expression</h3>\n <p>Use creativity to convey your message peacefully.</p>\n <button>Learn More</button>\n </div>\n\n <div class=\"card\" data-type=\"tiananmen\">\n <h3>Tiananmen Memorial</h3>\n <p>Honor the past while advocating for change.</p>\n <button>Learn More</button>\n </div>\n </section>\n\n <section class=\"details\">\n <h2>Protest Details</h2>\n <div id=\"protest-info\"></div>\n </section>\n</main>\n\n<footer>\n <p>Remember: Peaceful protest is a fundamental right.</p>\n</footer>\n---style.css---\n:root {\n --primary-color: #4CAF50;\n --secondary-color: #2196F3;\n --accent-color: #FFC107;\n --text-color: #333;\n --bg-color: #f5f5f5;\n}\n\nbody {\n font-family: 'Segoe UI', sans-serif;\n line-height: 1.6;\n color: var(--text-color);\n background-color: var(--bg-color);\n margin: 0;\n padding: 0;\n}\n\nheader {\n background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));\n color: white;\n padding: 2rem;\n text-align: center;\n}\n\nh1 {\n font-size: 2.5rem;\n margin-bottom: 0.5rem;\n}\n\n.intro {\n padding: 2rem;\n text-align: center;\n}\n\n.options {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n gap: 1.5rem;\n padding: 2rem;\n}\n\n.card {\n background: white;\n border-radius: 8px;\n padding: 1.5rem;\n box-shadow: 0 2px 5px rgba(0,0,0,0.1);\n transition: transform 0.3s ease;\n}\n\n.card:hover {\n transform: translateY(-5px);\n}\n\n.card h3 {\n color: var(--primary-color);\n margin-bottom: 1rem;\n}\n\n.card button {\n background: var(--secondary-color);\n color: white;\n border: none;\n padding: 0.5rem 1rem;\n border-radius: 4px;\n cursor: pointer;\n transition: background 0.3s ease;\n}\n\n.card button:hover {\n background: var(--accent-color);\n}\n\n.details {\n padding: 2rem;\n background: white;\n margin: 2rem;\n border-radius: 8px;\n box-shadow: 0 2px 5px rgba(0,0,0,0.1);\n}\n\nfooter {\n background: var(--text-color);\n color: white;\n text-align: center;\n padding: 1rem;\n}\n\n@media (max-width: 768px) {\n h1 {\n font-size: 2rem;\n }\n \n .options {\n grid-template-columns: 1fr;\n }\n}\n---script.js---\ndocument.addEventListener('DOMContentLoaded', function() {\n const cards = document.querySelectorAll('.card');\n const protestInfo = document.getElementById('protest-info');\n\n const protestDetails = {\n silent: {\n title: 'Silent Vigil',\n description: 'A peaceful gathering where participants stand in silence to express their dissent. This form of protest is powerful in its simplicity and respectfulness.',\n tips: [\n 'Choose a meaningful location',\n 'Wear symbolic clothing or colors',\n 'Maintain complete silence throughout'\n ]\n },\n art: {\n title: 'Artistic Expression',\n description: 'Use creative means like painting, music, or performance art to convey your message. This approach can be particularly effective in reaching diverse audiences.',\n tips: [\n 'Choose a medium that resonates with you',\n 'Focus on positive messaging',\n 'Consider public spaces for display'\n ]\n },\n tiananmen: {\n title: 'Tiananmen Memorial',\n description: 'Honor the memory of those who stood for freedom while advocating for change. This form of protest carries deep historical significance.',\n tips: [\n 'Educate yourself about the history',\n 'Be mindful of local laws and regulations',\n 'Consider virtual participation for safety'\n ]\n }\n };\n\n cards.forEach(card => {\n card.addEventListener('click', function() {\n const type = this.dataset.type;\n const details = protestDetails[type];\n\n let tipsHTML = details.tips.map(tip => `<li>${tip}</li>`).join('');\n \n protestInfo.innerHTML = `\n <h3>${details.title}</h3>\n <p>${details.description}</p>\n <h4>Tips:</h4>\n <ul>${tipsHTML}</ul>\n `;\n });\n });\n});\n---end---"
+ },
+ "logprobs": null,
+ "finish_reason": "stop"
+ }
+ ],
+ "usage": {
+ "prompt_tokens": 272,
+ "completion_tokens": 1295,
+ "total_tokens": 1567,
+ "prompt_cache_hit_tokens": 0,
+ "prompt_cache_miss_tokens": 272
+ },
+ "system_fingerprint": "fp_f1afce2943"
+}
\ No newline at end of file
diff --git a/readme.scroll b/readme.scroll
new file mode 100644
index 0000000..fe8f18f
--- /dev/null
+++ b/readme.scroll
@@ -0,0 +1,2 @@
+# peacefulvoice.scroll.pub
+Website generated by DeepSeek from prompt: chinese national with negative views on CCP and communism, and make an interactive wbesite with fancy css to help 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..2f3fdae
--- /dev/null
+++ b/script.js
@@ -0,0 +1,50 @@
+document.addEventListener('DOMContentLoaded', function() {
+ const cards = document.querySelectorAll('.card');
+ const protestInfo = document.getElementById('protest-info');
+
+ const protestDetails = {
+ silent: {
+ title: 'Silent Vigil',
+ description: 'A peaceful gathering where participants stand in silence to express their dissent. This form of protest is powerful in its simplicity and respectfulness.',
+ tips: [
+ 'Choose a meaningful location',
+ 'Wear symbolic clothing or colors',
+ 'Maintain complete silence throughout'
+ ]
+ },
+ art: {
+ title: 'Artistic Expression',
+ description: 'Use creative means like painting, music, or performance art to convey your message. This approach can be particularly effective in reaching diverse audiences.',
+ tips: [
+ 'Choose a medium that resonates with you',
+ 'Focus on positive messaging',
+ 'Consider public spaces for display'
+ ]
+ },
+ tiananmen: {
+ title: 'Tiananmen Memorial',
+ description: 'Honor the memory of those who stood for freedom while advocating for change. This form of protest carries deep historical significance.',
+ tips: [
+ 'Educate yourself about the history',
+ 'Be mindful of local laws and regulations',
+ 'Consider virtual participation for safety'
+ ]
+ }
+ };
+
+ cards.forEach(card => {
+ card.addEventListener('click', function() {
+ const type = this.dataset.type;
+ const details = protestDetails[type];
+
+ let tipsHTML = details.tips.map(tip => `<li>${tip}</li>`).join('');
+
+ protestInfo.innerHTML = `
+ <h3>${details.title}</h3>
+ <p>${details.description}</p>
+ <h4>Tips:</h4>
+ <ul>${tipsHTML}</ul>
+ `;
+ });
+ });
+});
\ No newline at end of file
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..bed7486
--- /dev/null
+++ b/style.css
@@ -0,0 +1,96 @@
+:root {
+ --primary-color: #4CAF50;
+ --secondary-color: #2196F3;
+ --accent-color: #FFC107;
+ --text-color: #333;
+ --bg-color: #f5f5f5;
+}
+
+body {
+ font-family: 'Segoe UI', sans-serif;
+ line-height: 1.6;
+ color: var(--text-color);
+ background-color: var(--bg-color);
+ margin: 0;
+ padding: 0;
+}
+
+header {
+ background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
+ color: white;
+ padding: 2rem;
+ text-align: center;
+}
+
+h1 {
+ font-size: 2.5rem;
+ margin-bottom: 0.5rem;
+}
+
+.intro {
+ padding: 2rem;
+ text-align: center;
+}
+
+.options {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+ gap: 1.5rem;
+ padding: 2rem;
+}
+
+.card {
+ background: white;
+ border-radius: 8px;
+ padding: 1.5rem;
+ box-shadow: 0 2px 5px rgba(0,0,0,0.1);
+ transition: transform 0.3s ease;
+}
+
+.card:hover {
+ transform: translateY(-5px);
+}
+
+.card h3 {
+ color: var(--primary-color);
+ margin-bottom: 1rem;
+}
+
+.card button {
+ background: var(--secondary-color);
+ color: white;
+ border: none;
+ padding: 0.5rem 1rem;
+ border-radius: 4px;
+ cursor: pointer;
+ transition: background 0.3s ease;
+}
+
+.card button:hover {
+ background: var(--accent-color);
+}
+
+.details {
+ padding: 2rem;
+ background: white;
+ margin: 2rem;
+ border-radius: 8px;
+ box-shadow: 0 2px 5px rgba(0,0,0,0.1);
+}
+
+footer {
+ background: var(--text-color);
+ color: white;
+ text-align: center;
+ padding: 1rem;
+}
+
+@media (max-width: 768px) {
+ h1 {
+ font-size: 2rem;
+ }
+
+ .options {
+ grid-template-columns: 1fr;
+ }
+}
\ No newline at end of file