This commit is contained in:
That-One-Nerd 2022-01-15 11:00:04 -05:00
parent d938648af9
commit df4b3df200
7 changed files with 400 additions and 0 deletions

0
games.html Normal file
View File

207
global/globalStyles.css Normal file
View File

@ -0,0 +1,207 @@
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Readex+Pro:wght@200;300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap');
*
{
box-sizing: border-box;
}
::selection
{
background-color: rgba(255, 153, 17, 0.5);
}
a
{
color: #f91;
position: relative;
text-decoration: none;
}
body
{
background-color: white;
color: black;
font-family: 'Readex Pro', 'Roboto', 'sans-serif';
font-size: 25px;
margin: 0px;
}
i
{
color: #f91;
}
i ::selection
{
color: default;
}
li
{
margin-left: 5%;
text-align: left;
}
a:after
{
background-color: #f91;
bottom: 0;
content: '';
height: 2px;
left: 0;
position: absolute;
transform: scale(0, 1);
transform-origin: bottom right;
width: 100%;
transition: transform 0.25s;
}
a:hover:after
{
transform: scale(1, 1);
transform-origin: bottom left;
}
.column
{
float: left;
}
.float-left
{
float: left;
text-align: left;
}
.float-right
{
float: right;
text-align: right;
}
.footer
{
background-color: #303030;
color: #505050;
font-size: 1.75vw;
margin: 0;
padding-bottom: 30px;
padding-top: 30px;
text-align: center;
}
.formattable code
{
background-color: #303030;
border-radius: 7.5px;
bottom: 2px;
color: white;
font-family: 'Roboto Mono', 'Roboto', 'sans-serif';
font-size: 70%;
padding-left: 5px;
padding-right: 5px;
position: relative;
}
.formattable-codeblock
{
background-color: #303030;
border-radius: 10px;
color: white;
font-family: 'Roboto Mono', 'Roboto', 'sans-serif';
font-size: 75%;
padding-bottom: 2.5px;
padding-top: 2.5px;
margin-left: 5%;
margin-right: 5%;
text-align: left;
width: 90%;
}
.formattable h1, .formattable h2, .formattable h3, .formattable h4, .formattable h5, .formattable h6
{
font-family: 'Outfit', 'Readex Pro', 'Roboto', 'sans-serif';
}
.formattable s
{
text-decoration-thickness: 2px;
}
.formattable table
{
background-color: rgba(0, 0, 0, 0.5);
border-collapse: collapse;
margin-left: 2.5%;
width: 95%;
}
.formattable td
{
text-align: left;
}
.formattable td, .formattable th
{
border-style: solid;
border-width: 2.5px;
}
.formattable tr:nth-child(even)
{
background-color: rgba(255, 255, 255, 0.25);
}
.header
{
background-color: #303030;
padding: 20px;
position: fixed;
width: 100%;
text-align: center;
top: 0;
z-index: 100;
}
.header a
{
color: white;
margin-left: 2.5%;
margin-right: 2.5%;
}
.nomargin
{
margin: 0;
}
.nopadding
{
padding: 0;
}
.row:after
{
content: "";
display: table;
clear: both;
}
.whitelink
{
color: white;
}
.whitelink:after
{
background-color: white;
}
.whiteselection ::selection
{
background-color: rgba(255, 255, 255, 0.5);
}

BIN
global/images/logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 577 KiB

78
index.html Normal file
View File

