change bad CSS + make text move

author: oxi <74726611+oxi1224@users.noreply.github.com> 2022-10-12 21:31:12 +0300
committer: GitHub <noreply@github.com> 2022-10-12 21:31:12 +0300
commit: f8eb6448a4d4f10dfa19bdf2c79691c0e9de55f3 (patch)
tree: c20c11f5894597db4de41ee71ad2fb95edd53266
parent: 399aa393b8810bbea265fdb23d3c3ac9ffe72658 (diff)
download: exhq.github.io-f8eb6448a4d4f10dfa19bdf2c79691c0e9de55f3.tar.gz
exhq.github.io-f8eb6448a4d4f10dfa19bdf2c79691c0e9de55f3.tar.bz2
exhq.github.io-f8eb6448a4d4f10dfa19bdf2c79691c0e9de55f3.zip
3 files changed, 531 insertions, 0 deletions
diff --git a/funny.js b/funny.js
new file mode 100644
index 0000000..5b43dcc
--- /dev/null
+++ b/funny.js
@@ -0,0 +1,75 @@
+var titles = [
+    "i work out",
+    "funny",
+    "Kara Kara Kara no Kara",
+    "26047",
+    "Can I Friend You On Bassbook? Lol",
+    "im gay",
+    "cognrjatulations !!!",
+    "futanari",
+    "ubuntu (ew)",
+    "phantoms are annoying",
+    "/give @a hugs 999999",
+    "please add command support vendy",
+    "mrekk",
+    "women fear me",
+    "fish fear me",
+    "men turn their eyes away from me",
+    "as i walk no beast dares makes a sound",
+    "i am alone in this barren earth",
+    "uptown funk you up",
+    "stackoverflow my beloved",
+    "*thrusts into you*",
+    "also what are these for?",
+    "its morbing time",
+    "bungling bungus",
+    "rate this base.apk Architecture splits: \nconfig.arm64_v8a.apk \nconfig.armeabi_v7a.apk \nconfig.x86_64.apk \n config.x86.apk \n DPI splits: \n config.hdpi.apk \n config.xxhdpi.apk \n Language splits: \nconfig.de.apk \n config.en.apk",
+    "Now explode",
+    "“message logger when”",
+    "A wild ⛧artificialmusik appeared.",
+    "IS THAT A MOTHERUCFKCING JOJOI REFERENCE???//?",
+    "Cats are not ducks",
+    "just farted",
+    "ReeK - Making Zurek While Getting A Flandre Fumo Shoved Up My A-",
+    "what the fuck is an lsp log",
+    "'ewwo evewypony",
+    "also, what the fuck is a mustard",
+    "727",
+    "WYFSI",
+    "that time i reincarnated as a toilet in another world",
+    "vim >>>>>> emacs",
+    "also try out archlinux.org",
+    "how to print [[this, this, and, this, all, together as a single string]]?",
+    "😢",
+    "None.",
+    "deez nuts",
+    "trolley",
+    
+] 
+
+document.title = titles[Math.floor(Math.random()*titles.length)];
+
+//button bs
+bool = false
+var audio 
+if (new Date().getMonth() === 9){
+    console.log("boo")
+    audio = new Audio('boo.mp3')
+} else {
+    audio = new Audio('for-maeve.mp3')
+}
+function no() {
+    bool = !bool
+    if(bool){
+        audio.play()
+    } else {
+        audio.pause()
+    }
+  }
+
+const swapElm = document.getElementById('b');
+swapElm.addEventListener('mouseover', () => {
+    const prev = swapElm.style.transform;
+    if (!prev || prev === 'translateX(0px)') swapElm.style.transform = 'translateX(200%)';
+    else swapElm.style.transform = 'translateX(0px)';
+});
+\ No newline at end of file
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..39085df
--- /dev/null
+++ b/index.html
@@ -0,0 +1,152 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <link rel="stylesheet" href="styles.css" />
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta content="best website (real)" property="og:title" />
+    <meta content="echo's shitty website" property="og:description" />
+    <meta content="https://exhq.github.io" property="og:url" />
+    <meta
+      content="https://cdn.discordapp.com/attachments/832652653292027904/967009610907144223/Untitled.png"
+      property="og:image"
+    />
+    <script src="funny.js" defer></script>
+    <meta content="#43B581" data-react-helmet="true" name="theme-color" />
+  </head>
+  <body>
+    
+    <div class="topnav">
+      <a class="active" href="#home">Home</a>
+      <a href="#ticd">Things i <u>cant</u> do </a>
+      <a href="#contact">Contact me / About me</a>
+      <a onclick="no()">do you want to bless your ears?
+      <a href="https://exhq.gay/neOwOfetch">try neOwOfetch :)</a>
+      </a>
+    </div>
+
+    <div class="downnav">
+      <h3 class="imsotired">copy right something smething i forgor :skull:</h3>
+    </div>
+    <div id="home"></div>
+    <br />
+    <br />
+    <h1 class="header">
+      have you ever wanted a "developer"<br />
+      that <span class="empty"></span> nothing other than standing around being
+      useless?
+    </h1>
+    <img
+      class="me"
+      src="https://cdn.discordapp.com/attachments/917977729322872853/967004653147553802/me.png"
+      alt="me"
+    />
+    <h2 class="mebeinguseless">a picture of me being useless</h2>
+    <h1 class="data">i <u>CANNOT</u> program:</h1>
+
+    <div class="languages-wrapper">
+      <div>
+        <img
+          class="javaimg"
+          src="https://cdn.discordapp.com/attachments/917977729322872853/973143267677978634/clang.png"
+          alt=""
+        />
+        <span class="notjava">its 2022, at least use c++</span>
+      </div>
+      <div>
+        <img
+          class="javaimg"
+          src="https://cdn.discordapp.com/attachments/832652653292027904/973146727689379860/clang.png"
+          alt=""
+          style="margin-left: 0;"
+        />
+        <span class="notjava">its 2022, at least use java</span>
+      </div>
+      <div>
+        <img
+          class="javaimg"
+          src="https://cdn.discordapp.com/attachments/917977729322872853/967023902939283456/go.png"
+          alt=""
+        />
+        <span class="notjava">this joke was removed due to 1984</span>
+      </div>
+      <div>
+        <img
+          class="javaimg"
+          src="https://cdn.discordapp.com/attachments/917977729322872853/967023935713607751/R.png"
+          alt=""
+        />
+        <span class="notjava">this is not centered and idk how to fix it</span>
+      </div>
+      <div>
+        <img
+          class="javaimg"
+          src="https://cdn.discordapp.com/attachments/917977729322872853/967009849680486410/ruby.png"
+          alt=""
+        />
+        <span class="notjava">who the fuck unironically uses ruby?</span>
+      </div>
+      <div>
+        <img
+          class="rustimg"
+          src="https://cdn.discordapp.com/attachments/917977729322872853/967024017812897883/rust.png"
+          alt=""
+          style="margin-left: 0;"
+        />
+        <span class="notjava">:sOmEOneSAIdRUst: shut the fuck up ÅĠěŜŋżųŹ¢¶Ěá</span>
+      </div>
+      <div style="grid-column: span 2;">
+        <img
+          class="javaimg jsimg"
+          src="https://cdn.discordapp.com/attachments/918571703137894421/999223367750127616/Unofficial_JavaScript_logo_2.svg.png"
+          alt=""
+        />
+        <span class="notjava">([][[]]+[])[+!+[]]+(!![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+[]]]</span>
+      </div>
+    </div>
+
+    <div id="about"></div>
+    <br />
+    <h1 class="data" id="ticd">i <u>CANNOT</u> be:</h1>
+    <span class="being">⋅useful</span>
+    <br />
+    <span class="being">⋅productive</span>
+    <br />
+    <span class="being">⋅fun</span>
+    <br />
+    <span class="being">⋅smart</span>
+    <br />
+    <span class="being">⋅creative</span>
+    <br />
+    <span class="being"
+      >⋅ < Dot Operator, Unicode number: U+22C5, Unicode version: 1.1
+      (1993)</span
+    >
+    <br />
+    <br />
+    <h1 class="data" id="contact">
+      contact me<a class="shh" href="https://pastebin.com/uuqnLybA">:</a>
+    </h1>
+    <div id="b"><span
+      class="runaway"
+    >click here for contacts</span></div>
+    <br />
+    <br />
+    <h1 class="data">about me:</h1>
+    <p class="aboutme">bored 18 yo who makes shitty stuff</p>
+    <div class="tooltip">
+      (hover for exact age)
+      <span class="tooltiptext">2004, 06th aug</span>
+    </div>
+    <p class="aboutme">
+      i wuv u so so so so so so so much oxi og <3 muah <br />
+      i have had multiple sexual intercourses with your mother, she's hot <br />
+      i'm also a big fan of
+      <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ"> avengers </a>
+    </p>
+    <br />
+    <br />
+    <br />
+  </body>
+</html>
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000..d213064
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,304 @@
+@import url('https://fonts.googleapis.com/css2?family=Lora&display=swap');
+@import url('https://fonts.googleapis.com/css?family=Fira+Sans&display=swap');
+@import url('https://fonts.googleapis.com/css?family=Google+Sans&display=swap');
+
+/* Declare color variables */
+:root{
+  --title-color: #ff80a4;
+  --text-color: #ff2674;
+  --background-color: #202124;
+  --nav-background-color: #333;
+}
+
+/* make the scrolling smooth */
+html, body{
+  scroll-behavior: smooth;
+  overflow-x: hidden;
+}
+
+.header{
+    color: var(--background-color);
+    padding: 10px;
+    font-size: 40px;
+    font-weight: bold;
+    text-align: center;
+    font-family: 'google sans', serif;
+    animation: colorchange 7s infinite alternate;
+}
+
+.java{
+    vertical-align: middle;
+    font-size: 10px;
+}
+
+.javaimg{
+    margin-left: 20%;
+    width: 50px;
+    height: 50px;
+    vertical-align: middle;
+}
+
+.rustimg{
+    margin-left: 2.6%;
+    width: 50px;
+    height: 50px;
+    vertical-align: middle;
+}
+
+.topnav{
+    /* make the navbar follow the scroll */
+    position: fixed;
+    top: 0;
+    left: 0;
+    margin: auto;
+    border: 1px solid var(--background-color);
+    box-shadow: 0px 0px 10px var(--background-color);
+    z-index: 1;
+    background-color: var(--nav-background-color);
+    overflow: hidden;
+    width: 100%;
+}
+
+.downnav{
+      /* make the navbar follow the scroll */
+      position: fixed;
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      margin: auto;
+      overflow: hidden;
+      border: 1px solid var(--background-color);
+      box-shadow: 0px 0px 6px var(--background-color);
+      z-index: 1;
+      background-color: var(--nav-background-color);
+}
+
+.imsotired{
+  margin-left: 1%;
+  font-family: 'fira sans', serif;
+  color: var(--title-color);
+}
+
+.topnav a{
+    user-select: none;
+    float: left;
+    color: #f2f2f2;
+    text-align: center;
+    padding: 14px 16px;
+    text-decoration: none;
+    font-family: "google sans";
+    font-size: 15px;
+}
+
+.topnav a:hover{
+    background-color: #ddd;
+    color: black;
+}
+
+.topnav a.active{
+    background-color: var(--title-color);
+    color: white;
+}
+
+.java{
+    width: 5%;
+    font-family: 'fira sans', serif;
+    color: var(--title-color);
+    padding: 10px;
+    font-size: 40px;
+    font-weight: bold;
+    margin-left: 10%;
+    margin-top: 30px;
+}
+
+.notjava{
+    margin-left: 3%;
+    font-family: 'fira sans';
+    color: var(--text-color);
+}
+
+.data{
+    font-family: 'fira sans', serif;
+    color: var(--title-color);
+    padding: 10px;
+    font-size: 40px;
+    font-weight: bold;
+    margin-left: 10%;
+    margin-top: 30px;
+}
+
+.header span::before{
+  pointer-events: all;
+    content: "does ";
+    color: #fff;
+    animation: colorchange 5s infinite alternate;
+}
+
+.being{
+    margin-left: 11%;
+    font-family: 'fira sans';
+    color: var(--text-color);
+    font-size: 120%
+}
+
+
+.tooltip{
+  position: relative;
+  display: inline-block;
+  margin-left: 13%;
+  font-family: 'fira sans';
+  color: var(--text-color);
+  font-size: 120%
+}
+
+.tooltip .tooltiptext{
+  visibility: hidden;
+  width: 120px;
+  color: var(--title-color);
+  text-align: center;
+  border-radius: 6px;
+  padding: 5px 0;
+  position: absolute;
+  z-index: 1;
+  border:0px solid black;
+  bottom: 100%;
+  left: 50%;
+  margin-left: -60px;
+  background-color:#ff267665;
+  opacity: 0;
+  transition: opacity 1s;
+}
+
+.tooltip:hover .tooltiptext{
+  visibility: visible;
+  opacity: 1;
+}
+
+.shh{
+text-decoration: none;
+font-family: 'fira sans';
+font-size: 120%;
+color: var(--title-color);
+}
+
+.aboutme{
+    margin-left: 13%;
+    font-family: 'fira sans';
+    color: var(--text-color);
+    font-size: 120%
+}
+
+.goimg{
+    width: 50px;
+    height: 50px;
+    vertical-align: middle;
+    margin-left: 10%;
+}
+
+@keyframes colorchange{
+    0% {
+      color: #16171a;
+    }
+    10% {
+      color: #7f0622;
+    }
+    20% {
+      color: #d62411;
+    }
+    30% {
+      color: #ff8426;
+    }
+    40% {
+      color: #ffd100;
+    }
+    50% {
+      color: #fafdff;
+    }
+    60% {
+      color: #ff80a4;
+    }
+    70% {
+      color: #ff2674;
+    }
+    80% {
+      color: #94216a;
+    }
+    90% {
+      color: #234975;
+    }
+    100% {
+      color: pink;
+    }
+  }
+
+.mebeinguseless{
+    color: var(--title-color);
+    padding: 10px;
+    font-size: 15px;
+    font-weight: bold;
+    text-align: center;
+    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
+}
+
+.runaway{
+    color: var(--text-color);
+    padding: 10px;
+    font-size: 15px;
+    font-weight: bold;
+    text-align: center;
+    white-space: no-wrap;
+    font-family: 'fira sans';
+}
+
+.cover{
+  position: absolute;
+  left: 10.5%;
+
+}
+
+#b {
+  width: fit-content;
+  margin-left: 10vw;
+}
+
+.me{
+    width: 50%;
+    margin-left: 25%;
+    transform: scale(0.75);
+    margin-bottom: -60px
+}
+
+html{
+    background-color: var(--background-color);
+}
+
+.go{
+  font-weight: 9000;
+  font-size: 120%;
+}
+
+
+.languages-wrapper{
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  grid-template-rows: repeat(3, 1fr);
+}
+
+.jsimg {
+  margin-left: 10%;
+}
+
+@media only screen and (max-width: 900px) {
+  /* .data{
+      margin-left: 0
+  } */
+  .javaimg{
+      margin-left: 0;
+  }
+  .jsimg {
+    margin-left: 0;
+  }
+}
+.none{
+  display: none;
+}
+\ No newline at end of file
author	oxi <74726611+oxi1224@users.noreply.github.com>	2022-10-12 21:31:12 +0300
committer	GitHub <noreply@github.com>	2022-10-12 21:31:12 +0300
commit	f8eb6448a4d4f10dfa19bdf2c79691c0e9de55f3 (patch)
tree	c20c11f5894597db4de41ee71ad2fb95edd53266
parent	399aa393b8810bbea265fdb23d3c3ac9ffe72658 (diff)
download	exhq.github.io-f8eb6448a4d4f10dfa19bdf2c79691c0e9de55f3.tar.gz exhq.github.io-f8eb6448a4d4f10dfa19bdf2c79691c0e9de55f3.tar.bz2 exhq.github.io-f8eb6448a4d4f10dfa19bdf2c79691c0e9de55f3.zip