init
This commit is contained in:
commit
4fbbef0bf7
8 changed files with 191 additions and 0 deletions
BIN
barista-guy.jpg
Normal file
BIN
barista-guy.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 599 KiB |
90
index.html
Normal file
90
index.html
Normal file
|
@ -0,0 +1,90 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Nanum+Myeongjo&display=swap" rel="stylesheet">
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
<title>I Will Punch You</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="head">
|
||||||
|
<div class="left">
|
||||||
|
<a href="#"><span>Home</span></a>
|
||||||
|
<a href="#why-punching"><span>Why Punch</span></a>
|
||||||
|
</div>
|
||||||
|
<div class="center">
|
||||||
|
I Will Punch You
|
||||||
|
</div>
|
||||||
|
<div class="right">
|
||||||
|
<a href="#contact"><span>Contact</span></a>
|
||||||
|
<a href="https://ko-fi.com/kitsuclub"><span class="pp">Punch+</span></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="splash">
|
||||||
|
<div class="rh">
|
||||||
|
Providing <span class="free">FREE</span> punching since<br>19 aught' 6.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="block">
|
||||||
|
<h2 id="why-punching">Why Punching?</h2>
|
||||||
|
<div class="innerblock">
|
||||||
|
<img src="me.jpg" width="25%" alt="A photo of a person in a moose costume being hugged by a lady in a touque and gloves. It's _not_ winter">
|
||||||
|
<p>My name is John PunchingMan, a maverick in the realm of alternative therapies.
|
||||||
|
As a result of great moderation and feedback by the people I paid 700 dollars to write good feedback about me, I determined that a good punch can solve a lot of problems. I have unlocked the secret power of punching people, and want to share it with the world, for free!<br>
|
||||||
|
<br>
|
||||||
|
Through my extensive searching on bing, I discovered that punching people at random, with no set duration or schedule, makes that person's bloodflow improve by 7,000%. It is also the world's best cure to wanting to look purple for only like, idk a week i guess.<br>
|
||||||
|
<br>
|
||||||
|
As a believer of science, I know that free, untimed and irregular punches of an unspecified duration, to an unspecified part of the body makes you feel amazing about your day; Which is why I feel amazing about offering this service, around the globe, for free!<br>
|
||||||
|
<br>
|
||||||
|
The non-believers can SUCK IT! JOHN WON AGAIN! JOHN DID IT! JOHN MADE PUNCHING A SCIENCE!
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="block light">
|
||||||
|
<center><h2>Look at all of these satisfied members!</h2></center>
|
||||||
|
<div class="punchcrew">
|
||||||
|
<span class="person">
|
||||||
|
<img src="yassie.webp" width="200px" alt="">
|
||||||
|
I never agreed to this<br>
|
||||||
|
-- yas c.</span>
|
||||||
|
<span class="person">
|
||||||
|
<img src="lumbarjack.jpg" width="200px" alt="">
|
||||||
|
Please don't post me on your website<br>
|
||||||
|
-- michael, the guy suing me
|
||||||
|
</span>
|
||||||
|
<span class="person">
|
||||||
|
<img src="kio.png" width="200px" alt="">
|
||||||
|
Why did I allow this<br>
|
||||||
|
-- a dumbass fox
|
||||||
|
</span>
|
||||||
|
<span class="person">
|
||||||
|
<img src="barista-guy.jpg" width="200px" alt="">
|
||||||
|
that'll be 27 dollars<br>
|
||||||
|
-- my barista
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="block">
|
||||||
|
<h2 id="contact">Get in touch</h2>
|
||||||
|
<center>no</center>
|
||||||
|
</div>
|
||||||
|
<div class="block light" style="color: grey; text-align: center;">
|
||||||
|
<div class="innerblock" style="justify-content: center;">
|
||||||
|
<p style="text-align: center;">if you would like to opt out of being punched, please open my document at
|
||||||
|
<span style="-webkit-user-select: none; -ms-user-select: none; user-select: none;">opt-out-document-that-i-am-legally-mandated-to-have-on-my-website-for-whatever-reason.pdf</span>, and remember that you are weak and a coward because you don't like being punched, and need to make it my problem
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<small>this site is a parody and satire. i'm not sorry. seriously. i'm not, because this doesn't exist. Image credits, Barista is by Benzolx on freepik, the moose & the lumbarjack are by cira, yas c. is yassie, and kio is obv. kio. if your name is John PunchingMan and you want me to change the name, please open up <span style="-webkit-user-select: none; -ms-user-select: none; user-select: none;">opt-out-document-that-i-am-legally-mandated-to-have-on-my-website-for-whatever-reason.pdf</span> and opt-out</small>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
<!--
|
||||||
|
Image Credits:
|
||||||
|
Image of Barista by Benzolx on Freepik.
|
||||||
|
Image of Mooseman & Lumbarjack by CIRA.
|
||||||
|
|
||||||
|
-->
|
||||||
|
</html>
|
BIN
kio.png
Normal file
BIN
kio.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 141 KiB |
BIN
lumbarjack.jpg
Normal file
BIN
lumbarjack.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 101 KiB |
BIN
me.jpg
Normal file
BIN
me.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 318 KiB |
Binary file not shown.
101
style.css
Normal file
101
style.css
Normal file
|
@ -0,0 +1,101 @@
|
||||||
|
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
background: #0f0f0f;
|
||||||
|
color: white;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#head {
|
||||||
|
background: slategray;
|
||||||
|
padding: 1rem 2rem ;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
position: sticky;
|
||||||
|
border-bottom: 1px solid rgba(255,255,255,.5)
|
||||||
|
}
|
||||||
|
|
||||||
|
#head .center {
|
||||||
|
font-size: 30px;
|
||||||
|
font-family: "Nanum Myeongjo", serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
#head .right, #head .left {
|
||||||
|
display: flex;
|
||||||
|
width: 15rem;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#head .right span, #head .left span {
|
||||||
|
cursor: pointer;
|
||||||
|
-webkit-user-select: none; /* Safari */
|
||||||
|
-ms-user-select: none; /* IE 10 and IE 11 */
|
||||||
|
user-select: none; /* Standard syntax */
|
||||||
|
}
|
||||||
|
|
||||||
|
#head .right .pp {
|
||||||
|
font-weight: 700;
|
||||||
|
padding: 5px 10px;
|
||||||
|
border: 1px solid white;
|
||||||
|
background: darkgreen
|
||||||
|
}
|
||||||
|
|
||||||
|
#splash {
|
||||||
|
background: #2f2f2f;
|
||||||
|
height: 85vh;
|
||||||
|
display: flex;
|
||||||
|
justify-content: end;
|
||||||
|
align-items: center;
|
||||||
|
padding-right: 15vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: white;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#splash .rh {
|
||||||
|
width: 25vw;
|
||||||
|
text-align: right;
|
||||||
|
font-size: 60px;
|
||||||
|
position: relative;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#splash .rh .free {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
.block {
|
||||||
|
padding: .5vh 5vw 2vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.innerblock {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.innerblock p {
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.light {
|
||||||
|
background: #2f2f2f;
|
||||||
|
}
|
||||||
|
|
||||||
|
.punchcrew {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.punchcrew .person {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
BIN
yassie.webp
Normal file
BIN
yassie.webp
Normal file
Binary file not shown.
After Width: | Height: | Size: 27 KiB |
Loading…
Add table
Add a link
Reference in a new issue