@ -0,0 +1,78 @@
<!DOCTYPE html>
<html>
<head>
<link href = "global/globalStyles.css" rel = "stylesheet" type = "text/css">
<link href = "index/styles.css" rel = "stylesheet" type = "text/css">
<title>Home | That_One_Nerd</title>
</head>
<body>
<div class = "header whiteselection">
<a href = "index.html">Home</a>
<a>Games</a>
<a>Links</a>
<a>News</a>
</div>
<div class = "formattable title whiteselection">
<h1>That_One_Nerd</h1>
</div>
<div id = "title-triangle"></div>
<div class="formattable row">
<div class="column" id = "about-left">
<img src = "global/images/logo.png">
</div>
<div class="column" id = "about-right">
<h2 class = "nomargin">I am <i>not</i> a professional game developer.</h2>
<h3 class = "nomargin">(Not yet)</h3>
<p>
Hey there, I'm Kyle. I'm 14, and I'm a hobbyist game developer, though maybe not a <i>casual</i> one. I like programming, specifically making video games. But, I'm in no need of money right now, and I just want to have a good time making games I would enjoy playing. That's why most of my games are completely free of charge. I'll always accept donations, but don't feel the need to give them. I don't need the money.
<br>
<br>
So, welcome aboard! Feel free to look around. I've got some useful stuff here. There is some stuff that I don't want to program here, though, so there are a few links that take you out of site to somewhere like <a href = "https://that-one-nerd.itch.io/" target = "_blank">Itch</a>, but I hope one day I'll have all of my games, info, etc, all here to view. We'll see how it goes.
</p>
</div>
</div>
<div class = "formattable whatido">
<h2>What kind of stuff do I do?</h2>
<p>
I usually program in <a href = "https://en.wikipedia.org/wiki/C_Sharp_(programming_language)" target = "_blank">C#</a> and <a href = "https://en.wikipedia.org/wiki/Unity_(game_engine)" target = "_blank">Unity</a>, and I am the best at those languages, but there are some others I know but am not as fluent in, like <a href = "https://en.wikipedia.org/wiki/C%2B%2B" target = "_blank">C++</a>, <a href = "https://en.wikipedia.org/wiki/Python_(programming_language)" target = "_blank">Python</a>, <a href = "https://en.wikipedia.org/wiki/Java_(programming_language)">Java</a>, and most recently, <a href = "https://en.wikipedia.org/wiki/HTML" target = "_blank">HTML</a> and <a href = "https://en.wikipedia.org/wiki/CSS" target = "_blank">CSS</a>. This website was the result of those new languages learned. No website builder needed this time!
Personally, I have an <i>insistence</i> to make all the code I use myself. I don't like using other people's code for mine. And, especially in C#, that's usually what I'll do. I get the uses of other people writing the code for you, but I still think it's fun to have the same learning experiance in the process, and to end up with code that you understand. There are a few exceptions to that, like <a href = "https://www.newtonsoft.com/json" target = "_blank">Newtonsoft.Json</a>, but who knows, maybe not for long :)
</p>
</div>
<div id = "hiring-triangle-top"></div>
<div class = "formattable hiring whiteselection">
<h2>Want to hire me?</h2>
<p>
Well, sorry to disappoint, but I have no interest in learning the stresses of adulthood 4 years early. I do commissions occasionally, and most of them are completely free of charge, but keep in mind that I'm not here to make myself hate programming by doing it nonstop for months (though I still do that, sometimes, on my own wishes), I'm here to make games. Not for a living, for a hobby. So how about you wait a few more years before you introduce another inspired teen to crunch culture.
<br>
<br>
<br>
<br>
On the other hand, if you want to come chill, I have a <a>Discord</a> you can join, or you can email me directly at <a href = "mailto:dev@thatonenerd.net">dev@thatonenerd.net</a>
<b>Todo: make triangle on top and bottom of this, as well as bottom of title, make discord link work, switch email to remove slashes</b>
</p>
</div>
<div id = "hiring-triangle-bottom"></div>
<div class = "formattable thelatest whiteselection">
<h2>What's the latest?</h2>
<ul>
<li>This first edition of this site has been made! More will come, probably.</li>
</ul>
<p>Want older announcements? Check out the <a class = "whitelink">news</a> page!</p>
</div>
<div class = "formattable footer whiteselection">
<h6 class = "nomargin"><b>That_One_Nerd</b> 2022</h6>
</div>
</body>
</html>

115
index/styles.css Normal file
View File

@ -0,0 +1,115 @@
.hiring
{
background-color: #303030;
color: white;
font-size: 1.75vw;
padding-bottom: 50px;
padding-left: 10%;
padding-right: 10%;
padding-top: 50px;
text-align: center;
}
.hiring h2
{
color: #f91;
}
.row
{
float: right;
margin: 0;
height: 300px;
width: 100%;
}
.title
{
background-color: #f91;
color: #000;
text-align: center;
margin-top: 71px;
padding-bottom: 100px;
padding-left: 40px;
padding-right: 40px;
padding-top: 100px;
}
.thelatest
{
background-color: #f91;
font-size: 1.75vw;
margin: 0;
padding-bottom: 75px;
padding-right: 6.25%;
padding-top: 25px;
text-align: center;
}
.title h1
{
font-size: 300%;
margin: 0px;
}
.whatido
{
float: none;
font-size: 1.6vw;
padding-bottom: 100px;
padding-left: 10%;
padding-right: 10%;
padding-top: 100px;
margin-top: 35vw;
}
#about-left
{
width: 45%;
}
#about-left img
{
padding-bottom: 50px;
padding-left: 7.5%;
padding-right: 7.5%;
padding-top: 50px;
width: 85%;
}
#about-right
{
font-size: 1.4vw;
padding-bottom: 50px;
padding-right: 50px;
padding-top: 50px;
text-align: right;
width: 55%;
}
#hiring-triangle-bottom
{
width: 0;
height: 0;
border-left: solid 100vw;
border-top: solid 50px;
border-color: #303030 #303030 #f91 #f91;
}
#hiring-triangle-top
{
width: 0;
height: 0;
border-right: solid 100vw;
border-bottom: solid 50px;
border-color: transparent transparent #303030 #303030;
}
#title-triangle
{
width: 0;
height: 0;
border-left: solid 100vw;
border-top: solid 50px;
border-color: #f91 #f91 transparent transparent;
}

0
links.html Normal file
View File

0
news.html Normal file
View File