From a21fe02429758b3df42c5abddf576a4ef52dfb42 Mon Sep 17 00:00:00 2001
From: Shine <Fxxk181126>
Date: Mon, 20 May 2024 17:53:50 +0800
Subject: [PATCH] feat: update 520

---
 .vscode/settings.json |   3 +
 favicon.ico           | Bin 1150 -> 5042 bytes
 index.html            | 317 ++++++++++++++++++++++++++++--------------
 3 files changed, 216 insertions(+), 104 deletions(-)
 create mode 100644 .vscode/settings.json

diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..6f3a291
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}
\ No newline at end of file
diff --git a/favicon.ico b/favicon.ico
index 3e131ecc4153750b1633099bde0ddcce525db45a..159542268b2b7d91074702eaf767aea689ef9a03 100644
GIT binary patch
literal 5042
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

literal 1150
zcma)5O=}ZT6rG~rGF`c?nGtap|3R32q)QhHS=OB!T}SIb5W5heRS^XlDF}i{QCme9
zE@E4g&<2^rrio2zk|vXxHy@efc^Q$RO&b$V?#sFNoOkEGH;OXF@AS07-*d|K(~5Fd
zQIv}WDKZhyaO?*_PQCA7Zry{i8=&Qc%j9N{6&y-P{pBqIwctSg#Q03WC<dgFK2$pP
zuhd^_3!Jam(7w`R!9nVwgN^2}!(3vlC`L;C)w+Q8+J^dw`o+j2^Fp9C2$y4}W0%xt
z=RbQ;pR)JIQUBT#`aN)PYt>^KH^vHM<h~QW&%AS?zM{?`7)O3f4&MG8%_0>mKeFT=
ziH+{ClU#M7tx)^MMRJ9H&jl{M6fpatDQk`hV+8Z*#YO-%FOXcL2hT$L81<8hp5uRJ
zk(;ZshmymypwBnXk{(I+Ghg<(1+uX%$1dAJm{0HUJj>MbPH5YVUj%OETNqfD^f>We
zFh8^D4m%g>_UKNeDi#*XRTK)FsF*+Cxvt5YNwb)}XL-2N>|_1c9vbx;wzo<s(xb6k
zqZ~_Pn~#yQ#<2&m`aQIN@1wR;MXC6G6dlKw9uv=W7zCz0u+ZxrjCyD__aL=Gh>3dH
zirmBZJsfn~u&h2@*M;x<CixR*7<&xqksYuHIr|_8<h%WEc6VUtw<U6akv8-XGepAB
YD@6B<p^H<*l%WSis6+tQxNGQt03(yqB>(^b

diff --git a/index.html b/index.html
index 86d4b43..5f42b96 100644
--- a/index.html
+++ b/index.html
@@ -1,110 +1,219 @@
-<!-- ---
-layout: default
---- -->
-
 <!DOCTYPE html>
-<html lang="es">
+<html>
 <head>
-    <meta charset="utf-8">
-    <title>完整的圣诞树</title>
-    <style>
-        body { margin: 0; }
-        canvas { display: block; }
+    <title>520快乐哈~</title>
+    <style type="text/css">
+        body {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            height: 100vh;
+            margin: 0;
+            overflow: hidden;
+			 background-color: #FCE8F8;
+        }
+
+        #snow-container {
+            position: fixed;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            pointer-events: none;
+            z-index: -1;
+        }
+
+        .snowflake {
+            position: absolute;
+            width: 10px;
+            height: 10px;
+            background-color: #fff;
+            border-radius: 50%;
+            opacity: 0.8;
+            pointer-events: none;
+            animation: snowfall linear infinite;
+        }
+
+        @keyframes snowfall {
+            0% {
+                transform: translateY(-100%);
+            }
+            100% {
+                transform: translateY(100vh);
+            }
+        }
+
+        .heart {
+            width: 200px;
+            height: 200px;
+            position: relative;
+            animation: heartbeat 1s infinite;
+            transform-origin: center center;
+        }
+
+        .heart:before,
+        .heart:after {
+            content: "";
+            background-color: red;
+            border-radius: 50px 50px 0 0;
+            position: absolute;
+            top: 0;
+        }
+
+        .heart:before {
+            left: 100px;
+            width: 100px;
+            height: 160px;
+            transform: rotate(-45deg);
+            transform-origin: 0 100%;
+        }
+
+        .heart:after {
+            left: 0;
+            width: 100px;
+            height: 160px;
+            transform: rotate(45deg);
+            transform-origin: 100% 100%;
+        }
+
+        #timeElapsed {
+            text-align: center;
+            font-size: 24px;
+            margin-top: -20px;
+            margin-left: 16px;
+        }
+
+        @keyframes heartbeat {
+            0% {
+                transform: scale(1);
+            }
+            50% {
+                transform: scale(1.2);
+            }
+            100% {
+                transform: scale(1);
+            }
+        }
+
+        @keyframes falling {
+            0% {
+                transform: translateY(-100vh);
+            }
+            100% {
+                transform: translateY(100vh);
+            }
+        }
+
+        .sakura {
+            position: absolute;
+            top: -20px;
+            left: -20px;
+            width: 40px;
+            height: 40px;
+            background-image: url('https://www.unicode.org/emoji/charts/full-emoji-list.html#1f338'); /* 🌸的Unicode转义序列 */
+            background-size: cover;
+            animation: falling linear infinite;
+            animation-duration: 10s;
+        }
+        #words-spoken {
+            position: absolute;
+            margin-left: 50%;
+            transform: translate(-50%);
+            text-align: center;
+            bottom: 40px;
+        }
     </style>
 </head>
 <body>
-<script src="https://threejs.org/build/three.js"></script>
-<script >
-    // 创建场景
-    let scene = new THREE.Scene();
-
-    // 添加背景颜色
-    scene.background = new THREE.Color(0x002633);
-
-    // 创建相机
-    let camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
-    camera.position.z = 5;
-
-    // 创建渲染器
-    let renderer = new THREE.WebGLRenderer();
-    renderer.setSize(window.innerWidth, window.innerHeight);
-    document.body.appendChild(renderer.domElement);
-
-    // 创建材质
-    let brownMaterial = new THREE.MeshBasicMaterial({ color: 0x7f4014 });
-    let greenMaterial = new THREE.MeshBasicMaterial({ color: 0x006400, transparent: true, opacity: 0.8 });
-    let redMaterial = new THREE.MeshBasicMaterial({ color: 0xff0000 });
-    let yellowMaterial = new THREE.MeshBasicMaterial({ color: 0xffff00 });
-
-    // 创建树干
-    let trunkGeometry = new THREE.CylinderGeometry(0.2, 0.4, 1.6, 8);
-    let trunk = new THREE.Mesh(trunkGeometry, brownMaterial);
-    scene.add(trunk);
-
-    // 创建树叶
-    let leavesGeometry = new THREE.ConeGeometry(1.2, 2.4, 8);
-    let leaves = new THREE.Mesh(leavesGeometry, greenMaterial);
-    leaves.position.y = 1.6;
-    scene.add(leaves);
-
-    // 创建彩灯
-    let lightGeometry = new THREE.SphereGeometry(0.1, 4, 4);
-    let lights = [];
-    let colors = [redMaterial, yellowMaterial, new THREE.MeshBasicMaterial({ color: 0x0000ff }), new THREE.MeshBasicMaterial({ color: 0x00ff00 })];
-    let angles = [0, Math.PI / 3, 2 * Math.PI / 3, Math.PI, 4 * Math.PI / 3, 5 * Math.PI / 3];
-    for (let i = 0; i < angles.length; i++) {
-        let light = new THREE.Mesh(lightGeometry, colors[i % 4]);
-        light.position.set(Math.cos(angles[i]) * 0.9, 2.2, Math.sin(angles[i]) * 0.9);
-        scene.add(light);
-        lights.push(light);
-    }
-
-    // 创建星星
-    let starGeometry = new THREE.SphereGeometry(0.2, 4, 4);
-    let star = new THREE.Mesh(starGeometry, yellowMaterial);
-    star.position.y = 2.7;
-    scene.add(star);
-
-    // 创建礼物盒
-    let giftGeometry = new THREE.BoxGeometry(0.5, 0.5, 0.5);
-    let giftMaterials = [
-        new THREE.MeshBasicMaterial({ color: 0xff0000 }),
-        new THREE.MeshBasicMaterial({ color: 0x00ff00 }),
-        new THREE.MeshBasicMaterial({ color: 0x0000ff }),
-        new THREE.MeshBasicMaterial({ color: 0xffff00 }),
-        new THREE.MeshBasicMaterial({ color: 0xff00ff }),
-        new THREE.MeshBasicMaterial({ color: 0x00ffff })
-    ];
-    let giftMesh = new THREE.Mesh(giftGeometry, giftMaterials);
-    giftMesh.position.set(0, -1.3, 0);
-    scene.add(giftMesh);
-
-    // 添加雪花效果
-    let snowFlakeGeometry = new THREE.BufferGeometry();
-    let positions = [];
-    for (let i = 0; i < 1000; i++) {
-        positions.push(Math.random() * 2000 - 1000);
-        positions.push(Math.random() * 2000 - 1000);
-        positions.push(Math.random() * 2000 - 1000);
-    }
-    snowFlakeGeometry.setAttribute('position', new THREE.Float32BufferAttribute(positions, 3));
-    let snowFlakeMaterial = new THREE.PointsMaterial({ color: 0xffffff, size: 2 });
-    let snowFlake = new THREE.Points(snowFlakeGeometry, snowFlakeMaterial);
-    scene.add(snowFlake);
-    
-
-    // 渲染循环
-    function animate() {
-        requestAnimationFrame(animate);
-        trunk.rotation.y += 0.01;
-        leaves.rotation.y += 0.01;
-        for (let i = 0; i < lights.length; i++) {
-            lights[i].rotation.y += 0.02;
-        }
-        snowFlake.rotation.y -= 0.001;
-        renderer.render(scene, camera);
-    }
-    animate();
-</script>
+    <div id="snow-container">
+        <div id="words-spoken">
+            <!-- <div>你虽然懒惰，但你有一颗善良的心；你虽然胖胖的，但你有一颗有趣的灵魂。&nbsp;</div>
+            <div> 520，我爱你，爱你的全部，包括你的小缺点。</div> -->
+        </div>
+    </div>
+    <div class="heart"></div>
+    <div id="timeElapsed">
+        <div>你虽然懒惰，但你有一颗善良的心；你虽然胖胖的，但你有一颗有趣的灵魂。&nbsp;</div>
+        <div> 520，我爱你，爱你的全部，包括你的小缺点。</div>
+    </div>
+
+    <script>
+        function getTimeElapsed() {
+            var startDate = new Date("2017-05-16"); // 设置开始日期，替换为实际的起始日期
+            var currentDate = new Date();
+            var timeDiff = currentDate - startDate;
+
+            var milliseconds = timeDiff % 1000;
+            timeDiff = Math.floor(timeDiff / 1000);
+            var seconds = timeDiff % 60;
+            timeDiff = Math.floor(timeDiff / 60);
+            var minutes = timeDiff % 60;
+            timeDiff = Math.floor(timeDiff / 60);
+            var hours = timeDiff % 24;
+            timeDiff = Math.floor(timeDiff / 24);
+            var days = timeDiff;
+
+            var timeString = "温宝我们已经在一起 " + days + " 天 " + hours + " 小时 " + minutes + " 分钟 " + seconds + " 秒了";
+
+            document.getElementById("words-spoken").textContent = timeString;
+        }
+
+        setInterval(getTimeElapsed, 1000);
+    </script>
+
+    <script>
+        function createSnowflake() {
+            const snowflake = document.createElement('div');
+            snowflake.classList.add('snowflake');
+            snowflake.style.left = Math.random() * window.innerWidth + 'px';
+            snowflake.style.animationDuration = Math.random() * 3 + 2 + 's';
+            snowflake.style.opacity = Math.random();
+            snowflake.style.fontSize = Math.random() * 10 + 10 + 'px';
+
+            const randomColor = getRandomColor();
+            snowflake.style.backgroundColor = randomColor;
+
+            // snowflake.innerHTML = '命运之光'; // You can customize the snowflake symbol here
+
+            return snowflake;
+        }
+
+        function getRandomColor() {
+            const letters = '0123456789ABCDEF';
+            let color = '#';
+            for (let i = 0; i < 6; i++) {
+                color += letters[Math.floor(Math.random() * 16)];
+            }
+            return color;
+        }
+
+        function snowfall() {
+            const snowContainer = document.getElementById('snow-container');
+            const numSnowflakes = 50; // Adjust the number of snowflakes here
+
+            for (let i = 0; i < numSnowflakes; i++) {
+                const snowflake = createSnowflake();
+                snowContainer.appendChild(snowflake);
+            }
+        }
+
+        snowfall();
+    </script>
+
+    <script>
+        function createSakura() {
+            var sakura = document.createElement("div");
+            sakura.className = "sakura";
+            sakura.style.left = Math.random() * 100 + "vw";
+            sakura.style.animationDelay = Math.random() * 5 + "s";
+            document.body.appendChild(sakura);
+
+            setTimeout(function () {
+                sakura.remove();
+            }, 10000);
+        }
+
+        setInterval(createSakura, 200);
+    </script>
 </body>
-</html>
+</html>
\ No newline at end of file