userinterface2/index.html at master · buildpartyplanner/userinterface2 · 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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Party Planner</title>
  <meta name="description" content="The HTML5 Herald">
  <meta name="author" content="SitePoint">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="css/index.css">
</head>

<body>

    <div class="container">

        <nav class="navBar">
            <a href="#" class="links">Home</a>
            <a href="#" class="links login">Login</a>
            <a href="#" class="links gallery">Gallery</a>
            <a href="#" class="links">Testimonials</a>
        </nav>

        <header class="banner">

            <div class="headerText">
                <h1>Party Planner</h1>
                <br>
                <h3>plan now</h3>
                <br>
                <h3>party later</h3>
            </div>

            <div class="headerRight">
                <img src="img\stadiumImg.jpeg"
                alt="header party stadium img" class="headerImg">
            </div>

        </header>

        <section class="main">

            <div class="mainLeft">
                <img src="img\partyFist.jpeg"
                alt="smokey img with fist in the air"
                 class="mainPartyImg">
            </div>

            <div class="mainRight">
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit,
                sed do eiusmod tempor incididunt ut labore et dolore magna
                aliqua. Ut enim ad minim veniam, quis nostrud exercitation
                ullamco laboris nisi ut aliquip ex ea commodo consequat.
                Duis aute irure dolor in reprehenderit in voluptate velit
                esse cillum dolore eu fugiat nulla pariatur. Excepteur sint
                occaecat cupidatat non proident, sunt in culpa qui officia
                deserunt mollit anim id est laborum.</p>
            </div>

            <div class="lowerLeft">
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit,
                sed do eiusmod tempor incididunt ut labore et dolore magna
                aliqua. Ut enim ad minim veniam, quis nostrud exercitation
                ullamco laboris nisi ut aliquip ex ea commodo consequat.
                Duis aute irure dolor in reprehenderit in voluptate velit
                esse cillum dolore eu fugiat nulla pariatur. Excepteur sint
                occaecat cupidatat non proident, sunt in culpa qui officia
                deserunt mollit anim id est laborum.</p>
            </div>

            <div class="lowerRight">
                <img src="img\partyConfetti.jpeg"
                alt="Girls throwing confetti image"
                class="confettiImg">
            </div>

            <div class="bottomLeft">
                <img src="img\fireworks.jpeg" alt="fireworks image"
                class="fireworks">
            </div>

            <div class="bottomRight">
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit,
                sed do eiusmod tempor incididunt ut labore et dolore magna
                aliqua. Ut enim ad minim veniam, quis nostrud exercitation
                ullamco laboris nisi ut aliquip ex ea commodo consequat.
                Duis aute irure dolor in reprehenderit in voluptate velit
                esse cillum dolore eu fugiat nulla pariatur. Excepteur sint
                occaecat cupidatat non proident, sunt in culpa qui officia
                deserunt mollit anim id est laborum.</p>
            </div>

        </section>

        <footer class="bottomContent">

            <div class="contactText">
                <h3>Contact Us</h3>
                <ul>
                    <li class="contactHeader"><strong>Email</strong></li>
                    <li class="contactInfo">contact@partyplanner.com</li>
                    <li class="contactHeader"><strong>Phone</strong></li>
                    <li class="contactInfo">(555) 555-5555</li>
                    <li class="contactHeader"><strong>Address</strong></li>
                    <li class="contactInfo">129 W 81st St</li>
                    <li class="contactInfo">Burbank, CA 91501</li>
                </ul>
            </div>

            <div class="contactForm">
                <form method="post" action="php/form.php" autocomplete="off">
                    <input type="text" class="name" name="name" placeholder="Name" required>
                    <input type="text" class="email" name="email" placeholder="Email" required>
                    <br>
                    <textarea rows="20" cols="50" class="message"
                    placeholder="Message" required></textarea>
                    <br>
                    <button>Submit</button>
                </form>

            <div class="copyright">
                <p>©PartyPlanner Inc.</p>
            </div>

            </div>


        </footer>


    </div>  <!--container -->
    <script src="js/index.js"></script>
</body>
</html>