keshavgbpecdelhi · llaryall · Feb 25, 2024
diff --git a/Lofi clock/Fonts/AlwaysInMyHeart.ttf b/Lofi clock/Fonts/AlwaysInMyHeart.ttf
diff --git a/Lofi clock/Fonts/DancingScript-Bold.ttf b/Lofi clock/Fonts/DancingScript-Bold.ttf
diff --git a/Lofi clock/Fonts/DancingScript-Regular.ttf b/Lofi clock/Fonts/DancingScript-Regular.ttf
diff --git a/Lofi clock/README.md b/Lofi clock/README.md
@@ -0,0 +1,2 @@
+i just decided to creat a simple Lofi vibe clock and timer for myselfe
+i wanna add some more usful things such as a notpad or a todo list maybe
diff --git a/Lofi clock/Sounds/crickets.mp3 b/Lofi clock/Sounds/crickets.mp3
diff --git a/Lofi clock/Sounds/fire.mp3 b/Lofi clock/Sounds/fire.mp3
diff --git a/Lofi clock/Sounds/rain.mp3 b/Lofi clock/Sounds/rain.mp3
diff --git a/Lofi clock/imgs/OIP.jpg b/Lofi clock/imgs/OIP.jpg
diff --git a/Lofi clock/imgs/brush.svg b/Lofi clock/imgs/brush.svg
diff --git a/Lofi clock/imgs/circle.png b/Lofi clock/imgs/circle.png
diff --git a/Lofi clock/imgs/cozy-house-rainy-day.mp4 b/Lofi clock/imgs/cozy-house-rainy-day.mp4
diff --git a/Lofi clock/imgs/cozy-house-rainy-night.mp4 b/Lofi clock/imgs/cozy-house-rainy-night.mp4
diff --git a/Lofi clock/imgs/day.svg b/Lofi clock/imgs/day.svg
diff --git a/Lofi clock/imgs/fire.svg b/Lofi clock/imgs/fire.svg
diff --git a/Lofi clock/imgs/himitsus-house-day.mp4 b/Lofi clock/imgs/himitsus-house-day.mp4
diff --git a/Lofi clock/imgs/himitsus-house-night.mp4 b/Lofi clock/imgs/himitsus-house-night.mp4
diff --git a/Lofi clock/imgs/japanese-style-room-day.mp4 b/Lofi clock/imgs/japanese-style-room-day.mp4
diff --git a/Lofi clock/imgs/japanese-style-room-night.mp4 b/Lofi clock/imgs/japanese-style-room-night.mp4
diff --git a/Lofi clock/imgs/lofi-coffee-shop-day.mp4 b/Lofi clock/imgs/lofi-coffee-shop-day.mp4
diff --git a/Lofi clock/imgs/night.svg b/Lofi clock/imgs/night.svg
diff --git a/Lofi clock/imgs/pause.svg b/Lofi clock/imgs/pause.svg
diff --git a/Lofi clock/imgs/pauseoutline.svg b/Lofi clock/imgs/pauseoutline.svg
diff --git a/Lofi clock/imgs/play.svg b/Lofi clock/imgs/play.svg
diff --git a/Lofi clock/imgs/playoutline.svg b/Lofi clock/imgs/playoutline.svg
diff --git a/Lofi clock/imgs/rain.svg b/Lofi clock/imgs/rain.svg
diff --git a/Lofi clock/imgs/sparkle.svg b/Lofi clock/imgs/sparkle.svg
diff --git a/Lofi clock/imgs/spotify.svg b/Lofi clock/imgs/spotify.svg
diff --git a/Lofi clock/imgs/stop.svg b/Lofi clock/imgs/stop.svg
diff --git a/Lofi clock/imgs/stopoutline.svg b/Lofi clock/imgs/stopoutline.svg
diff --git a/Lofi clock/index.html b/Lofi clock/index.html
@@ -0,0 +1,139 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link href="./src/output.css" rel="stylesheet" />
+    <link rel="icon" href="./imgs/OIP.jpg" />
+    <title>Lofi Vibe✨</title>
+  </head>
+
+  <body>
+    <video
+      id="bgvid"
+      allowfullscreen="true"
+      disablePictureInPicture
+      autoplay
+      loop
+      muted
+      class="fixed h-screen w-screen object-cover"
+      src="./imgs/cozy-house-rainy-day.mp4"
+    ></video>
+
+    <div class="flex flex-row h-screen">
+      <button
+        id="toggle"
+        class="z-10 bg-custom-peach rounded-full bg-opacity-50 backdrop-blur-3xl fixed p-1 mt-2 ml-2"
+        onclick="toggleDayNight()"
+      >
+        <img class="w-7 h-7" src="./imgs/night.svg" alt="" />
+      </button>
+      <div id="themebtn" class="dropdown z-10">
+        <button
+          id="dropbtn"
+          class="bg-custom-peach bg-opacity-50 rounded-3xl backdrop-blur-3xl p-1 mb-3"
+        >
+          <img class="w-7 h-7" src="./imgs/brush.svg" alt="" />
+        </button>
+        <div
+          id="myDropdown"
+          class="dropdown-content bg-custom-peach bg-opacity-40 rounded-3xl backdrop-blur-3xl"
+        >
+          <a href="#" onclick="changeVideo('cozy-house-rainy')">Cozy house</a>
+          <a href="#" onclick="changeVideo('japanese-style-room')"
+            >japanese room</a
+          >
+          <a href="#" onclick="changeVideo('himitsus-house')">himitsus house</a>
+          <a href="#" onclick="changeVideo('lofi-coffee-shop')"
+            >lofi coffeeshop</a
+          >
+        </div>
+      </div>
+      <div
+        class="w-screen flex flex-col justify-center items-center gap-10 mt-16"
+      >
+        <div class="flex flex-row gap-10">
+          <button>
+            <p
+              class="text-2xl backdrop-blur-3xl bg-custom-peach bg-opacity-40 rounded-3xl p-4"
+              onclick="timerbtn()"
+            >
+              timer
+            </p>
+          </button>
+          <button onclick="clockbtn()">
+            <p
+              class="text-2xl backdrop-blur-3xl bg-custom-peach bg-opacity-40 rounded-3xl p-4"
+            >
+              clock
+            </p>
+          </button>
+        </div>
+
+        <p
+          id="time"
+          class="text-9xl text-custom-Anti-Flash-White backdrop-blur-3xl bg-custom-peach bg-opacity-40 rounded-3xl p-6"
+        ></p>
+        <div
+          id="pastop"
+          class="flex gap-5 backdrop-blur-3xl bg-custom-peach bg-opacity-50 rounded-[40px] p-3"
+        >
+          <button onclick="stop()" class="">
+            <img class="h-10 w-10" src="./imgs/stop.svg" alt="" />
+          </button>
+          <button onclick="pauseTime()">
+            <img class="w-10 h-10" src="./imgs/pause.svg" alt="" />
+          </button>
+          <button onclick="resumeTime()">
+            <img class="h-10 w-10" src="./imgs/play.svg" alt="" />
+          </button>
+        </div>
+      </div>
+      <div class="flex flex-col items-end justify-end z-10">
+        <iframe
+          style="border-radius: 25px 0px 0px 25px"
+          src="https://open.spotify.com/embed/playlist/37i9dQZF1DWWQRwui0ExPn?utm_source=generator&theme=0"
+          class="h-[70%] w-0 mb-16"
+          id="spotify"
+          frameborder="0"
+          allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture"
+          loading="lazy"
+        ></iframe>
+
+          <button
+            class="h-10 bg-custom-peach rounded-full bg-opacity-50 backdrop-blur-3xl mb-2 mr-2 fixed right-[12%] transition-colors duration-1000 ease-out "
+            onclick="fire()"
+            id="firebtn"
+          >
+            <audio loop id="fire" src="./Sounds/fire.mp3"></audio>
+            <img class="w-10 h-10" src="./imgs/fire.svg" alt="" />
+          </button>
+          <button
+            class="h-10 bg-custom-peach rounded-full bg-opacity-50 backdrop-blur-3xl mb-2 mr-2 fixed right-[8%] transition-colors duration-1000 ease-out"
+            onclick="Sparkle()"
+            id="sparklebtn"
+          >
+            <audio loop id="sparkle" src="./Sounds/crickets.mp3"></audio>
+            <img class="w-10 h-9" src="./imgs/sparkle.svg" alt="" />
+          </button>
+          <button
+            class="h-10 bg-custom-peach rounded-full bg-opacity-50 backdrop-blur-3xl mb-2 mr-2 fixed right-[4%] transition-colors duration-1000 ease-out "
+            onclick="Rain()"
+            id="rainbtn"
+          >
+            <audio loop id="rain" src="./Sounds/rain.mp3"></audio>
+            <img class="w-10 h-7" src="./imgs/rain.svg" alt="" />
+          </button>
+          <button
+            class="h-10 bg-custom-peach rounded-full bg-opacity-50 backdrop-blur-3xl mb-2 mr-2 fixed right-[0%] "
+            onclick="spoti()"
+            id="spotibtn"
+          >
+            <img class="w-10 h-10" src="./imgs/spotify.svg" alt="" />
+          </button>
+
+      </div>
+    </div>
+    <script src="./src/main.js"></script>
+  </body>
+</html>
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		i just decided to creat a simple Lofi vibe clock and timer for myselfe
		i wanna add some more usful things such as a notpad or a todo list maybe