Skip to content

Commit

Permalink
Committing all new files to be added from personal folder
Browse files Browse the repository at this point in the history
  • Loading branch information
@Olivia9444
Olivia9444 committed Aug 8, 2024
0 parents commit a8fc687
Show file tree
Hide file tree
Showing 8 changed files with 752 additions and 0 deletions.
Empty file added .DS_Store
Empty file.
Empty file added .gitignore
Empty file.
Empty file added Thumbs.db
Empty file.
Binary file added envelope.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
84 changes: 84 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,84 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<title>Projects | Jubilee Austen</title>
<link rel="stylesheet" href="../css/normalize.css">
<link rel="stylesheet" href="../css/main.css">
<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=Lora:wght@400;600;700&family=Source+Sans+Pro:wght@400;600;700&display=swap"
rel="stylesheet">
</head>

<body>
<header class="extra-hero">
<div class="content-wrapper">
<h1>Jubilee Austen</h1>
<nav>
<ul>
<li><a href="../index.html">home</a></li>
<li><a href="../index.html#about">about</a></li>
<li><a href="../index.html#skills">skills</a></li>
<li><a href="../index.html#contact">contact</a></li>
<li><a href="#">projects</a></li>
</ul>
</nav>
</div>
</header>
<main>
<section id="projects">
<div class="content-wrapper">
<h2>Projects</h2>
<div class="project-piece">
<a href="https://skillcrush.github.io/206-rogue_pickings/" target="_blank"><img
src="../img/rogue-pickings.png" alt="Rogue Pickings
Site"></a>
<h3>Rogue Pickings</h3>
<p>A simple home page perfect for a pop-up restaurant or food truck. Originally a static website, I
converted it into a responsive design using Flexbox.</p>
</div>
<div class="project-piece">
<a href="https://skillcrush.github.io/206-unplugged_retreat/" target="_blank"><img
src="../img/unplugged.png" alt="Unplugged Site"></a>
<h3>Unplugged</h3>
<p>A multi-page responsive website coded with Flexbox. This versatile design has sections, including
a cards design pattern, that can be repurposed for different sites.</p>
</div>
<div class="project-piece">
<a href="https://skillcrush.github.io/guess-the-word/" target="_blank"><img
src="../img/guess-the-word-game.png" alt="Guess the Word Game"></a>
<h3>Guess the Word Game</h3>
<p>Players guess the word by entering one letter at a time. If the player guesses all the letters
correctly before they use up their allotted guesses, they win!</p>
</div>
</div>
</section>
</main>
<footer id="contact">
<div class="content-wrapper">
<div class="contact-image">
<img src="../img/jess-bailey-q10VITrVYUM-unsplash.png"
alt="work desk with a keyboard, pen, glasses, and notebook" id="contact-img">
</div>
<div class="contact-info">
<h2>Like What You See?</h2>
<h3 id="email-header">Let's meet for a cup of coffee.</h3>
<a href="mailto:[email protected]"><img src="../img/envelope.png" alt="envelope icon"
id="envelope">[email protected]</a>
<h3 id="socialmedia-header">Or, follow me on social media:</h3>
<ul>
<li><a href="https://twitter.com/home" target="_blank"><img src="../img/twitter.png" alt="Twitter icon"></a></li>
<li><a href="https://www.facebook.com" target="_blank"><img src="../img/facebook.png" alt="Facebook icon"></a></li>
<li><a href="https://www.instagram.com" target="_blank"><img src="../img/instagram.png" alt="Instagram icon"></a></li>
<li><a href="https://www.linkedin.com" target="_blank"><img src="../img/linkedin.png" alt="LinkedIn icon"></a></li>
<li><a href="https://github.com" target="_blank"><img src="../img/github.png" alt="GitHub icon"></a></li>
</ul>
</div>
</div>
</footer>
</body>

</html>
93 changes: 93 additions & 0 deletions index.html2.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<title>Jubilee Austen | Portfolio</title>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
<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=Lora:wght@400;600;700&family=Source+Sans+Pro:wght@400;600;700&display=swap"
rel="stylesheet">
</head>

<body>
<header class="homepage-hero">
<div class="content-wrapper">
<h1>Jubilee Austen</h1>
<nav>
<ul>
<li><a href="#">home</a></li>
<li><a href="#about">about</a></li>
<li><a href="#skills">skills</a></li>
<li><a href="#contact">contact</a></li>
<li><a href="projects/index.html">projects</a></li>
</ul>
</nav>
<h2>Hi, I'm a developer that loves clean & elegant code.</h2>
</div>
</header>
<main>
<section id="about">
<div class="content-wrapper">
<h2>A little bit about me.</h2>
<p>My tech journey started with a degree in journalism. I loved researching, writing, and sharing my
voice online, but something felt missing. I wished for a way to share and display information
exactly the way I wanted. That's when I discovered and fell in love with coding and web design!</p>
<p>As a front end developer, I pride myself on writing code that's easy to read and build upon while
still looking great. My goal with every site is to provide a top-of-the-line user experience.
Besides web development, I enjoy gardening and spending time with my small (but growing!) family.
</p>
</div>
</section>
<section id="skills">
<div class="content-wrapper">
<h2>Developer Skills</h2>
<div class="skill-list">
<img src="img/html-icon.png" alt="html icon">
<h3>HTML & CSS</h3>
<p>I pride myself on my organized and well-formatted HTML and CSS. All my code is tested to ensure
it's valid, accessible for all users, and works great on the major browsers.</p>
</div>
<div class="skill-list">
<img src="img/pencil-icon.png" alt="pencil icon">
<h3>Design to Code</h3>
<p>If you have a design, I can turn it into a website! I'll use the exact colors, fonts, and imagery
you need. You provide the design comp, and I'll code up a site just for you.</p>
</div>
<div class="skill-list">
<img src="img/git-icon.png" alt="GitHub icon">
<h3>Git & GitHub</h3>
<p>I never work on a project without my best friends Git and GitHub! I can collaborate with your
team on any codebase and adjust to your team's version control workflow.</p>
</div>
</div>
</section>
</main>
<footer id="contact">
<div class="content-wrapper">
<div class="contact-image">
<img src="img/jess-bailey-q10VITrVYUM-unsplash.png"
alt="work desk with a keyboard, pen, glasses, and notebook" id="contact-img">
</div>
<div class="contact-info">
<h2>Like What You See?</h2>
<h3 id="email-header">Let's meet for a cup of coffee.</h3>
<a href="mailto:[email protected]"><img src="img/envelope.png" alt="envelope icon"
id="envelope">[email protected]</a>
<h3 id="socialmedia-header">Or, follow me on social media:</h3>
<ul>
<li><a href="https://twitter.com/home" target="_blank"><img src="img/twitter.png" alt="Twitter icon"></a></li>
<li><a href="https://www.facebook.com" target="_blank"><img src="img/facebook.png" alt="Facebook icon"></a></li>
<li><a href="https://www.instagram.com" target="_blank"><img src="img/instagram.png" alt="Instagram icon"></a></li>
<li><a href="https://www.linkedin.com" target="_blank"><img src="img/linkedin.png" alt="LinkedIn icon"></a></li>
<li><a href="https://github.com" target="_blank"><img src="img/github.png" alt="GitHub icon"></a></li>
</ul>
</div>
</div>
</footer>
</body>

</html>
Loading

0 comments on commit a8fc687

Please sign in to comment.