commit 775a44ecd28bbfeeb71a7e69069c7ad03bcc08cf
Author: root <root@hub.scroll.pub> Date: 2024-12-28 07:14:42 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..efd2b33 --- /dev/null +++ b/body.html @@ -0,0 +1,17 @@ +<header> + <h1>Virtual Climb Simulator</h1> + <p>Experience the thrill of climbing with our virtual character!</p> +</header> +<main> + <div id="climb-container"> + <div id="character"></div> + <div id="mountain"></div> + </div> + <div id="controls"> + <button id="climb-up">Climb Up</button> + <button id="descend">Descend</button> + </div> +</main> +<footer> + <p>Enjoy your climb!</p> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..47cbc15 --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://climb.scroll.pub +metaTags +editButton /edit.html +title Virtual Climb Simulator +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..829e590 --- /dev/null +++ b/prompt.json @@ -0,0 +1,25 @@ +{ + "id": "1ee4d953-49f8-4915-9759-3643c75eb70c", + "object": "chat.completion", + "created": 1735370067, + "model": "deepseek-chat", + "choices": [ + { + "index": 0, + "message": { + "role": "assistant", + "content": "---domain---\nclimb.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://climb.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Virtual Climb Simulator\nstyle.css\nbody.html\nscript.js\n---body.html---\n<header>\n <h1>Virtual Climb Simulator</h1>\n <p>Experience the thrill of climbing with our virtual character!</p>\n</header>\n<main>\n <div id=\"climb-container\">\n <div id=\"character\"></div>\n <div id=\"mountain\"></div>\n </div>\n <div id=\"controls\">\n <button id=\"climb-up\">Climb Up</button>\n <button id=\"descend\">Descend</button>\n </div>\n</main>\n<footer>\n <p>Enjoy your climb!</p>\n</footer>\n---style.css---\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n}\n\nbody {\n font-family: 'Arial', sans-serif;\n background: linear-gradient(135deg, #1e3c72, #2a5298);\n color: #fff;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 100vh;\n text-align: center;\n}\n\nheader {\n margin-bottom: 2rem;\n}\n\nh1 {\n font-size: 2.5rem;\n margin-bottom: 0.5rem;\n}\n\np {\n font-size: 1.2rem;\n}\n\n#climb-container {\n position: relative;\n width: 100%;\n height: 60vh;\n background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MDAgNTAwIj48cGF0aCBkPSJNMCw1MDBsNTAwLDBsMCwtNTAwbC0xMDAsMGwwLDUwMGwtMTAwLDBsMCwtNTAwbC0xMDAsMGwwLDUwMGwtMTAwLDBsMCwtNTAwbC0xMDAsMGwwLDUwMHoiIGZpbGw9IiMzMzMiLz48L3N2Zz4=') repeat-x bottom;\n background-size: contain;\n overflow: hidden;\n}\n\n#character {\n position: absolute;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n width: 50px;\n height: 100px;\n background: #ff6347;\n clip-path: polygon(50% 0%, 0% 100%, 100% 100%);\n transition: bottom 0.5s ease;\n}\n\n#mountain {\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: linear-gradient(180deg, #555, #333);\n clip-path: polygon(0% 100%, 100% 100%, 50% 0%);\n}\n\n#controls {\n margin-top: 2rem;\n}\n\nbutton {\n padding: 0.75rem 1.5rem;\n font-size: 1rem;\n color: #fff;\n background: #ff6347;\n border: none;\n border-radius: 5px;\n cursor: pointer;\n margin: 0 0.5rem;\n transition: background 0.3s ease;\n}\n\nbutton:hover {\n background: #ff4500;\n}\n\nfooter {\n margin-top: 2rem;\n font-size: 0.9rem;\n}\n\n@media (max-width: 768px) {\n h1 {\n font-size: 2rem;\n }\n\n p {\n font-size: 1rem;\n }\n\n button {\n padding: 0.5rem 1rem;\n font-size: 0.9rem;\n }\n}\n---script.js---\nconst character = document.getElementById('character');\nconst climbUpButton = document.getElementById('climb-up');\nconst descendButton = document.getElementById('descend');\n\nlet position = 0;\n\nclimbUpButton.addEventListener('click', () => {\n if (position < 80) {\n position += 10;\n character.style.bottom = `${position}%`;\n }\n});\n\ndescendButton.addEventListener('click', () => {\n if (position > 0) {\n position -= 10;\n character.style.bottom = `${position}%`;\n }\n});\n---end---" + }, + "logprobs": null, + "finish_reason": "stop" + } + ], + "usage": { + "prompt_tokens": 255, + "completion_tokens": 1026, + "total_tokens": 1281, + "prompt_cache_hit_tokens": 0, + "prompt_cache_miss_tokens": 255 + }, + "system_fingerprint": "fp_f1afce2943" +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..7118862 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# climb.scroll.pub +Website generated by DeepSeek from prompt: i want a website that simulate the progress of climbing using a virtual character, such as climbing up or descending. \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..3cfc34d --- /dev/null +++ b/script.js @@ -0,0 +1,19 @@ +const character = document.getElementById('character'); +const climbUpButton = document.getElementById('climb-up'); +const descendButton = document.getElementById('descend'); + +let position = 0; + +climbUpButton.addEventListener('click', () => { + if (position < 80) { + position += 10; + character.style.bottom = `${position}%`; + } +}); + +descendButton.addEventListener('click', () => { + if (position > 0) { + position -= 10; + character.style.bottom = `${position}%`; + } +}); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..dba69f3 --- /dev/null +++ b/style.css @@ -0,0 +1,101 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: 'Arial', sans-serif; + background: linear-gradient(135deg, #1e3c72, #2a5298); + color: #fff; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + min-height: 100vh; + text-align: center; +} + +header { + margin-bottom: 2rem; +} + +h1 { + font-size: 2.5rem; + margin-bottom: 0.5rem; +} + +p { + font-size: 1.2rem; +} + +#climb-container { + position: relative; + width: 100%; + height: 60vh; + background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MDAgNTAwIj48cGF0aCBkPSJNMCw1MDBsNTAwLDBsMCwtNTAwbC0xMDAsMGwwLDUwMGwtMTAwLDBsMCwtNTAwbC0xMDAsMGwwLDUwMGwtMTAwLDBsMCwtNTAwbC0xMDAsMGwwLDUwMHoiIGZpbGw9IiMzMzMiLz48L3N2Zz4=') repeat-x bottom; + background-size: contain; + overflow: hidden; +} + +#character { + position: absolute; + bottom: 0; + left: 50%; + transform: translateX(-50%); + width: 50px; + height: 100px; + background: #ff6347; + clip-path: polygon(50% 0%, 0% 100%, 100% 100%); + transition: bottom 0.5s ease; +} + +#mountain { + position: absolute; + bottom: 0; + left: 0; + width: 100%; + height: 100%; + background: linear-gradient(180deg, #555, #333); + clip-path: polygon(0% 100%, 100% 100%, 50% 0%); +} + +#controls { + margin-top: 2rem; +} + +button { + padding: 0.75rem 1.5rem; + font-size: 1rem; + color: #fff; + background: #ff6347; + border: none; + border-radius: 5px; + cursor: pointer; + margin: 0 0.5rem; + transition: background 0.3s ease; +} + +button:hover { + background: #ff4500; +} + +footer { + margin-top: 2rem; + font-size: 0.9rem; +} + +@media (max-width: 768px) { + h1 { + font-size: 2rem; + } + + p { + font-size: 1rem; + } + + button { + padding: 0.5rem 1rem; + font-size: 0.9rem; + } +} \ No newline at end of file