mirror of
https://github.com/kforney/kforney.github.io.git
synced 2024-11-14 02:52:02 -07:00
Merge pull request #4 from CarsonStrout/master
Resume opens to new page, centered copyright
This commit is contained in:
Kaj Forney
GitHub
commit
23897feff0
2 changed files with 639 additions and 501 deletions
408
css/main.css
408
css/main.css
|
|
@ -12,9 +12,9 @@
|
|||
========================================================================== */
|
||||
|
||||
html {
|
||||
color: #222;
|
||||
font-size: 1em;
|
||||
line-height: 1.4;
|
||||
color: #222;
|
||||
font-size: 1em;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
@ -28,13 +28,13 @@ html {
|
|||
*/
|
||||
|
||||
::-moz-selection {
|
||||
background: #b3d4fc;
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: #b3d4fc;
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
@ -42,12 +42,12 @@ html {
|
|||
*/
|
||||
|
||||
hr {
|
||||
display: block;
|
||||
height: 1px;
|
||||
border: 0;
|
||||
border-top: 1px solid #ccc;
|
||||
margin: 1em 0;
|
||||
padding: 0;
|
||||
display: block;
|
||||
height: 1px;
|
||||
border: 0;
|
||||
border-top: 1px solid #ccc;
|
||||
margin: 1em 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
@ -62,7 +62,7 @@ iframe,
|
|||
img,
|
||||
svg,
|
||||
video {
|
||||
vertical-align: middle;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
@ -70,9 +70,9 @@ video {
|
|||
*/
|
||||
|
||||
fieldset {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
@ -80,7 +80,7 @@ fieldset {
|
|||
*/
|
||||
|
||||
textarea {
|
||||
resize: vertical;
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
|
|
@ -101,207 +101,206 @@ textarea {
|
|||
#B17300 RGBA(177, 115, 0, 1) HSL(39, 100%, 35%)
|
||||
*/
|
||||
|
||||
body, html {
|
||||
margin: 0;
|
||||
body,
|
||||
html {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #161A25;
|
||||
background-image: url("/img/branding/backgroundSmall.png");
|
||||
background-color: #161a25;
|
||||
background-image: url("/img/branding/backgroundSmall.png");
|
||||
}
|
||||
|
||||
|
||||
h1 {
|
||||
font-family: VT323;
|
||||
font-size: 64px;
|
||||
color: #FFBC42;
|
||||
text-align: center;
|
||||
font-family: VT323;
|
||||
font-size: 64px;
|
||||
color: #ffbc42;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h2{
|
||||
font-family: Oswald;
|
||||
font-size: 64px;
|
||||
color: #78a1bb;
|
||||
text-align: center;
|
||||
h2 {
|
||||
font-family: Oswald;
|
||||
font-size: 64px;
|
||||
color: #78a1bb;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
font-size: 28px;
|
||||
color: #78a1bb;
|
||||
text-align: center;
|
||||
font-family: "IBM Plex Mono", monospace;
|
||||
font-size: 28px;
|
||||
color: #78a1bb;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: 'IBM Plex Sans', sans-serif;
|
||||
font-size: 20px;
|
||||
color: #78a1bb;
|
||||
text-align: center;
|
||||
font-family: "IBM Plex Sans", sans-serif;
|
||||
font-size: 20px;
|
||||
color: #78a1bb;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
hr {
|
||||
border-top: #78a1bb dashed 4px;
|
||||
max-width: 75%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
border-top: #78a1bb dashed 4px;
|
||||
max-width: 75%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
iframe[src*=youtube]
|
||||
{
|
||||
text-align: center;
|
||||
display: block;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
max-width:80%;
|
||||
iframe[src*="youtube"] {
|
||||
text-align: center;
|
||||
display: block;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
max-width: 80%;
|
||||
}
|
||||
|
||||
iframe[src*=itch]
|
||||
{
|
||||
text-align: center;
|
||||
display: block;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
max-width: 80%;
|
||||
iframe[src*="itch"] {
|
||||
text-align: center;
|
||||
display: block;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
max-width: 80%;
|
||||
}
|
||||
|
||||
.parallax {
|
||||
position: relative;
|
||||
background-attachment: fixed;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
position: relative;
|
||||
background-attachment: fixed;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.bg-dark {
|
||||
--bs-dark-rgb: 40, 48, 68;
|
||||
--bs-light-rgb: 120, 161, 187;
|
||||
--bs-body-color: 120, 161, 187;
|
||||
--bs-dark-rgb: 40, 48, 68;
|
||||
--bs-light-rgb: 120, 161, 187;
|
||||
--bs-body-color: 120, 161, 187;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
font-family: VT323;
|
||||
font-size: 36px;
|
||||
color: #FFBC42;
|
||||
font-family: VT323;
|
||||
font-size: 36px;
|
||||
color: #ffbc42;
|
||||
}
|
||||
|
||||
.navbar-text {
|
||||
font-family: VT323;
|
||||
font-size: 36px;
|
||||
color: #78a1bb;
|
||||
font-family: VT323;
|
||||
font-size: 36px;
|
||||
color: #78a1bb;
|
||||
}
|
||||
|
||||
.navbar-logo {
|
||||
max-height: 50px;
|
||||
padding-right: 15px;
|
||||
padding-left:15px;
|
||||
padding-bottom: 6px;
|
||||
max-height: 50px;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
padding-bottom: 6px;
|
||||
}
|
||||
|
||||
.nav-item {
|
||||
padding-top: 7px;
|
||||
padding-top: 7px;
|
||||
}
|
||||
|
||||
.navbar-brand:hover {
|
||||
color: #78a1bb;
|
||||
text-shadow: #B17300 2px 2px 3px;
|
||||
color: #78a1bb;
|
||||
text-shadow: #b17300 2px 2px 3px;
|
||||
}
|
||||
|
||||
.navbar-link {
|
||||
color: #FFBC42;
|
||||
font-family: VT323, monospace;
|
||||
font-size: 36px;
|
||||
padding-left: 50px;
|
||||
padding-right: 50px;
|
||||
text-decoration: none;
|
||||
color: #ffbc42;
|
||||
font-family: VT323, monospace;
|
||||
font-size: 36px;
|
||||
padding-left: 50px;
|
||||
padding-right: 50px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.navbar-link:hover {
|
||||
color: #78a1bb;
|
||||
text-shadow: #B17300 2px 2px 3px;
|
||||
color: #78a1bb;
|
||||
text-shadow: #b17300 2px 2px 3px;
|
||||
}
|
||||
|
||||
.card {
|
||||
background-color: RGBA(22, 26, 37, 70%);
|
||||
border-radius: 30px;
|
||||
box-shadow: #B17300 0px 0px 20px;
|
||||
background-color: RGBA(22, 26, 37, 70%);
|
||||
border-radius: 30px;
|
||||
box-shadow: #b17300 0px 0px 20px;
|
||||
}
|
||||
|
||||
.text-shadow {
|
||||
text-shadow: #ffbc42 1px 1px 2px;
|
||||
text-shadow: #ffbc42 1px 1px 2px;
|
||||
}
|
||||
|
||||
.section-title{
|
||||
padding-top: 5px;
|
||||
padding-bottom: 10px;
|
||||
text-shadow: #B17300 3px 3px 3px;
|
||||
.section-title {
|
||||
padding-top: 5px;
|
||||
padding-bottom: 10px;
|
||||
text-shadow: #b17300 3px 3px 3px;
|
||||
}
|
||||
|
||||
.youtube-container {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
|
||||
}
|
||||
|
||||
.youtube-iframe {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.fa-brands {
|
||||
color: #FFBC42;
|
||||
color: #ffbc42;
|
||||
}
|
||||
|
||||
.fa-brands:hover {
|
||||
color: #78a1bb;
|
||||
text-shadow: #B17300 2px 2px 3px;
|
||||
color: #78a1bb;
|
||||
text-shadow: #b17300 2px 2px 3px;
|
||||
}
|
||||
|
||||
.footer {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#footerText {
|
||||
color: steelblue;
|
||||
color: steelblue;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 700px) {
|
||||
.section-title {
|
||||
font-size: 64px;
|
||||
}
|
||||
.section-title {
|
||||
font-size: 64px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 699px) {
|
||||
.section-title {
|
||||
font-size: 45px;
|
||||
}
|
||||
.section-title {
|
||||
font-size: 45px;
|
||||
}
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: VT323;
|
||||
src: url("https://kforney.github.io/fonts/VT323-Regular.ttf");
|
||||
font-family: VT323;
|
||||
src: url("https://kforney.github.io/fonts/VT323-Regular.ttf");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Oswald;
|
||||
src: url("https://kforney.github.io/fonts/Oswald-Regular.ttf");
|
||||
font-family: Oswald;
|
||||
src: url("https://kforney.github.io/fonts/Oswald-Regular.ttf");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
src: url("https://kforney.github.io/fonts/IBMPlexMono-Regular.ttf");
|
||||
font-family: "IBM Plex Mono", monospace;
|
||||
src: url("https://kforney.github.io/fonts/IBMPlexMono-Regular.ttf");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'IBM Plex Sans', sans-serif;
|
||||
src: url("https://kforney.github.io/fonts/IBMPlexSans-Regular.ttf");
|
||||
font-family: "IBM Plex Sans", sans-serif;
|
||||
src: url("https://kforney.github.io/fonts/IBMPlexSans-Regular.ttf");
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
|
|
@ -314,7 +313,7 @@ iframe[src*=itch]
|
|||
|
||||
.hidden,
|
||||
[hidden] {
|
||||
display: none !important;
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
@ -327,16 +326,16 @@ display: none !important;
|
|||
*/
|
||||
|
||||
.sr-only {
|
||||
border: 0;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
white-space: nowrap;
|
||||
width: 1px;
|
||||
/* 1 */
|
||||
border: 0;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
white-space: nowrap;
|
||||
width: 1px;
|
||||
/* 1 */
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
@ -347,13 +346,13 @@ display: none !important;
|
|||
|
||||
.sr-only.focusable:active,
|
||||
.sr-only.focusable:focus {
|
||||
clip: auto;
|
||||
height: auto;
|
||||
margin: 0;
|
||||
overflow: visible;
|
||||
position: static;
|
||||
white-space: inherit;
|
||||
width: auto;
|
||||
clip: auto;
|
||||
height: auto;
|
||||
margin: 0;
|
||||
overflow: visible;
|
||||
position: static;
|
||||
white-space: inherit;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
@ -361,7 +360,7 @@ display: none !important;
|
|||
*/
|
||||
|
||||
.invisible {
|
||||
visibility: hidden;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
@ -378,12 +377,12 @@ display: none !important;
|
|||
|
||||
.clearfix::before,
|
||||
.clearfix::after {
|
||||
content: " ";
|
||||
display: table;
|
||||
content: " ";
|
||||
display: table;
|
||||
}
|
||||
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
|
|
@ -393,14 +392,14 @@ display: none !important;
|
|||
========================================================================== */
|
||||
|
||||
@media only screen and (min-width: 35em) {
|
||||
/* Style adjustments for viewports that meet the condition */
|
||||
/* Style adjustments for viewports that meet the condition */
|
||||
}
|
||||
|
||||
@media print,
|
||||
(-webkit-min-device-pixel-ratio: 1.25),
|
||||
(min-resolution: 1.25dppx),
|
||||
(min-resolution: 120dpi) {
|
||||
/* Style adjustments for high resolution devices */
|
||||
(-webkit-min-device-pixel-ratio: 1.25),
|
||||
(min-resolution: 1.25dppx),
|
||||
(min-resolution: 120dpi) {
|
||||
/* Style adjustments for high resolution devices */
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
|
|
@ -410,71 +409,70 @@ display: none !important;
|
|||
========================================================================== */
|
||||
|
||||
@media print {
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
background: #fff !important;
|
||||
color: #000 !important;
|
||||
/* Black prints faster */
|
||||
box-shadow: none !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
background: #fff !important;
|
||||
color: #000 !important;
|
||||
/* Black prints faster */
|
||||
box-shadow: none !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
text-decoration: underline;
|
||||
}
|
||||
a,
|
||||
a:visited {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a[href]::after {
|
||||
content: " (" attr(href) ")";
|
||||
}
|
||||
a[href]::after {
|
||||
content: " (" attr(href) ")";
|
||||
}
|
||||
|
||||
abbr[title]::after {
|
||||
content: " (" attr(title) ")";
|
||||
}
|
||||
abbr[title]::after {
|
||||
content: " (" attr(title) ")";
|
||||
}
|
||||
|
||||
/*
|
||||
/*
|
||||
* Don't show links that are fragment identifiers,
|
||||
* or use the `javascript:` pseudo protocol
|
||||
*/
|
||||
a[href^="#"]::after,
|
||||
a[href^="javascript:"]::after {
|
||||
content: "";
|
||||
}
|
||||
a[href^="#"]::after,
|
||||
a[href^="javascript:"]::after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
pre {
|
||||
white-space: pre-wrap !important;
|
||||
}
|
||||
pre {
|
||||
white-space: pre-wrap !important;
|
||||
}
|
||||
|
||||
pre,
|
||||
blockquote {
|
||||
border: 1px solid #999;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
pre,
|
||||
blockquote {
|
||||
border: 1px solid #999;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
/*
|
||||
/*
|
||||
* Printing Tables:
|
||||
* https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
|
||||
*/
|
||||
thead {
|
||||
display: table-header-group;
|
||||
}
|
||||
thead {
|
||||
display: table-header-group;
|
||||
}
|
||||
|
||||
tr,
|
||||
img {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
tr,
|
||||
img {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
p,
|
||||
h2,
|
||||
h3 {
|
||||
orphans: 3;
|
||||
widows: 3;
|
||||
}
|
||||
p,
|
||||
h2,
|
||||
h3 {
|
||||
orphans: 3;
|
||||
widows: 3;
|
||||
}
|
||||
|
||||
h2,
|
||||
h3 {
|
||||
page-break-after: avoid;
|
||||
}
|
||||
h2,
|
||||
h3 {
|
||||
page-break-after: avoid;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
732
index.html
732
index.html
|
|
@ -1,330 +1,470 @@
|
|||
<!doctype html>
|
||||
<!DOCTYPE html>
|
||||
<html lang="en-us">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title></title>
|
||||
<meta name="description" content="" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title></title>
|
||||
<meta name="description" content="">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="manifest" href="site.webmanifest" />
|
||||
<link rel="apple-touch-icon" href="icon.png" />
|
||||
|
||||
<link rel="manifest" href="site.webmanifest">
|
||||
<link rel="apple-touch-icon" href="icon.png">
|
||||
<link rel="stylesheet" href="css/bootstrap.min.css" />
|
||||
<link rel="stylesheet" href="css/normalize.css" />
|
||||
<link rel="stylesheet" href="css/main.css" />
|
||||
|
||||
<link rel="stylesheet" href="css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="css/normalize.css">
|
||||
<link rel="stylesheet" href="css/main.css">
|
||||
<meta name="theme-color" content="#fafafa" />
|
||||
|
||||
<meta name="theme-color" content="#fafafa">
|
||||
<script
|
||||
src="https://kit.fontawesome.com/55072ce5fd.js"
|
||||
crossorigin="anonymous"
|
||||
></script>
|
||||
</head>
|
||||
|
||||
<script src="https://kit.fontawesome.com/55072ce5fd.js" crossorigin="anonymous"></script>
|
||||
<body class="parallax">
|
||||
<nav
|
||||
class="navbar navbar-expand-lg navbar-dark sticky-top bg-dark shadow-lg"
|
||||
>
|
||||
<a class="navbar-brand" href="#">
|
||||
<img
|
||||
src="img/branding/LunarPenguin_newPalette_transparency_brightDiamond.png"
|
||||
alt="Logo"
|
||||
class="navbar-logo"
|
||||
/>
|
||||
Kaj Forney
|
||||
</a>
|
||||
<button
|
||||
class="navbar-toggler"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#navbarSupportedContent"
|
||||
aria-controls="navbarSupportedContent"
|
||||
aria-expanded="false"
|
||||
aria-label="Toggle navigation"
|
||||
>
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
</head>
|
||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||
<ul class="navbar-nav mr-auto">
|
||||
<li class="nav-item">
|
||||
<a class="navbar-link" href="#games">GAMES</a>
|
||||
</li>
|
||||
<span class="navbar-text d-none d-sm-block">|</span>
|
||||
<li class="nav-item">
|
||||
<a class="navbar-link" href="#art">ART</a>
|
||||
</li>
|
||||
<span class="navbar-text d-none d-sm-block">|</span>
|
||||
<li class="nav-item">
|
||||
<a class="navbar-link" href="#social">SOCIAL</a>
|
||||
</li>
|
||||
<span class="navbar-text d-none d-sm-block">|</span>
|
||||
<li class="nav-item">
|
||||
<a class="navbar-link" href="files/resume.pdf" target="_blank"
|
||||
>RESUME</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<body class="parallax">
|
||||
<div class="mt-5"></div>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-dark sticky-top bg-dark shadow-lg">
|
||||
<a class="navbar-brand" href="#">
|
||||
<img src="img/branding/LunarPenguin_newPalette_transparency_brightDiamond.png" alt="Logo" class="navbar-logo">
|
||||
Kaj Forney
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="container-lg card">
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<h1 class="section-title">Kaj Forney</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<p>
|
||||
Greetings! I am a human who enjoys pixel art, programming, and
|
||||
penguins.
|
||||
</p>
|
||||
<p>Sometimes, I also make games.</p>
|
||||
<p>
|
||||
This site displays a few of the things I've made or helped to
|
||||
make.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||
<ul class="navbar-nav mr-auto">
|
||||
<li class="nav-item">
|
||||
<a class="navbar-link" href="#games">GAMES</a>
|
||||
</li>
|
||||
<span class="navbar-text d-none d-sm-block">|</span>
|
||||
<li class="nav-item">
|
||||
<a class="navbar-link" href="#art">ART</a>
|
||||
</li>
|
||||
<span class="navbar-text d-none d-sm-block">|</span>
|
||||
<li class="nav-item">
|
||||
<a class="navbar-link" href="#social">SOCIAL</a>
|
||||
</li>
|
||||
<span class="navbar-text d-none d-sm-block">|</span>
|
||||
<li class="nav-item">
|
||||
<a class="navbar-link" href="files/resume.pdf">RESUME</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<div id="games"></div>
|
||||
|
||||
<div class="mt-5"></div>
|
||||
<div class="mt-5"></div>
|
||||
|
||||
<div class="container-lg card">
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<h1 class="section-title">Kaj Forney</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<p>Greetings! I am a human who enjoys pixel art, programming, and penguins.</p>
|
||||
<p>Sometimes, I also make games.</p>
|
||||
<p>This site displays a few of the things I've made or helped to make.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
|
||||
<div id="games"></div>
|
||||
<div class="container-lg">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<h1 class="section-title">GAMES</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-5"></div>
|
||||
<div class="container-md card">
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col-sm-4">
|
||||
<h2>The Climb</h2>
|
||||
<hr />
|
||||
<p>[2021]</p>
|
||||
</div>
|
||||
<div class="col-sm-8">
|
||||
<p>
|
||||
The Climb is a small game I created in Unity, originally as part
|
||||
of my work in my GIMM 100 course. In the game, you control a
|
||||
robot who must escape by climbing on tetrominoes as they fall
|
||||
from above.
|
||||
</p>
|
||||
<p>
|
||||
Later, I updated the game to add additional levels, as well as
|
||||
improved lighting using Unity's 2D Lighting system and the
|
||||
Universal Render Pipeline.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr/>
|
||||
<div class="mt-4"></div>
|
||||
|
||||
<div class="container-lg">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<h1 class="section-title">GAMES</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="youtube-container">
|
||||
<iframe
|
||||
class="youtube-iframe"
|
||||
src="https://www.youtube.com/embed/N5unzGlC9ME"
|
||||
title="YouTube video player"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
||||
allowfullscreen
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container-md card">
|
||||
<div class="card-body">
|
||||
<div class="row mt-3">
|
||||
<iframe
|
||||
src="https://itch.io/embed/1308115?border_width=0&bg_color=12161f&fg_color=78a1bb&link_color=ffbc42&border_color=283044"
|
||||
><a href="https://lunarpenguin.itch.io/the-climb"
|
||||
>The Climb by Lunar_Penguin</a
|
||||
></iframe
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-sm-4">
|
||||
<h2>The Climb</h2>
|
||||
<hr/>
|
||||
<p>[2021]</p>
|
||||
</div>
|
||||
<div class="col-sm-8">
|
||||
<p>The Climb is a small game I created in Unity, originally as part of my work in my GIMM 100 course. In the game, you control a robot who must escape by climbing on tetrominoes as they fall from above.</p>
|
||||
<p>Later, I updated the game to add additional levels, as well as improved lighting using Unity's 2D Lighting system and the Universal Render Pipeline.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container-md card mt-5">
|
||||
<div class="card-body">
|
||||
<div class="row mt-5">
|
||||
<div class="col-sm-4">
|
||||
<h2>Megashigi</h2>
|
||||
<hr />
|
||||
<p>[2020]</p>
|
||||
</div>
|
||||
<div class="col-sm-8">
|
||||
<p>
|
||||
Megashigi is a game that I helped create using the Godot Engine,
|
||||
along with several friends, as a birthday gift. My portion of
|
||||
the project included the implementation of the game's playable,
|
||||
interactive credits sequence, as well as general level design,
|
||||
and subtitles for the game's boss rap sequence.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-4"></div>
|
||||
<div class="mt-4"></div>
|
||||
|
||||
<div class="row">
|
||||
<div class="youtube-container">
|
||||
<iframe class="youtube-iframe" src="https://www.youtube.com/embed/N5unzGlC9ME" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mt-3">
|
||||
<iframe
|
||||
src="https://itch.io/embed/630032?border_width=0&bg_color=12161f&fg_color=78a1bb&link_color=ffbc42&border_color=283044"
|
||||
><a href="https://lopar.itch.io/megashigi"
|
||||
>The Climb by Lunar_Penguin</a
|
||||
></iframe
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mt-3">
|
||||
<iframe src="https://itch.io/embed/1308115?border_width=0&bg_color=12161f&fg_color=78a1bb&link_color=ffbc42&border_color=283044"><a href="https://lunarpenguin.itch.io/the-climb">The Climb by Lunar_Penguin</a></iframe>
|
||||
</div>
|
||||
<div id="art"></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-5"></div>
|
||||
|
||||
<div class="container-md card mt-5">
|
||||
<div class="card-body">
|
||||
<div class="row mt-5">
|
||||
<div class="col-sm-4">
|
||||
<h2>Megashigi</h2>
|
||||
<hr/>
|
||||
<p>[2020]</p>
|
||||
</div>
|
||||
<div class="col-sm-8">
|
||||
<p>Megashigi is a game that I helped create using the Godot Engine, along with several friends, as a birthday gift. My portion of the project included the implementation of the game's playable, interactive credits sequence, as well as general level design, and subtitles for the game's boss rap sequence.</p>
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
|
||||
<div class="mt-4"></div>
|
||||
<div class="container-lg">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<h1 class="section-title">ART</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mt-3">
|
||||
<iframe src="https://itch.io/embed/630032?border_width=0&bg_color=12161f&fg_color=78a1bb&link_color=ffbc42&border_color=283044"><a href="https://lopar.itch.io/megashigi">The Climb by Lunar_Penguin</a></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div id="art-carousel" class="carousel slide" data-bs-ride="false">
|
||||
<div class="carousel-indicators">
|
||||
<button
|
||||
type="button"
|
||||
data-bs-target="#carouselExampleCaptions"
|
||||
data-bs-slide-to="0"
|
||||
class="active"
|
||||
aria-current="true"
|
||||
aria-label="Slide 1"
|
||||
></button>
|
||||
<button
|
||||
type="button"
|
||||
data-bs-target="#carouselExampleCaptions"
|
||||
data-bs-slide-to="1"
|
||||
aria-label="Slide 2"
|
||||
></button>
|
||||
<button
|
||||
type="button"
|
||||
data-bs-target="#carouselExampleCaptions"
|
||||
data-bs-slide-to="2"
|
||||
aria-label="Slide 3"
|
||||
></button>
|
||||
<button
|
||||
type="button"
|
||||
data-bs-target="#carouselExampleCaptions"
|
||||
data-bs-slide-to="3"
|
||||
aria-label="Slide 4"
|
||||
></button>
|
||||
<button
|
||||
type="button"
|
||||
data-bs-target="#carouselExampleCaptions"
|
||||
data-bs-slide-to="4"
|
||||
aria-label="Slide 5"
|
||||
></button>
|
||||
<button
|
||||
type="button"
|
||||
data-bs-target="#carouselExampleCaptions"
|
||||
data-bs-slide-to="5"
|
||||
aria-label="Slide 6"
|
||||
></button>
|
||||
<button
|
||||
type="button"
|
||||
data-bs-target="#carouselExampleCaptions"
|
||||
data-bs-slide-to="6"
|
||||
aria-label="Slide 7"
|
||||
></button>
|
||||
</div>
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<img
|
||||
src="img/art/rakuenDoor.png"
|
||||
class="d-block w-100"
|
||||
alt="..."
|
||||
/>
|
||||
<div class="carousel-caption d-none d-md-block">
|
||||
<h5 class="text-shadow">RAKUEN ART [2022]</h5>
|
||||
<p class="text-shadow">
|
||||
A scene from the game <i>Rakuen</i>, recreated in Blender.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img
|
||||
src="img/art/airship1.png"
|
||||
class="d-block w-100"
|
||||
alt="..."
|
||||
/>
|
||||
<div class="carousel-caption d-none d-md-block">
|
||||
<h5 class="text-shadow">AIRSHIP MODEL [2022]</h5>
|
||||
<p class="text-shadow">Created in Blender</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img
|
||||
src="img/art/airship2.png"
|
||||
class="d-block w-100"
|
||||
alt="..."
|
||||
/>
|
||||
<div class="carousel-caption d-none d-md-block">
|
||||
<h5 class="text-shadow">AIRSHIP MODEL [2022]</h5>
|
||||
<p class="text-shadow">Created in Blender.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="img/art/cat.png" class="d-block w-100" alt="..." />
|
||||
<div class="carousel-caption d-none d-md-block">
|
||||
<h5 class="text-shadow">DIGITAL PORTRAIT [2021]</h5>
|
||||
<p class="text-shadow">
|
||||
A digital painting of my cat, Okapi.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img
|
||||
src="img/art/portrait_dad.png"
|
||||
class="d-block w-100"
|
||||
alt="..."
|
||||
/>
|
||||
<div class="carousel-caption d-none d-md-block">
|
||||
<h5 class="text-shadow"></h5>
|
||||
<p class="text-shadow"></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="img/art/dadKaj.png" class="d-block w-100" alt="..." />
|
||||
<div class="carousel-caption d-none d-md-block"></div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img
|
||||
src="img/art/symbolSet_fullSet.png"
|
||||
class="d-block w-100"
|
||||
alt="..."
|
||||
/>
|
||||
<div class="carousel-caption d-none d-md-block">
|
||||
<h5 class="text-shadow"></h5>
|
||||
<p class="text-shadow"></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
class="carousel-control-prev"
|
||||
type="button"
|
||||
data-bs-target="#art-carousel"
|
||||
data-bs-slide="prev"
|
||||
>
|
||||
<span
|
||||
class="carousel-control-prev-icon"
|
||||
aria-hidden="true"
|
||||
></span>
|
||||
<span class="visually-hidden">Previous</span>
|
||||
</button>
|
||||
<button
|
||||
class="carousel-control-next"
|
||||
type="button"
|
||||
data-bs-target="#art-carousel"
|
||||
data-bs-slide="next"
|
||||
>
|
||||
<span
|
||||
class="carousel-control-next-icon"
|
||||
aria-hidden="true"
|
||||
></span>
|
||||
<span class="visually-hidden">Next</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="art"></div>
|
||||
<div class="row mt-5">
|
||||
<div class="col-sm">
|
||||
<div class="youtube-container">
|
||||
<iframe
|
||||
class="youtube-iframe"
|
||||
src="https://www.youtube.com/embed/LaloFVeUvOk"
|
||||
title="YouTube video player"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
||||
allowfullscreen
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
<div class="youtube-container">
|
||||
<iframe
|
||||
class="youtube-iframe"
|
||||
src="https://www.youtube.com/embed/ahQPl9FOX7A"
|
||||
title="YouTube video player"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
||||
allowfullscreen
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-5"></div>
|
||||
<div id="social"></div>
|
||||
|
||||
<hr/>
|
||||
<hr class="mt-5" />
|
||||
|
||||
<div class="container-lg">
|
||||
<div class="container-lg mw-25 w-50">
|
||||
<div class="row">
|
||||
<h1 class="section-title">OTHER PLACES I EXIST</h1>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="https://youtube.com/@lunar_penguin" target="_blank">
|
||||
<h2 title="YouTube">
|
||||
<i class="fa-brands fa-youtube"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<a href="https://twitch.tv/lunar_penguin" target="_blank">
|
||||
<h2 title="Twitch.tv">
|
||||
<i class="fa-brands fa-twitch"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<a
|
||||
rel="me"
|
||||
href="https://mastodon.gamedev.place/@lunar_penguin"
|
||||
target="_blank"
|
||||
>
|
||||
<h2 title="Mastodon">
|
||||
<i class="fa-brands fa-mastodon"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<a href="https://www.linkedin.com/in/kajforney/" target="_blank">
|
||||
<h2 title="LinkedIn">
|
||||
<i class="fa-brands fa-linkedin"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="https://lunarpenguin.itch.io" target="_blank">
|
||||
<h2 title="Itch.io">
|
||||
<i class="fa-brands fa-itch-io"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<a href="https://github.com/kforney" target="_blank">
|
||||
<h2 title="Github">
|
||||
<i class="fa-brands fa-github"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<a href="https://artstation.com/lunar_penguin" target="_blank">
|
||||
<h2 title="ArtStation">
|
||||
<i class="fa-brands fa-artstation"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<a href="https://lunar--penguin.tumblr.com" target="_blank">
|
||||
<h2 title="Tumblr">
|
||||
<i class="fa-brands fa-tumblr"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row"></div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<h1 class="section-title">ART</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-5"></div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div id="art-carousel" class="carousel slide" data-bs-ride="false">
|
||||
<div class="carousel-indicators">
|
||||
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
|
||||
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1" aria-label="Slide 2"></button>
|
||||
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="2" aria-label="Slide 3"></button>
|
||||
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="3" aria-label="Slide 4"></button>
|
||||
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="4" aria-label="Slide 5"></button>
|
||||
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="5" aria-label="Slide 6"></button>
|
||||
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="6" aria-label="Slide 7"></button>
|
||||
</div>
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<img src="img/art/rakuenDoor.png" class="d-block w-100" alt="...">
|
||||
<div class="carousel-caption d-none d-md-block">
|
||||
<h5 class="text-shadow">RAKUEN ART [2022]</h5>
|
||||
<p class="text-shadow">A scene from the game <i>Rakuen</i>, recreated in Blender.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="img/art/airship1.png" class="d-block w-100" alt="...">
|
||||
<div class="carousel-caption d-none d-md-block">
|
||||
<h5 class="text-shadow">AIRSHIP MODEL [2022]</h5>
|
||||
<p class="text-shadow">Created in Blender</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="img/art/airship2.png" class="d-block w-100" alt="...">
|
||||
<div class="carousel-caption d-none d-md-block">
|
||||
<h5 class="text-shadow">AIRSHIP MODEL [2022]</h5>
|
||||
<p class="text-shadow">Created in Blender.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="img/art/cat.png" class="d-block w-100" alt="...">
|
||||
<div class="carousel-caption d-none d-md-block">
|
||||
<h5 class="text-shadow">DIGITAL PORTRAIT [2021]</h5>
|
||||
<p class="text-shadow">A digital painting of my cat, Okapi.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="img/art/portrait_dad.png" class="d-block w-100" alt="...">
|
||||
<div class="carousel-caption d-none d-md-block">
|
||||
<h5 class="text-shadow"></h5>
|
||||
<p class="text-shadow"></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="img/art/dadKaj.png" class="d-block w-100" alt="...">
|
||||
<div class="carousel-caption d-none d-md-block"></div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="img/art/symbolSet_fullSet.png" class="d-block w-100" alt="...">
|
||||
<div class="carousel-caption d-none d-md-block">
|
||||
<h5 class="text-shadow"></h5>
|
||||
<p class="text-shadow"></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<button class="carousel-control-prev" type="button" data-bs-target="#art-carousel" data-bs-slide="prev">
|
||||
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
|
||||
<span class="visually-hidden">Previous</span>
|
||||
</button>
|
||||
<button class="carousel-control-next" type="button" data-bs-target="#art-carousel" data-bs-slide="next">
|
||||
<span class="carousel-control-next-icon" aria-hidden="true"></span>
|
||||
<span class="visually-hidden">Next</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<footer class="footer bg-dark">
|
||||
<div class="container">
|
||||
<span id="footerText"></span>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<div class="row mt-5">
|
||||
<div class="col-sm">
|
||||
<div class="youtube-container">
|
||||
<iframe class="youtube-iframe" src="https://www.youtube.com/embed/LaloFVeUvOk" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
<div class="youtube-container">
|
||||
<iframe class="youtube-iframe" src="https://www.youtube.com/embed/ahQPl9FOX7A" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="social"></div>
|
||||
|
||||
<hr class="mt-5">
|
||||
|
||||
<div class="container-lg mw-25 w-50">
|
||||
<div class="row">
|
||||
<h1 class="section-title">OTHER PLACES I EXIST</h1>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="https://youtube.com/@lunar_penguin" target="_blank">
|
||||
<h2 title="YouTube">
|
||||
<i class="fa-brands fa-youtube"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<a href="https://twitch.tv/lunar_penguin" target="_blank">
|
||||
<h2 title="Twitch.tv">
|
||||
<i class="fa-brands fa-twitch"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<a rel="me" href="https://mastodon.gamedev.place/@lunar_penguin" target="_blank">
|
||||
<h2 title="Mastodon">
|
||||
<i class="fa-brands fa-mastodon"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<a href="https://www.linkedin.com/in/kajforney/" target="_blank">
|
||||
<h2 title="LinkedIn">
|
||||
<i class="fa-brands fa-linkedin"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="https://lunarpenguin.itch.io" target="_blank">
|
||||
<h2 title="Itch.io">
|
||||
<i class="fa-brands fa-itch-io"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<a href="https://github.com/kforney" target="_blank">
|
||||
<h2 title="Github">
|
||||
<i class="fa-brands fa-github"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<a href="https://artstation.com/lunar_penguin" target="_blank">
|
||||
<h2 title="ArtStation">
|
||||
<i class="fa-brands fa-artstation"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col">
|
||||
<a href="https://lunar--penguin.tumblr.com" target="_blank">
|
||||
<h2 title="Tumblr">
|
||||
<i class="fa-brands fa-tumblr"></i>
|
||||
</h2>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-5"></div>
|
||||
|
||||
<footer class="footer bg-dark">
|
||||
<div class="container">
|
||||
<span id="footerText"></span>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="js/vendor/modernizr-3.11.2.min.js"></script>
|
||||
<script src="js/plugins.js"></script>
|
||||
<script src="js/bootstrap.min.js"></script>
|
||||
|
||||
<script>
|
||||
document.getElementById("footerText").innerHTML = "Copyright © Kaj Forney 2018-" + new Date(Date.now()).getFullYear();
|
||||
</script>
|
||||
|
||||
</body>
|
||||
<script src="js/vendor/modernizr-3.11.2.min.js"></script>
|
||||
<script src="js/plugins.js"></script>
|
||||
<script src="js/bootstrap.min.js"></script>
|
||||
|
||||
<script>
|
||||
document.getElementById("footerText").innerHTML =
|
||||
"Copyright © Kaj Forney 2018-" + new Date(Date.now()).getFullYear();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Reference in a new issue