-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.php
113 lines (105 loc) · 4.94 KB
/
index.php
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>COACHELLA MOMENTS</title>
<link rel="icon" type="image/png" href="img/favicon.png">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
<link href="https://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i" rel="stylesheet">
<script src="https://use.fontawesome.com/a391b5c69b.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<!-- Navigation -->
<nav class="main-nav desktop mobile">
<input id="menu" type="checkbox">
<label for="menu" class="menu">
<span>Menu</span>
</label> <!-- .menu -->
<div class="nav-items">
<a href="#home" class="nav-item home"><p><span>Home</span></p></a>
<a href="#info" class="nav-item info"><p><span>Info</span></p></a>
<a href="#top-list" class="nav-item top-list"><p><span>Top List</span></p></a>
<a href="#coachella" class="nav-item coachella"><p><span>Coachella</span></p></a>
<a href="#most-recent" class="nav-item most-recent"><p><span>Most Recent</span></p></a>
</div> <!-- .nav-items -->
</nav> <!-- .main-nav .desktop .mobile -->
<!-- Home page -->
<section id="home" class="home">
<div class="heading">
<h1>#coachellamoment</h1>
<a href="#info" class="down">
<img src="img/scroll.png" alt="scroll button">
</a>
</div> <!-- .heading -->
<video autoplay loop>
<source src="img/video.mp4" type="video/mp4">
</video>
</section> <!-- #home .home -->
<!-- About the contest -->
<section id="info" class="info">
<img src="img/people.png" alt="Coachella visistors" class="info-img">
<div class="bg-block">
<div class="text-block">
<h2>Share your best Coachella moment!</h2>
<p>Find your best moment from last year's Coachella and share it with the world! Use <strong><a href="https://www.instagram.com/explore/tags/coachellafestival/" target="_blank">#coachellamoment</a></strong> to tag your image on Instagram, no later than Friday, June 2nd. The Coachella moment with most likes by the end of the contest wins two free tickets to next year's festival!</p>
<div class="link">
<a href="https://www.instagram.com/" class="insta-link" target="_blank">Start sharing now</a>
</div>
</div> <!-- .text-block -->
</div> <!-- .bg-block -->
</section> <!-- #info .info -->
<!-- Top list -->
<section id="top-list" class="top-list">
<h2>Top List</h2>
<div class="overlay">
<div class="pop-up">
</div> <!-- .pop-up -->
</div> <!-- .overlay -->
<div class="posts">
</div> <!-- .posts -->
</section> <!-- #top-list .top-list -->
<!-- About the festival (remote link to Coachella) -->
<section id="coachella" class="coachella">
<div class="img-block">
<img src="img/coachella2.jpg">
</div> <!-- .img-block -->
<div class="text-block animated-text">
<h2>Coachella festival</h2>
<p>Ready to make your Coachella experience exceptional? Everything you want to know before you hit the desert can be found in our Coachella Guides. From Passes and Travel to Camping and Cuisine, we’ve got you covered.</p>
<div class="link">
<a href="https://www.coachella.com/" target="_blank">Visit Coachella official</a>
<div class="hover"></div>
</div>
</div> <!-- .text-block .animated-text -->
</section> <!-- #coachella .coachella -->
<!-- Most recent posts -->
<section id="most-recent" class="most-recent">
<h2>Most recent posts</h2>
<div class="posts">
<!-- Posts-->
</div> <!-- .posts -->
</section> <!-- #most-recent .most-recent -->
<footer class="footer">
<div class="palm">
<!-- Import SVG-image -->
<?php include 'php/palmtree.php'; ?>
</div> <!-- .palm -->
<div class="logo">
<img src="img/logo.png" alt="logo">
<p>COACHELLA VALLEY MUSIC AND ARTS FESTIVAL</p>
</div> <!-- .logo -->
<div class="social">
<i class="fa fa-facebook-official"></i>
<i class="fa fa-instagram"></i>
<i class="fa fa-youtube-square"></i>
<i class="fa fa-twitter-square"></i>
</div> <!-- .social -->
<a href="#home" class="to-top">∧</a>
</footer> <!-- .footer -->
<!-- Script -->
<script src="https://cdn.polyfill.io/v2/polyfill.js?features=default,fetch"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="js/all.js"></script>
</body>
</html>