Cac0demon/goofy-goober.markdown

## goofy-goober.markdown

      
    Raw
  

              goofy-goober.markdown
            
          
    Goofy Goober

A Pen by Cac0demon on CodePen.
License.

  
## index.html
<html>

<head>
  <title>About Me</title>
  <meta name="author" content="Emerson S">
  <meta name="description" content="About me, i guess...?">
  <meta name="keywords" content="Biography, Emerson S., EpicZero444, About me">
  <meta name="generator" content="codepen.io">
  <link rel="stylesheet" href="style.css">
  <script src="script.js"></script>
</head>

<body>
  <hr>
  <h1 id="name1">Emerson S.</h1>
  <hr>
  <h1 id="name2">Lem O Nade</h1>
  <hr>
  <h1 id="name3">EpicZero444</h1>
  <hr>
  <h1 id="name4">Totallynotafurry</h1>
  <hr>
  <h2>Settings:</h2>
  <p>Background music (looping):</p>
  <audio id="a1" src="http://codeskulptor-demos.commondatastorage.googleapis.com/GalaxyInvaders/theme_01.mp3" controls loop></audio>
  <audio id="a2" src="http://codeskulptor-demos.commondatastorage.googleapis.com/pang/paza-moduless.mp3" controls loop></audio>
  <audio id="a3" src="http://commondatastorage.googleapis.com/codeskulptor-demos/riceracer_assets/music/race1.ogg" controls loop></audio>
  <p>Dark Mode (I prefer it, honestly):</p>
  <button id="btn" onclick="fun()">
    <img id="bti" src="https://images.uncommongoods.com/images/items/55700/55715_1_640px.jpg" alt="Lightbulb Image">
  </button>
  <hr>
  <h2>Sports I have done include:</h2>
  <ul>
    <li>swimming!</li>
    <li>archery!</li>
    <li>climbing!</li>
    <li>golf!</li>
    <li>volcano rappelling!</li>
  </ul>
  <p>(JK about the volcano rappelling btw)</p>
  <hr>
  <h2>Yes, I am a furry.</h2>
  <p>(Just dont harass me and we're good 😸👍)</p>
  <hr>
  <h2>I play Magic: The Gathering.</h2>
  <p>(Yes, I know I should get into D&D)</p>
  <hr>

  <h2>Lastly, if for some strange reason, you MUST contact me:</h2>
  <ol>
    <li>Email: epiczero444@gmail.com</li>
    <li>Discord: epiczero444</li>
    <li>Roblox (You'll never guess what this one is): EpicZero444</li>
    <li>Minecraft: CookerData93151 (I know, surprising!)</li>
    <li>(No I don't have a phone or phone number, stop asking)</li>

  </ol>
  <hr>
</body>

</html>

## script.js
function fun() {
  document.body.classList.toggle("darkMode");
}

## style.css
h1 {
  font-size: 55px;
  text-align: center;
  color: black;
}

h2 {
  font-size: 40px;
  color: orange;
}

p {
  font-size: 33px;
  color: red;
}

#name1 {
  color: blue;
  font-family: arial;
}

#name2 {
  color: green;
  font-family: helvetica;
}

#name3 {
  color: red;
  font-family: sans-serif;
}

#name4 {
  color: aqua;
  font-family: comic-sans;
}

ul {
  font-size: 35px;
  color: blue;
}

ol {
  font-size: 35px;
  color: blue;
}

hr {
  height: 5px;
  background-color: purple;
}

#ws {
  font-size: 55px;
  text-align: center;
}

.darkMode {
  color: #00ff33;
  background: black;
}

#btn {
  padding: 0;
  background: none;
  border: none;
}

#bti {
  width: 70px;
  height: 70px;
}

body {
  background-color: lightblue;
}

html {
  cursor: crosshair;
}
	<html>

	<head>
	<title>About Me</title>
	<meta name="author" content="Emerson S">
	<meta name="description" content="About me, i guess...?">
	<meta name="keywords" content="Biography, Emerson S., EpicZero444, About me">
	<meta name="generator" content="codepen.io">
	<link rel="stylesheet" href="style.css">
	<script src="script.js"></script>
	</head>

	<body>
	<hr>
	<h1 id="name1">Emerson S.</h1>
	<hr>
	<h1 id="name2">Lem O Nade</h1>
	<hr>
	<h1 id="name3">EpicZero444</h1>
	<hr>
	<h1 id="name4">Totallynotafurry</h1>
	<hr>
	<h2>Settings:</h2>
	<p>Background music (looping):</p>
	<audio id="a1" src="http://codeskulptor-demos.commondatastorage.googleapis.com/GalaxyInvaders/theme_01.mp3" controls loop></audio>
	<audio id="a2" src="http://codeskulptor-demos.commondatastorage.googleapis.com/pang/paza-moduless.mp3" controls loop></audio>
	<audio id="a3" src="http://commondatastorage.googleapis.com/codeskulptor-demos/riceracer_assets/music/race1.ogg" controls loop></audio>
	<p>Dark Mode (I prefer it, honestly):</p>
	<button id="btn" onclick="fun()">
	<img id="bti" src="https://images.uncommongoods.com/images/items/55700/55715_1_640px.jpg" alt="Lightbulb Image">
	</button>
	<hr>
	<h2>Sports I have done include:</h2>
	<ul>
	<li>swimming!</li>
	<li>archery!</li>
	<li>climbing!</li>
	<li>golf!</li>
	<li>volcano rappelling!</li>
	</ul>
	<p>(JK about the volcano rappelling btw)</p>
	<hr>
	<h2>Yes, I am a furry.</h2>
	<p>(Just dont harass me and we're good 😸👍)</p>
	<hr>
	<h2>I play Magic: The Gathering.</h2>
	<p>(Yes, I know I should get into D&D)</p>
	<hr>

	<h2>Lastly, if for some strange reason, you MUST contact me:</h2>
	<ol>
	<li>Email: epiczero444@gmail.com</li>
	<li>Discord: epiczero444</li>
	<li>Roblox (You'll never guess what this one is): EpicZero444</li>
	<li>Minecraft: CookerData93151 (I know, surprising!)</li>
	<li>(No I don't have a phone or phone number, stop asking)</li>

	</ol>
	<hr>
	</body>

	</html>
	function fun() {
	document.body.classList.toggle("darkMode");
	}
	h1 {
	font-size: 55px;
	text-align: center;
	color: black;
	}

	h2 {
	font-size: 40px;
	color: orange;
	}

	p {
	font-size: 33px;
	color: red;
	}

	#name1 {
	color: blue;
	font-family: arial;
	}

	#name2 {
	color: green;
	font-family: helvetica;
	}

	#name3 {
	color: red;
	font-family: sans-serif;
	}

	#name4 {
	color: aqua;
	font-family: comic-sans;
	}

	ul {
	font-size: 35px;
	color: blue;
	}

	ol {
	font-size: 35px;
	color: blue;
	}

	hr {
	height: 5px;
	background-color: purple;
	}

	#ws {
	font-size: 55px;
	text-align: center;
	}

	.darkMode {
	color: #00ff33;
	background: black;
	}

	#btn {
	padding: 0;
	background: none;
	border: none;
	}

	#bti {
	width: 70px;
	height: 70px;
	}

	body {
	background-color: lightblue;
	}

	html {
	cursor: crosshair;
	}