diff options
| -rw-r--r-- | funny.js | 75 | ||||
| -rw-r--r-- | index.html | 152 | ||||
| -rw-r--r-- | styles.css | 304 |
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 |