02-Homework/index.html at main · IIMacGyverII/02-Homework · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="icon"
    type="image/png"
    href="./Assets/img/favicon-32x32.png">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./Assets/css/style.css"/>
    <title>Joshua Christianson Portfolio</title>
</head>
    <body>
        <header>
            <nav>
                <ul>
                <a href="#pageflexbox">Home</a>
                <a href="#pageflexbox">About Me</a>
                <a href="#rightworkcontent2">Work</a>
                <a href="#contact">Contact</a>
                </ul>
            </nav>
        </header>
        <!-- buy image if kept from https://www.shutterstock.com/image-vector/abstract-technology-concept-bright-blue-web-1012205053 -->
        <img class="head-img" src="./Assets/img/banner3.jpg" alt="Cool Tech Banner">
        <section id="pageflexbox">
            <section class="leftcolumn">
                <div class="leftcolumnflexbox">
                <h1>About Me</h1>
                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nam veritatis placeat asperiores neque ut unde.</p>
                <h2>Work</h2>
                <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Quidem, unde?</p>
                </div>
                <div class="leftcolumnflexbox">
                    <h3>Contact Me</h3>
                </div>
            </section>
            <section class="rightcolumn">
                <!-- About me context  -->
                <div class="rightcolumnflexbox">
                    <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Ex quae dolor similique quo, iusto repellendus eius soluta delectus suscipit commodi in veritatis, voluptas rem necessitatibus molestiae voluptates nisi natus assumenda voluptate eveniet. Eveniet quidem earum dolorem similique architecto quibusdam sit aspernatur dolore assumenda laudantium neque, ratione inventore facilis magni delectus saepe veritatis ad aliquid eligendi molestiae. Eveniet voluptatem corrupti rerum neque! Atque officiis modi impedit quaerat autem nulla aperiam aspernatur consectetur iste accusamus perspiciatis nobis ullam minus molestias animi molestiae reiciendis, eligendi dicta quia ipsum esse voluptas culpa maxime! Voluptate similique dolore laudantium saepe exercitationem deserunt fugiat esse amet perferendis sed non recusandae fuga corporis error commodi modi quas sit autem, minima nesciunt repellendus eveniet sapiente. Ipsum sunt voluptatem quasi facere maxime molestiae repellendus. Rerum minima ullam impedit obcaecati quas distinctio repellendus porro enim, suscipit amet asperiores ad nesciunt nisi itaque beatae temporibus vel eligendi voluptas. Exercitationem fugit ipsa sunt.</p>
                </div>
                <div class="rightworkcontent">
                    <img class="rightworkcontent" src="./Assets/img/surf.jpg" alt="Surf report">
                    <img id="rightworkcontent2" src="./Assets/img/led.jpg" alt="LED">
                    <img id="rightworkcontent2" src="./Assets/img/calculator.jpg" alt="Calculator">
                    <img id="rightworkcontent2" src="./Assets/img/pastel.jpg" alt="Pastels">
                    <img id="rightworkcontent2" src="./Assets/img/runbuddy.jpg" alt="Runbuddy">
                </div>
                <div id="contact">
                    <!-- Contact Info context -->
                    <p>Loremipsum@lorem.com</p><p>Lorem ipsum dolor sit amet.</p>
                        <p>(123) 456-7890</p>
                </div>
            </section>

        </section>
    </body>
</html>