Skip to content

Commit

Permalink
9.20.23 v3
Browse files Browse the repository at this point in the history
  • Loading branch information
@findthelorax
findthelorax committed Sep 20, 2023
1 parent c95c12f commit 2ab1f31
Show file tree
Hide file tree
Showing 2 changed files with 54 additions and 48 deletions.
63 changes: 21 additions & 42 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@
<h3>Hello, It's Me</h3>
<h3>Brett Ferrante</h3>
<h3>And I'm a <span>Web Developer</span></h3>
<p>I'm a Web Developer who loves diving headfirst into new problems. I love solving puzzles, cooking, snowboarding, rock climbing and hanging out with my son.</p>
<p>I love diving headfirst into new problems. I enjoy solving puzzles, cooking, snowboarding, rock climbing and hanging out with my son.</p>
<div class="home_social">
<ul class="home_social_icons">
<li><a href="" class="home_social_icon"> <i class="fa-solid fa-envelope"></i></a></li>
Expand All @@ -55,68 +55,46 @@ <h3>And I'm a <span>Web Developer</span></h3>
</div>
</section>

<!-- * OLD Bio Container -->
<!-- <div class="bio_container">
<div class="bio_left">
<div class="bio_intro">
<img src="./profile_pic.png" alt="Handsome Redhead" id="bio_pic">
<h2>Brett Ferrante</h2>
<div class="underline"></div>
<h3>Web Developer</h3>
</div>
<div class="social_div">
<ul class="social_icons">
<li><a href="" class="social_icon"> <i class="fa-solid fa-envelope"></i></a></li>
<li><a href="" class="social_icon"> <i class="fa-brands fa-facebook-f"></i></a></li>
<!-- <li><a href="" class="social_icon"> <i class="fa-brands fa-square-twitter"></i></a></li>
<li><a href="" class="social_icon"> <i class="fa-brands fa-youtube"></i></a></li>
<li><a href="" class="social_icon"> <i class="fa-brands fa-linkedin"></i></a></li>
<li><a href="" class="social_icon"> <i class="fa-brands fa-github"></i></a></li>
</ul>
</div>
</div>
<div class="bio_right">
</div>
</div> -->


<!-- My Works -->
<div id="works">
<section class="container">
<h1> Skills </h1>
<h1 class="skills_header"> Skills </h1>
<div class="skills_box">
<div class="box_1">
<h3 class="skills_header"> Father </h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ab ea voluptatibus reprehenderit error debitis suscipit molestias, dicta, quidem explicabo accusantium maiores magni unde animi? Saepe eveniet dicta provident dolore ab?</p>
<h3 class="skills_header"> Father </h3><br>
<p>I just had a son in April 2023 and it's been amazing. I can't wait for him to grow up so I can teach him everything I know</p>
</div>
<div class="box_2">
<h3 class="skills_header"> Development Languages </h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quas ratione, dolore ad consequuntur ipsam sunt labore, eligendi iusto ipsum exercitationem asperiores error accusantium temporibus optio magni voluptates quam quidem odit.</p>
<h3 class="skills_header"> Development Languages </h3><br>
<p>Proficient in: HTML, CSS.
<br>
<br>Learning: Javascript, C#, React, Node.js.
</p>
</div>
<div class="box_3">
<h3 class="skills_header"> Mountaineering </h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ea saepe quae praesentium beatae autem eos error ad veritatis ab fuga, perferendis officia nobis voluptatem perspiciatis vitae ipsa architecto maxime commodi.</p>
<h3 class="skills_header"> Mountaineering </h3><br>
<p>I spent two months in Haines, Alaska working on my Mountaineering Guide Certification.
I learned glacial traversal, camp dynamics and structure, rescue scenarios and terrain management. It was an amazing experience.
</p>
</div>
</div>
</section>

