tarasis
/
rmcg.dev
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
rmcg.dev/projects/freeCodeCamp/responsive-web-design-projects/Project3-ProductLandingPage/index.html

99 lines
6.3 KiB
HTML
Raw Normal View History

Step 1 these are base files I started 8th August and then didn't touch again till now.
2020-10-06 02:08:26 +02:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Project 3 - Build A Product Landing Page</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<script src="https://kit.fontawesome.com/25481ff5bf.js" crossorigin="anonymous"></script>
</head>
<body>
<header id="header">
<nav id="nav-bar">
<img id="header-img" src="fake-logo.png" alt="company logo">
<div class="push" id="nav-links">
<a class="nav-link btn-link" href="#games">Games</a>
<a class="nav-link btn-link" href="#videos">Videos</a>
<a class="nav-link btn-link" href="#features">Features</a>
</div>
</nav>
</header>
<div id="empty-space">
&nbsp
</div>
<section id="formsection">
Some tweaks. Tried to not do too much compared to where I had it back in August. Supposed to be a reflection of where I was at that point of the freeCodeCamp course, not a bit further along having started Frontend Mentor.
2020-10-06 14:29:05 +02:00
<h1>Discover the latest games with Fakery</h1>
Step 1 these are base files I started 8th August and then didn't touch again till now.
2020-10-06 02:08:26 +02:00
<form id="form" action="https://www.freecodecamp.com/email-submit">
<div class="form-email">
<label for="email">Enter your email: </label>
<input type="email" name="email" id="email" placeholder="person@example.com" required>
</div>
<div class="form-example">
Improvements for mobile sizing. menu still to do
2020-10-11 18:01:41 +02:00
<!-- using class here doesn't work on iOS -->
Er don't scale the header image as pg sz increases
2020-10-11 16:29:42 +02:00
<input class="btn-link" id="submit" type="submit" value="Subscribe!">
Step 1 these are base files I started 8th August and then didn't touch again till now.
2020-10-06 02:08:26 +02:00
</div>
</form>
</section>
<section id="games">
Some tweaks. Tried to not do too much compared to where I had it back in August. Supposed to be a reflection of where I was at that point of the freeCodeCamp course, not a bit further along having started Frontend Mentor.
2020-10-06 14:29:05 +02:00
<h2>Latest Games</h2>
Step 1 these are base files I started 8th August and then didn't touch again till now.
2020-10-06 02:08:26 +02:00
<div class="grid">
<div class="icon">
<i class="fab fa-3x fa-acquisitions-incorporated"></i>
</div>
<div class="details">
<h3>Acq Inc</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit illum ipsum blanditiis quam ut quibusdam provident voluptas! Repellendus, adipisci ullam, distinctio, eos perferendis quia voluptatibus architecto ab nulla accusantium corrupti!</p>
</div>
</div>
<div class="grid">
<div class="icon">
<i class="fab fa-3x fa-d-and-d"></i>
</div>
<div class="details">
<h3>D&D</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit illum ipsum blanditiis quam ut quibusdam provident voluptas! Repellendus, adipisci ullam, distinctio, eos perferendis quia voluptatibus architecto ab nulla accusantium corrupti!</p>
</div>
</div>
<div class="grid">
<div class="icon">
<i class="fab fa-3x fa-critical-role"></i>
</div>
<div class="details">
<h3>Critical Role</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit illum ipsum blanditiis quam ut quibusdam provident voluptas! Repellendus, adipisci ullam, distinctio, eos perferendis quia voluptatibus architecto ab nulla accusantium corrupti!</p>
</div>
</div>
<div class="grid">
<div class="icon">
<i class="fab fa-3x fa-fantasy-flight-games"></i>
</div>
<div class="details">
<h3>Star Wars: X-Wing</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit illum ipsum blanditiis quam ut quibusdam provident voluptas! Repellendus, adipisci ullam, distinctio, eos perferendis quia voluptatibus architecto ab nulla accusantium corrupti!</p>
</div>
</div>
</section>
<section id="videos">
Some tweaks. Tried to not do too much compared to where I had it back in August. Supposed to be a reflection of where I was at that point of the freeCodeCamp course, not a bit further along having started Frontend Mentor.
2020-10-06 14:29:05 +02:00
<h2>Teasers for games</h2>
Improvements for mobile sizing. menu still to do
2020-10-11 18:01:41 +02:00
<iframe class="video" id="video" src="https://www.youtube.com/embed/KipPMgbpKzk?rel=0&amp;controls=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>
<iframe class="video" id="video3" src="https://www.youtube.com/embed/LhFETREAvhc?rel=0&amp;controls=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>
<iframe class="video" id="video4" src="https://www.youtube.com/embed/-PxHfU2Xoac?rel=0&amp;controls=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>
<iframe class="video" id="video2" src="https://www.youtube.com/embed/A4BuL886bJA?rel=0&amp;controls=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>
Step 1 these are base files I started 8th August and then didn't touch again till now.
2020-10-06 02:08:26 +02:00
</section>
<section id="features">
<h2 >Features</h2>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eveniet voluptatibus nisi maiores quidem quas rem labore explicabo nam quasi, consectetur, soluta error perspiciatis repellendus autem dolores optio? Eaque, quasi magnam?
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eveniet voluptatibus nisi maiores quidem quas rem labore explicabo nam quasi, consectetur, soluta error perspiciatis repellendus autem dolores optio? Eaque, quasi magnam?
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eveniet voluptatibus nisi maiores quidem quas rem labore explicabo nam quasi, consectetur, soluta error perspiciatis repellendus autem dolores optio? Eaque, quasi magnam?
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eveniet voluptatibus nisi maiores quidem quas rem labore explicabo nam quasi, consectetur, soluta error perspiciatis repellendus autem dolores optio? Eaque, quasi magnam?
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eveniet voluptatibus nisi maiores quidem quas rem labore explicabo nam quasi, consectetur, soluta error perspiciatis repellendus autem dolores optio? Eaque, quasi magnam?
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eveniet voluptatibus nisi maiores quidem quas rem labore explicabo nam quasi, consectetur, soluta error perspiciatis repellendus autem dolores optio? Eaque, quasi magnam?
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eveniet voluptatibus nisi maiores quidem quas rem labore explicabo nam quasi, consectetur, soluta error perspiciatis repellendus autem dolores optio? Eaque, quasi magnam?
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eveniet voluptatibus nisi maiores quidem quas rem labore explicabo nam quasi, consectetur, soluta error perspiciatis repellendus autem dolores optio? Eaque, quasi magnam?
</p>
</section>
<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>
</body>
</html>