commit cd1ea0aa9c06ea6f134bf7069c1d02d18b592d06
Author: root <root@hub.scroll.pub> Date: 2025-01-01 06:12:05 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..668d1fb --- /dev/null +++ b/body.html @@ -0,0 +1,37 @@ +<div class="container"> + <section class="page" id="page1"> + <h1>🎉 李芷薇的16岁生日 🎉</h1> + <p>亲爱的芷薇,欢迎来到你的专属生日网站!</p> + <div class="flower"> + <div class="petal"></div> + <div class="petal"></div> + <div class="petal"></div> + <div class="petal"></div> + <div class="petal"></div> + <div class="petal"></div> + <div class="heart"></div> + </div> + </section> + <section class="page" id="page2"> + <h2>💌 一封给你的信 💌</h2> + <div class="envelope" onclick="openEnvelope()"> + <div class="flap"></div> + <div class="letter"> + <p>亲爱的芷薇,</p> + <p>祝你16岁生日快乐!愿你永远快乐,健康,美丽!</p> + <p>爱你的,[你的名字]</p> + </div> + </div> + </section> + <section class="page" id="page3"> + <h2>🎵 为你唱的歌 🎵</h2> + <audio controls id="birthdaySong"> + <source src="birthday-song.mp3" type="audio/mpeg"> + 你的浏览器不支持音频播放。 + </audio> + <div class="music-controls"> + <button onclick="playSong()">播放</button> + <button onclick="pauseSong()">暂停</button> + </div> + </section> +</div> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..09ec215 --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://lizhiwei16.scroll.pub +metaTags +editButton /edit.html +title 李芷薇的16岁生日庆贺 +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..431bd3f --- /dev/null +++ b/prompt.json @@ -0,0 +1,25 @@ +{ + "id": "3e10b182-bd95-45bd-8d70-e5ffede84cf8", + "object": "chat.completion", + "created": 1735711906, + "model": "deepseek-chat", + "choices": [ + { + "index": 0, + "message": { + "role": "assistant", + "content": "---domain---\nlizhiwei16.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://lizhiwei16.scroll.pub\nmetaTags\neditButton /edit.html\ntitle 李芷薇的16岁生日庆贺\nstyle.css\nbody.html\nscript.js\n---body.html---\n<div class=\"container\">\n <section class=\"page\" id=\"page1\">\n <h1>🎉 李芷薇的16岁生日 🎉</h1>\n <p>亲爱的芷薇,欢迎来到你的专属生日网站!</p>\n <div class=\"flower\">\n <div class=\"petal\"></div>\n <div class=\"petal\"></div>\n <div class=\"petal\"></div>\n <div class=\"petal\"></div>\n <div class=\"petal\"></div>\n <div class=\"petal\"></div>\n <div class=\"heart\"></div>\n </div>\n </section>\n <section class=\"page\" id=\"page2\">\n <h2>💌 一封给你的信 💌</h2>\n <div class=\"envelope\" onclick=\"openEnvelope()\">\n <div class=\"flap\"></div>\n <div class=\"letter\">\n <p>亲爱的芷薇,</p>\n <p>祝你16岁生日快乐!愿你永远快乐,健康,美丽!</p>\n <p>爱你的,[你的名字]</p>\n </div>\n </div>\n </section>\n <section class=\"page\" id=\"page3\">\n <h2>🎵 为你唱的歌 🎵</h2>\n <audio controls id=\"birthdaySong\">\n <source src=\"birthday-song.mp3\" type=\"audio/mpeg\">\n 你的浏览器不支持音频播放。\n </audio>\n <div class=\"music-controls\">\n <button onclick=\"playSong()\">播放</button>\n <button onclick=\"pauseSong()\">暂停</button>\n </div>\n </section>\n</div>\n---style.css---\nbody {\n font-family: 'Comic Sans MS', cursive, sans-serif;\n background-color: #f9f9f9;\n color: #333;\n margin: 0;\n padding: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n overflow: hidden;\n}\n\n.container {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n\n.page {\n width: 100%;\n height: 100vh;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n text-align: center;\n}\n\n.flower {\n position: relative;\n width: 100px;\n height: 100px;\n animation: grow 2s ease-in-out infinite;\n}\n\n.petal {\n position: absolute;\n width: 50px;\n height: 50px;\n background-color: pink;\n border-radius: 50%;\n transform-origin: center bottom;\n}\n\n.petal:nth-child(1) { transform: rotate(0deg) translateY(-50px); }\n.petal:nth-child(2) { transform: rotate(60deg) translateY(-50px); }\n.petal:nth-child(3) { transform: rotate(120deg) translateY(-50px); }\n.petal:nth-child(4) { transform: rotate(180deg) translateY(-50px); }\n.petal:nth-child(5) { transform: rotate(240deg) translateY(-50px); }\n.petal:nth-child(6) { transform: rotate(300deg) translateY(-50px); }\n\n.heart {\n position: absolute;\n width: 20px;\n height: 20px;\n background-color: red;\n transform: rotate(45deg);\n top: 40px;\n left: 40px;\n}\n\n@keyframes grow {\n 0%, 100% { transform: scale(1); }\n 50% { transform: scale(1.2); }\n}\n\n.envelope {\n position: relative;\n width: 200px;\n height: 120px;\n background-color: #ffcccb;\n cursor: pointer;\n}\n\n.flap {\n position: absolute;\n width: 0;\n height: 0;\n border-left: 100px solid transparent;\n border-right: 100px solid transparent;\n border-bottom: 60px solid #ffcccb;\n top: -60px;\n}\n\n.letter {\n position: absolute;\n width: 180px;\n height: 100px;\n background-color: white;\n top: 10px;\n left: 10px;\n padding: 10px;\n display: none;\n}\n\n.envelope.open .flap {\n transform: rotateX(180deg);\n}\n\n.envelope.open .letter {\n display: block;\n}\n\n.music-controls {\n margin-top: 20px;\n}\n\nbutton {\n background-color: pink;\n border: none;\n padding: 10px 20px;\n margin: 5px;\n cursor: pointer;\n border-radius: 5px;\n}\n\nbutton:hover {\n background-color: #ff69b4;\n}\n---script.js---\nfunction openEnvelope() {\n const envelope = document.querySelector('.envelope');\n envelope.classList.toggle('open');\n}\n\nfunction playSong() {\n const audio = document.getElementById('birthdaySong');\n audio.play();\n}\n\nfunction pauseSong() {\n const audio = document.getElementById('birthdaySong');\n audio.pause();\n}\n---end---" + }, + "logprobs": null, + "finish_reason": "stop" + } + ], + "usage": { + "prompt_tokens": 333, + "completion_tokens": 1236, + "total_tokens": 1569, + "prompt_cache_hit_tokens": 0, + "prompt_cache_miss_tokens": 333 + }, + "system_fingerprint": "fp_f1afce2943" +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..8125fcb --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# lizhiwei16.scroll.pub +Website generated by DeepSeek from prompt: 一个给我女朋友李芷薇的16岁生日庆贺网站,网站是翻页递进式的,每个页面都有不同的有意思的生日庆贺内容,包括但不限于有生长动画的长满爱心的花,能交互打开的信封和信封内的庆贺内容,并且还要有背景音乐选择控制系统,因为我将会在她生日网站上放上我亲自唱的歌,网站设计要可爱,还要适当地表达我的爱意,但16岁生日庆贺还是占主体 \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..ca73b65 --- /dev/null +++ b/script.js @@ -0,0 +1,14 @@ +function openEnvelope() { + const envelope = document.querySelector('.envelope'); + envelope.classList.toggle('open'); +} + +function playSong() { + const audio = document.getElementById('birthdaySong'); + audio.play(); +} + +function pauseSong() { + const audio = document.getElementById('birthdaySong'); + audio.pause(); +} \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..bb2e326 --- /dev/null +++ b/style.css @@ -0,0 +1,123 @@ +body { + font-family: 'Comic Sans MS', cursive, sans-serif; + background-color: #f9f9f9; + color: #333; + margin: 0; + padding: 0; + display: flex; + justify-content: center; + align-items: center; + height: 100vh; + overflow: hidden; +} + +.container { + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} + +.page { + width: 100%; + height: 100vh; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + text-align: center; +} + +.flower { + position: relative; + width: 100px; + height: 100px; + animation: grow 2s ease-in-out infinite; +} + +.petal { + position: absolute; + width: 50px; + height: 50px; + background-color: pink; + border-radius: 50%; + transform-origin: center bottom; +} + +.petal:nth-child(1) { transform: rotate(0deg) translateY(-50px); } +.petal:nth-child(2) { transform: rotate(60deg) translateY(-50px); } +.petal:nth-child(3) { transform: rotate(120deg) translateY(-50px); } +.petal:nth-child(4) { transform: rotate(180deg) translateY(-50px); } +.petal:nth-child(5) { transform: rotate(240deg) translateY(-50px); } +.petal:nth-child(6) { transform: rotate(300deg) translateY(-50px); } + +.heart { + position: absolute; + width: 20px; + height: 20px; + background-color: red; + transform: rotate(45deg); + top: 40px; + left: 40px; +} + +@keyframes grow { + 0%, 100% { transform: scale(1); } + 50% { transform: scale(1.2); } +} + +.envelope { + position: relative; + width: 200px; + height: 120px; + background-color: #ffcccb; + cursor: pointer; +} + +.flap { + position: absolute; + width: 0; + height: 0; + border-left: 100px solid transparent; + border-right: 100px solid transparent; + border-bottom: 60px solid #ffcccb; + top: -60px; +} + +.letter { + position: absolute; + width: 180px; + height: 100px; + background-color: white; + top: 10px; + left: 10px; + padding: 10px; + display: none; +} + +.envelope.open .flap { + transform: rotateX(180deg); +} + +.envelope.open .letter { + display: block; +} + +.music-controls { + margin-top: 20px; +} + +button { + background-color: pink; + border: none; + padding: 10px 20px; + margin: 5px; + cursor: pointer; + border-radius: 5px; +} + +button:hover { + background-color: #ff69b4; +} \ No newline at end of file