<section class="container">
<div class="skills_box">
<div class="box_4">
<h3 class="skills_header"> Yo-Yoing </h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ab ea voluptatibus reprehenderit error debitis suscipit molestias, dicta, quidem explicabo accusantium maiores magni unde animi? Saepe eveniet dicta provident dolore ab?</p>
<h3 class="skills_header"> Yo-Yoing </h3><br>
<p>I grew up playing with skill toys, juggling, poi, devil sticks, diablo and yo-yoing. I went on to compete in the World Yo-Yo Competition placing 13th in the World and 13th in the Nation in the same year and holding a AYYA World Record for Iron Whips.</p>
</div>
<div class="box_5">
<h3 class="skills_header"> Wilderness EMT </h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quas ratione, dolore ad consequuntur ipsam sunt labore, eligendi iusto ipsum exercitationem asperiores error accusantium temporibus optio magni voluptates quam quidem odit.</p>
<h3 class="skills_header"> Wilderness EMT </h3><br>
<p>In 2006 I got my WFR certification then went on to work Ski Patrol at Killington Resort. I now have CPR, Wilderness EMT, Outdoor Emergency Care, ATF Certification for explosive handling among others.
</p>
</div>
<div class="box_6">
<h3 class="skills_header"> Chef </h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ea saepe quae praesentium beatae autem eos error ad veritatis ab fuga, perferendis officia nobis voluptatem perspiciatis vitae ipsa architecto maxime commodi.</p>
<h3 class="skills_header"> Chef </h3><br>
<p>I've been working in kitchens for 20+ years. I run a kitchen at a summer camp feeding 100 children 9-14 and 50 staff while catering to all dietary needs: Vegetarian, Gluten, Free, Dairy Free, Keto, Egg Free, Sesame Free and any others.</p>
</div>
</div>
</section>
Expand Down Expand Up @@ -170,5 +148,6 @@ <h4 class="social_header">Follow Me</h4>
</div>
</footer>

<a href="#" class="top"><i class="fa-solid fa-arrow-up"></i></a>
</body>
</html>
39 changes: 33 additions & 6 deletions styles.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -86,20 +86,30 @@ body {

/* Homepage Design Styling */
section {
min-height: 100vh;
/* min-height: 100vh; */
padding: 5rem 8% 2rem;
}
#home {
display: flex;
justify-content: center;
align-items: center;
align-items: top;
padding: 5rem 5rem;
}
.home_content h3 {
font-size: 3rem;
font-weight: 700;
}
.home_content h3:nth-of-type(2) {
margin-bottom: 1.2rem;
margin: 1.2rem 0;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .25rem;
color: #131313;
text-shadow:
0 0 7px #fff,
0 0 10px #ff00aa,
0 0 21px #ff00aa,
0 0 42px #0fa;
}
.home_content h3:nth-of-type(3) {
margin-bottom: 1.2rem;
Expand Down Expand Up @@ -218,7 +228,7 @@ section {
.skills_header {
text-align: center;
text-transform: uppercase;
padding: 0 0 10px 0;
padding: 0 0 30px 0;
}
.skills_box {
display: flex;
Expand All @@ -231,14 +241,14 @@ section {
margin: 10px 10px;
padding: 30px 20px;
text-align: center;
border: 2px solid rgba(255, 0, 179, 0.1);
border: 2px solid pink;
border-radius: 24px;
}
.skills_box p {
margin: 0 auto;
padding: 0 20px;
width: 300px;
font-weight: 600;
font-weight: 500;
text-align: center;
}

Expand Down Expand Up @@ -435,4 +445,21 @@ textarea {
position: absolute;
width: 100%;
height: 2.5rem;
}

/* Top Button */
/* ! Adjust button spacing from bottom of page */
.top {
place-self:end;
text-decoration: none;
padding: 10px;
color: #fff;
background-color: #2b2a29;
box-shadow: 0 5px 10px #ff00aa;
border-radius: 100px;
font-size: 20px;
position: sticky;
bottom: 20px;
left: 30px;
margin-top: 150vh;
}

0 comments on commit 2ab1f31

Please sign in to comment.