Added new files

Author: breadomaticc

README.md

@@ -0,0 +1,6 @@
+# breadomaticc.github.io
+
+24/12/2021 updated my github page,
+
+
+original : https://pndaboi.is-a.dev/

assets/audio/back.mp3

@@ -0,0 +1,79 @@
+/* 
+Click to enter CSS file
+*/
+
+.unclicked {
+  filter: blur(4px);
+  /* z-index: 100; */
+}
+
+.overlay {
+
+  width: 100%;
+  height: 100vh;
+  
+  opacity: 0;
+}
+
+.overlaytext {
+  text-align: center;
+  
+  position: absolute;
+  z-index: 2;
+
+  background-color: black;
+  color: white;
+  
+  left: 50%;
+  top: 50%;
+
+  transform: translate(-50%, -50%);
+}
+
+.click {
+  animation: clickedAnim 1s;
+}
+
+.clicked {
+  filter: 0;
+}
+
+.fadeIn {
+  animation: fadeInAnim 1s;
+}
+
+.fadeOut {
+  animation: fadeOutAnim 1s;
+}
+
+@keyframes fadeInAnim
+{
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes fadeOutAnim
+{
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}
+
+@keyframes clickedAnim
+{
+  from {
+    filter: blur(4px);
+    -webkit-filter: blur(4px);
+  }
+  to {
+    filter: blur(0px);
+    -webkit-filter: blur(0px);
+  }
+}

assets/css/cte.css

@@ -0,0 +1,67 @@
+@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap');
+
+pre, span, div, p, h1 {
+  background-color: transparent;
+}
+
+* {
+  text-align: center;
+
+  margin: 0px;
+  padding: 0px;
+  overflow: hidden;
+
+  background-color: black;
+  color: white;
+
+  font-family: 'Source Code Pro', monospace;
+}
+
+pre {
+  /* background: white; */
+}
+
+.inline-container {
+  position: absolute;
+  bottom: 15%;
+  width: 470px;
+  /* width: 600px; */
+}
+
+.emoji {
+  height: 20px;
+  bottom:50%;
+  transform:translateY(30%);
+}
+
+#marquee {
+  display: inline-block;
+  width: 450px;
+}
+
+.title {
+  font-size: 25px;
+}
+
+.center {
+  position: absolute;
+
+  left: 50%;
+  top: 50%;
+
+  transform: translate(-50%, -50%);
+}
+
+.topbar {
+  top: 5%;
+}
+
+.centerbar {
+  
+}
+
+.bottombar {
+  top: auto;
+  bottom: 5%;
+}
+

assets/css/main.css

@@ -0,0 +1,54 @@
+/*
+Click to enter JavaScript
+*/
+
+var CTE = {};
+
+// The call back for when its finished
+CTE.callback = null;
+
+// The actual particles.js canvas it uses
+CTE.container = document.getElementById("content-container");
+CTE.container.style.opacity = 0;
+CTE.canvas = document.getElementsByTagName("canvas")[0];
+CTE.canvas.classList.add("unclicked");
+
+// Make the elements
+CTE.text = document.createElement("div");
+CTE.text.className = "overlaytext";
+CTE.text.id = "CTEText";
+CTE.text.innerText = "Click Me!";
+
+// Add the overlay to the actual site
+document.body.insertBefore(CTE.text, document.body.children[0]);
+// document.body.insertBefore(CTE.div, document.body.children[0]);
+
+// The function that will be execute upon click of the div or text
+CTE.clicked = () => {
+  if (CTE.canvas.className.includes("click") && !CTE.canvas.className.includes("unclicked"))
+    return;
+
+  // Fade off the blur
+  CTE.canvas.classList.remove("unclicked");
+  CTE.canvas.classList.add("click");
+  CTE.text.classList.add("fadeOut");
+  
+  // Fixing styling after
+  setTimeout(() => {
+    CTE.canvas.classList.add("clicked");
+    CTE.text.remove();
+    CTE.container.classList.add("fadeIn");
+
+    // Fade in styling fix
+    setTimeout(() => {
+      CTE.container.style.opacity = 1;
+      
+      if (CTE.callback && typeof(CTE.callback) == "function")
+        CTE.callback();
+    }, 1000);
+  }, 1000);
+}
+
+// Events
+CTE.canvas.onclick = CTE.clicked;
+// CTE.text.onclick = CTE.clicked;