evan/ewpratten.com
1
Fork 0
Code Actions

looks cool

Browse Source
This commit is contained in:
Evan Pratten 2020-01-22 15:06:32 -05:00
parent c2d90288ed
commit 61ee4d8de3
No known key found for this signature in database
GPG Key ID: 93AC7B3D071356D3
2 changed files with 123 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
_layouts/home.html
View File

@ -13,40 +13,68 @@
<div style="height:20vh;"></div>
<div class="nudge-right">
<h1 id="name-landing">Evan Pratten</h1>
<h1 id="name-landing">{{site.title}}</h1>
<h3 id="me-landing">Programmer</h3>
</div>
</div>
<div class="landing-more container">
<h5><a href="/blog">Blog</a> <a href="/projects">Projects</a> <a href="#main-start">More</a></h5>
<h5><a href="/blog">Blog</a> <a href="/projects">Projects</a> <a href="#whoami">More</a></h5>
</div>
<!-- Header -->
<div class="header container" style="height:30vh" id="main-start">
<div class="home-header">
</div>
</div>
<div class="reactive-bg">
<div class="home container">
<div class="profile">
<!-- <div class="profile">
<img src="{{site.baseurl}}/assets/images/human-profile.jpg">
</div>
</div> -->
<div class="info">
<h1>{{site.title}}</h1>
<hr>
<div class="tagline">
<br><br><br>
<h2>Who am I?</h2>
<p>{{site.about}}</p>
<div id="mobile-title">
<div style="height:25vh;"></div>
<h1 class="blocky">{{site.title}}</h1>
<h3 id="me-landing" style="text-align:center">Programmer</h3>
</div>
<br><br>
<h2>Languages</h2>
<!-- <hr> -->
<div>
<!-- class="tagline"> -->
<br><br><br><br><br>
<!-- <div style="height:20vh;"></div> -->
<div id="whoami">
<h2 class="blocky">WHOAMI</h2>
<p>{{site.about}}</p>
</div>
<br><br><br><br><br>
<!-- <div style="height:20vh;"></div> -->
<div id="languages">
<h2 class="blocky">Programming</h2>
<p>I have been programming since 2013, and started learning with Python3.
Since then, I have picked up many other languages, and am currently mainly using Python,
Java, and C.
I am also working on learning a few new languages, including Ruby at the moment.</p>
</div>
<br><br><br><br><br>
<!-- <div style="height:20vh;"></div> -->
<div id="whoami">
<h2 class="blocky">Projects</h2>
<p>In my <a href="/projects">Projects page</a>, I have a list of projects I have worked on,
ranging from unfinished
ideas, to codebases that took months to develop. Feel free to check them out, and let me
know what you think!</p>
</div>
<!-- <h2>Languages</h2>
<div class="progress" style="height:30px">
<div class="progress-bar" role="progressbar" style="width: 40%" aria-valuenow="15"
@ -63,10 +91,10 @@
<p>I have been programming since 2013, and started learning with Python3.<br>
Since then, I have picked up many other languages, and am currently mainly using Python,
Java, and C.<br>
I am working on learning a few new languages, including Ruby at the moment.</p>
I am working on learning a few new languages, including Ruby at the moment.</p> -->
<br><br>
<!-- <br><br>
<h2>Projects</h2>
<p>
@ -75,7 +103,7 @@
<a href="{{site.baseurl}}/projects">
<button type="button" class="btn btn-success">View Page</button>
</a>
</a> -->
</div>
</div>

79
assets/css/main.css
View File

@ -44,6 +44,17 @@ html {
animation: fadein 2s;
}
.blocky {
background-color: #fff;
color: #343a40;
font-weight: bolder;
padding-left: 5;
padding-right: 5;
width: max-content;
font-family: 'IBM Plex Sans', sans-serif;
font-size: xx-large;
}
#me-landing {
color: #fff;
font-family: 'IBM Plex Sans', sans-serif;
@ -78,7 +89,7 @@ html {
.landing-more a {
height: max-content;
background-color: #fff;
background-color: rgba(255, 255, 255, 0.801);
padding-left: 5;
padding-right: 5;
font-weight: normal;
@ -108,6 +119,59 @@ html {
}
}
#mobile-title {
display: none;
}
@media only screen and (max-width: 993px) {
#mobile-title {
display: block;
font-family: 'IBM Plex Sans', sans-serif;
font-size: xxx-large;
margin: auto;
}
#mobile-title .blocky {
margin: auto;
font-size: xxx-large;
-webkit-animation: fadein 0.5s;
/* Safari, Chrome and Opera > 12.1 */
-moz-animation: fadein 0.5s;
/* Firefox < 16 */
-ms-animation: fadein 0.5s;
/* Internet Explorer */
-o-animation: fadein 0.5s;
/* Opera < 12.1 */
animation: fadein 0.5s;
}
}
#whoami {
color: #fff;
font-weight: bold;
text-align: justify;
max-width: 680px;
margin: auto;
}
#languages h2 {
margin: auto;
}
#whoami h2 {
margin: auto;
}
#languages {
color: #fff;
font-weight: bold;
max-width: 680px;
/* float: right; */
margin: auto;
right: 0;
text-align: justify;
align-items: right;
}
.site-info {
color: rgb(199, 195, 195);
background-color: #FFF;
@ -250,9 +314,9 @@ a h5 {
.home.container {
padding: 20px;
font-family: 'Noto Sans TC', sans-serif;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
background-color: #fff;
/* font-family: 'Noto Sans TC', sans-serif; */
/* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); */
/* background-color: #fff; */
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
@ -429,4 +493,11 @@ pre {
to {
opacity: 1;
}
}
:target::before {
content: '';
display: block;
height: 40px;
margin-top: -40px;
}