<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Practice Projects</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <header>
        <!-- some logo here -->
        <div class="header">
            <h1 class="test">Practice Projects</h1>
        </div>
        <!-- consider a menu for jumping down page -->
    </header>
    <main>
        <div class="blurb">
            <p>These are completed projects done to practice using HTML, CSS & Javascript. They come from different services, and most are freely available for anyone to practice with.</p>
            &nbsp;
            <p>I have put them all into a single GIT repository rather than litter my github page with many different projects. This may change in future depending on how many of these that I do.</p>
            &nbsp;
            <p>Robert McGovern</p>
        </div>
        <div class="projectsDiv">
            <div class="frontEndMentorChallenges">
                <h2>Frontend Mentor Challenges</h2>
                <div class="newbieChallenges">
                    <h3>Newbie Challenges</h3>
                    <ul>
                        <li><a href="./FrontendMentor/huddle-landing-page-with-single-introductory-section-master/index.html">Huddle Landing Page with a Single Introductory Section</a></li>
                        <li><a href="./FrontendMentor/ping-coming-soon-page-master/index.html">Ping Coming-Soon page</a></li>
                        <li><a href="./FrontendMentor/single-price-grid-component-master/index.html">Single Price Grid Component page</a></li>
                        <li><a href="./FrontendMentor/four-card-feature-section/index.html">Four Card Feature Section page</a></li>
                        <li><a href="./FrontendMentor/article-preview-component/index.html">Article Preview Component</a></li>
                    </ul>    
                </div>
            </div>
            <div class="freecodeCampProjects">
                <h2>FreecodeCamp</h2>
                <div class="responsiveWebDesignProjects">
                    <h3>Responsive Web Design Projects</h3>
                    <ul>
                        <li><a href="./freeCodeCamp/responsive-web-design-projects/Project1-TributePage/">Project 1 - Tribute Page</a></li>
                        <li><a href="./freeCodeCamp/responsive-web-design-projects/Project2-BuildaSurveyForm/">Project 2 - Build a Survey Form</a></li>
                        <li><a href="./freeCodeCamp/responsive-web-design-projects/Project3-ProductLandingPage/">Project 3 - Product Landing Page</a></li>
                        <li><a href=""></a></li>
                        <li><a href=""></a></li>
                    </ul>
                </div>
            </div>
            <div class="completeWebDev2020Projects">
                <h2>Complete Web Development 2020</h2>
                <p>coming soon</p>
            </div>
            <div class="vanillaJSProjects">
                <h2>Vanilla JS Projects</h2>
                <p>coming soon</p>
            </div>
        </div>
    </main>
    <footer>
        <!-- some blurb here -->
        <p>All projects are the work of Robert McGovern, 2020. <a href="emailto:work@tarasis.net">Email</a>, <a href="https://tarasis.net">Website/Blog</a></p>
        <a href='http://www.heropatterns.com/'>Background SVG provided by Steve Schoger @ Hero Patterns</a>
    </footer>
</body>
</html>