Components-BEM/index.html at master · emukupa/Components-BEM · 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
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>Introduction to the DOM</title>
		<link rel="stylesheet" href="./styles.css">
	</head>

	<body>
		<div class="Section Section--header">
			<div class="Section__Dropdown">
				<div class="Dropdown__header">
					<p>Drop Down</p>
				</div>
				<div class="Dropdown__nav">
					<nav>
						<a href="#">Lambda</a>
						<a href="#">Google</a>
						<a href="#">MDN</a>
					</nav>
				</div>

			</div><!-- Drop down Component-->

			<div class="Section__header">
				<h1>Header</h1>
			</div><!-- header class-->
		</div><!-- Section component-->

		<div class="Section Section--box">
			<div class="Section__Box">
				<h2> Place Holder</h2>
				Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti sequi numquam illo maiores. Voluptatem ipsam nulla earum, molestias sequi repellendus accusantium perspiciatis itaque excepturi tempora. Natus nihil rerum totam ipsa!
				Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatum omnis magni voluptatem eveniet facilis aliquam accusantium eaque, iure quibusdam repellendus modi impedit, veniam necessitatibus nam! Doloribus alias eveniet labore sed.
			</div><!-- Box component-->
		</div><!-- Section component-->

		<div class="Section Section--box">
			<div class="Section__Box">
				<h2> Place Holder</h2>
				Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti sequi numquam illo maiores. Voluptatem ipsam nulla earum, molestias sequi repellendus accusantium perspiciatis itaque excepturi tempora. Natus nihil rerum totam ipsa!
				Lorem ipsum dolor sit amet consectetur adipisicing elit. Saepe, temporibus molestias soluta rem sed sapiente quas eum facere voluptatem odio rerum ea laboriosam explicabo nisi. Optio ducimus porro numquam molestiae!
			</div></div><!-- Box component-->
		</div><!-- Section component-->

		<script src="./components/Dropdown/Dropdown.js"></script>
	</body>
</html>