generated from irm1005-itec1005-fall-2023/template-assignment-02
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
125 lines (110 loc) · 4.41 KB
/
index.html
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
<!DOCTYPE html>
<html lang="en-ca">
<head>
<!-- Set the page title -->
<title>Assignment 02</title>
<!-- Set the charset we're using to UTF-8 -->
<meta charset="utf-8" />
<!-- Set the screens default zoom / scale to 1 -->
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- Specifies the document mode for Internet Explorer -->
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<!-- We are using a CSS Reset file to standardize browser default css -->
<link rel="stylesheet" href="./reset.css" />
<!-- This is where all of our awesome CSS code goes -->
<link rel="stylesheet" href="./style.css" />
</head>
<body>
<!--
LIST ANY CITATIONS HERE
* ChatGPT for indenting some code and fixing the spacing, also helping me understand some W3C validation erros
* https://www.w3schools.com/css/css_grid.asp
* https://tejabeetan06.wixsite.com/sanfernando
-->
<!--
YOU HAVE TO MODIFY THE HTML TO BUILD YOUR AWESOME PAGE
-->
<header>
<h2 class="title">CozeCandle</h2>
</header>
<nav>
<ul>
<li>
<a href="index.html">Home</a>
</li>
<li>
<a href="Contact.html">Contact us</a>
</li>
<li>
<a href="Instagram.com">Instagram</a>
</li>
</ul>
</nav>
<main>
<section class="who">
<div class="txt">
<h2>Welcome to CozeCandle,</h2>
<p>At CozeCandle, it is our honest belief that the right scent can transform any space into a place of tranquility. Our candles are made with natural soy wax and essential oils to deliver a clean burn.</p>
</div><img class="size" src="images/san fernando!.webp" alt="San Fernando">
</section>
<section class="mhealth">
<div class="txt2">
<h2>Why CozeCandle?</h2>
<p>Our candles are made with sustainable materials, including recyclable packaging. We use natural soy wax and premium essential oils. From refreshing citrus to calming lavender, we offer scents for every mood and occasion.</p>
</div><img class="size" src="images/group-candles-are-lit-dark-room_1340-25864.jpg.avif" alt="San Fernando">
</section>
<section>
<img class="stretch" src="images/candle.png" alt="City">
<section class="divider">
<h2>Inspiration in Every Room</h2>
<p>Browse through our gallery of CozeCandle photos, showing how our candles can bring warmth and style to any home. From living rooms to bathrooms, our candles are perfect for every setting.</p>
</section>
<section class="impact">
<div class="row">
<img class="image" src="images/017-Candle-Lit_RT_500x.jpg.webp" alt="StPaul">
<h3>Morning Dew</h3>
<p>The clean scent of freshly cut grass with a touch of light rain.</p>
</div>
<div class="row">
<img class="image" src="images/images.jpeg" alt="CMHA">
<h3>Citrus Zest</h3>
<p>A refreshing burst of orange, lemon, and grapefruit to energize your space.</p>
</div>
<div class="row">
<img class="image" src="images/ddf2345cae78d5e9fc5fa2dd2cc1ac8e5ff74126747c996e93790eb277bb9dd7.jpeg.webp" alt="Upstream">
<h3>Ocean Breeze</h3>
<p>Crisp sea salt and ocean air mixed with hints of fresh linen.</p>
</div>
</section>
</section>
<section class="contact">
<h2>Contact us</h2>
<form>
<fieldset>
<label for="name">Name:</label> <input type="text" id="name" name="name" autocomplete="name" required=""> <label for="email">Email:</label> <input type="email" id="email" name="email" autocomplete="email" required=""> <label for="phone">Phone:</label> <input type="tel" id="phone" name="phone" autocomplete="tel" required="">
</fieldset>
<p>Message:</p>
<fieldset>
<textarea id="textarea" name="feedback" required=""></textarea> <input type="checkbox" id="checkbox" name="checkbox"> <label for="checkbox">Sample Confirmation</label> <input type="submit" value="Submit Message">
</fieldset>
</form>
</section>
<nav>
<ul>
<li>
<a href="index.html">Home</a>
</li>
<li>
<a href="Contact.html">Contact us</a>
</li>
<li>
<a href="Instagram.com">Instagram</a>
</li>
</ul>
</nav>
<footer>
<p>© 2024 CozyCandle. All rights reserved.</p>
</footer>
</main>
</body>
</html>