-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
30 lines (30 loc) · 1.42 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
<!DOCTYPE html>
<html>
<head>
<title>Particle Header</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet">
<script type="text/javascript" src="particle.header.js"></script>
<style>
#particle-header canvas{
position: absolute;
top:0;
left: 0;
}
</style>
</head>
<body class="">
<header class="bg-black p-16 relative" style="min-height:420px;background-image: url('home-hero.jpg')">
<div class="">
<h1 class="text-white text-5xl uppercase font-bold pt-10">Engaging Headline</h1>
<p class="text-white pt-1">Supporting copy for the headline</p>
</div>
<div id="particle-header" class="absolute z-0 top-0 left-0 w-full h-full"></div>
</header>
<div class="container p-8">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam id fermentum neque, vitae pharetra nisi. Quisque sagittis lobortis sem. Nunc ut mi sem. Ut quis lacus commodo, fermentum leo ut, lobortis tortor. Nam sit amet massa nulla. Nam in velit leo. Nullam vitae ultrices lectus. Nullam turpis lorem, fringilla et eros sed, imperdiet pulvinar elit. Nullam in neque facilisis velit ultrices facilisis dapibus sit amet ex. Etiam tincidunt diam a enim maximus, eu tincidunt erat elementum.
</p>
</div>
</body>
</html>