Front end project

2025-12-01 22:05:44 -05:00
parent 0a497d0107
commit 4745524a5f
8 changed files with 168 additions and 0 deletions
--- a/Dev)/Projects/Final
+++ b/Dev)/Projects/Final
--- a/Project/contact.html
+++ b/Project/contact.html
@@ -0,0 +1,52 @@
 <!DOCTYPE html>
 <html>
 <head>
    <title>Pet Showcase - Contact</title>
    <link rel="stylesheet" href="style.css">
 </head>
 <body>
    <h1>Contact Page</h1>
    <small>Contact the owner of the page with questions or concerns below</small>
    <!-- Nav that matches one from homepage-->
    <nav>
        <ul>
            <li>
                <a href="index.html">Home</a>
            </li>
            <li>
                <a href="contact.html">Contact</a>
            </li>
        </ul>
    </nav>
    <strong>Contact requests will be answered within &infin; business days</strong>
    <!-- Form with 5 inputs and 2 buttons (assuming textarea counts as input)-->
    <form>
        <fieldset>
            <legend>Enter personal Information Below</legend>
            <label for="firstName">First Name:</label><br>
            <input type="text" name="firstName"><br>
            <label for="lastName">Last Name:</label><br>
            <input type="text" name="lastName"><br>
            <label for="email">Email:</label><br>
            <input type="email" name="email"><br>
            <label for="phone">Phone:</label><br>
            <input type="tel" name="phone"><br>
            <label for="message">Message:</label><br>
            <textarea name="message" rows="4" cols="50"></textarea><br>
            <button type="submit">Submit</button>
            <button type="reset">Reset</button>
        </fieldset>
    </form>
 </body>
 <!-- Footer to complete semantic elements, same as homepage-->
 <footer>
    <p><strong>&copy; 2025</strong> | Created by <strong>Levi McLean</strong></p>
 </footer>
 </html>
--- a/Project/img/Bo.jpeg
+++ b/Project/img/Bo.jpeg
--- a/Project/img/Frank.jpeg
+++ b/Project/img/Frank.jpeg
--- a/Project/img/Jax.jpeg
+++ b/Project/img/Jax.jpeg
--- a/Project/img/Mierda.jpeg
+++ b/Project/img/Mierda.jpeg
--- a/Dev)/Projects/Final
+++ b/Dev)/Projects/Final
@@ -0,0 +1,116 @@
 <!DOCTYPE html>
 <html>
 <head>
    <title>Pet Showcase - Home</title>
    <link rel="stylesheet" href="style.css">
 </head>
 <body>
    <h1>Levi's Pet Showcase</h1>
    <small>A collection of pet images with facts about their personality</small>
    <!-- Nav that will match accross all pages -->
    <nav>
        <ul>
            <li>
                <a href="index.html">Home</a>
            </li>
            <li>
                <a href="contact.html">Contact</a>
            </li>
        </ul>
    </nav>
    <h2>Welcome!</h2>
    <p>Below will be 5 short showcases for each of my pets (past and current) featuring pictures and a small description
        of their personalities</p>
    <!-- 5 Section elements for my animals-->
    <section href="mierda">
        <h3>Mierda</h3>
        <img src="img/Mierda.jpeg" alt="picture of Mierda" width="600" height="1000">
        <p>Mierda is 5 years old as of writing which makes her the oldest of the animals</p>
        <p>Mierda likes:</p>
        <ul>
            <li>Sleeping with her head in a shoe</li>
            <li>Wet food</li>
            <li>Sleeping outside</li>
            <li>Playing with <a href="#frank">Frank</a></li>
        </ul>
        <p>Although she looks very sweet (which she can be), she also has a bit of an evil genius side, which my family
            loves to joke about</p>
    </section>
    <hr>
    <section href="Frank">
        <h3>Frank</h3>
        <img src="img/Frank.jpeg" alt="picture of Frank" width="500" height="600">
        <p>Frank is 3 years old and came directly after Mierda</p>
        <p>Frank likes:</p>
        <ul>
            <li>Sleeping upside down</li>
            <li>Wet food</li>
            <li>Kibble</li>
            <li>Food that falls on the floor</li>
        </ul>
        <p>Frank LOVES food. We joke a lot about how he tends to beg like a dog, even sometimes sitting right next to <a
                href="#Bo">Bo</a> while he begs.</p>
    </section>
    <hr>
    <section href="Rocco">
        <h3>Rocco</h3>
        <img src="img/Rocco.jpeg" alt="picture of Rocco" width="500" height="700">
        <p>Rocco is 3 years old and was adopted very shortly after Frank, their almost the same age</p>
        <p>Rocco likes:</p>
        <ul>
            <li>Cuddles in bed</li>
            <li>Sleeping in boxes</li>
            <li>Scratching the cat post</li>
            <li>Drinking tap water from the faucet</li>
        </ul>
        <p>Rocco is pretty quiet but he's got a lot of personality. He's the silliest of the animals and often even
            tends to slip and trip on himself. He's very easily startled too.</p>
    </section>
    <hr>
    <section href="Bo">
        <h3>Bo</h3>
        <img src="img/Bo.jpeg" alt="picture of Bo" width="600" height="700">
        <p>Bo is 9 months old and is the newest addition to our family</p>
        <p>Bo likes:</p>
        <ul>
            <li>Jumping, a lot of jumping</li>
            <li>Walking with his backpack on</li>
            <li>Belly rubs</li>
            <li>Dried pigs ear treats (delicious, I know)</li>
        </ul>
        <p>Bo is still very young and figuring out his personality but he's very hyperactive and LOVES to jump off the
            back of the porch and up on us when we come home. He's a Boxer-Border Collie mix.</p>
    </section>
    <hr>
    <section href="Jax">
        <h3>Jax</h3>
        <img src="img/Jax.jpeg" alt="picture of Jax" width="500" height="700">
        <p>Jax was 9 years old when he past, which was about a year ago now.</p>
        <p>Jax Liked:</p>
        <ul>
            <li>Barking, he loved his voice</li>
            <li>The cats!</li>
            <li>The dog park</li>
            <li>Water, he was quite the swimmer</li>
        </ul>
        <p>Jax (or Jackie) was our first family pet, we love him and miss him but remember him everyday. Jax was a Great
            Pyranese mixed with a Shepherd breed of some sort. He had LOTS of fur and was very fluffy.</p>
    </section>
    <hr>
 </body>
 <!-- Footer that will match accross all pages -->
 <footer>
    <p><strong>&copy; 2025</strong> | Created by <strong>Levi McLean</strong></p>
 </footer>
 </html>
--- a/Dev)/Projects/Final
+++ b/Dev)/Projects/Final