-
Notifications
You must be signed in to change notification settings - Fork 28
/
Copy pathindex.html
149 lines (122 loc) · 5.63 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
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<script src="https://kit.fontawesome.com/7b12bcc245.js" crossorigin="anonymous"></script>
<title>Wedding Invite</title>
</head>
<body>
<nav>
<input type="checkbox" id="check">
<label for="check" class="checkbtn">
<i class="fas fa-bars"></i>
</label>
<label class="logo">A&G</label>
<ul class="text">
<li><a href="#story" onclick="myFunction()">OUR STORY</a></li>
<li><a href="#stay" onclick="myFunction()">TRAVEL & STAY</a></li>
<li><a href="#registry" onclick="myFunction()">PROMISES</a></li>
</ul>
</nav>
<div class="home hz-margin">
<h3>We'er getting married</h3>
<h1>Aman. & Gur.</h1>
<div class="container-out">
<div class="container-in text">
Friday, Oct. 20, 2023 <br>
ITC Sonar Bangla, Kolkata
<button class="huge-btn">RSVP</button>
</div>
<div class="home-img" id="home-img-lg"></div>
</div>
</div>
<div class="home-img home-img-sm"></div>
<div class="timeline hz-margin reveal">
<h2>Celebrating Our Love <br>
With Those We Love
</h2>
<div class="timeline-container">
<div class="timeline-img"></div>
<div class="timings">
<h3>01.    Ceremony</h3>
<div class="text">Friday, Oct. 20, 2023 <br>
ITC Sonar Bangla, Kolkata</div>
<h3>02.    Reception</h3>
<div class="text">Sunday, Oct. 22, 2023 <br>
Poddar Vihar, Kolkata</div>
</div>
</div>
</div>
<div class="v-reposition-container">
<div class="h-reposition-container">
<div id="story" class="hz-margin">
<h3 class="reveal">Not Just an <br>
Ordinary Love Story
</h3>
<p class="text reveal">We met on ferry. Not sure if the kids remember that one. His female housemates encouraged him to get on it - he wasn't keen, but one night we ended up chatting and the next day we met up at the Tellypara Ghat. We spent nine hours together by the river, and I bought him a cotton candy and he says that's how he knew I was the one.</p>
</div>
<div class="gallery hz-margin reveal">
<div class="gallery-img"></div>
<div class="gallery-img"></div>
<div class="gallery-img"></div>
</div>
<div class="quote reveal">
<h1>“To the world you are one person, but to one person you are the world”.</h1>
<div class="author text">Anonymous</div>
</div>
<div class="hands" id="parallax1"></div>
<div id="stay">
<h2 class="reveal">Travel and Stay</h2>
<div class="stay-container reveal">
<div class="stay-item">
<h3>01. <br>
Getting There
</h3>
<div class="text">Easy-to-follow <br> directions to the venue</div>
<div class="text links">MAP & DETAILS</div>
</div>
<div class="stay-item">
<h3>02. <br>
Once You're There
</h3>
<div class="text">Some fun things to do in <br> the area</div>
<div class="text links">OUR RECOMMENDATIONS</div>
</div>
<div class="stay-item">
<h3>03. <br>
Where to Stay
</h3>
<div class="text">Hotels and B&Bs <br> to check out</div>
<div class="text links">LODGING OPTIONS</div>
</div>
</div>
</div>
<div id="registry">
<div class="registry-container reveal">
<h3>Promises</h3>
<div class="text">
I will provide welfare and happiness for you and the children that we bear and you shall offer me food and help whenever it is required. Together, we will protect our children and home and stand as each other's strength and courage. I will put every other person secodary to you. You make my like complete and promise to respect you. God bless you, my best friend. I pray thee, may my presence fill our life with joy and prospers.
</div>
<button class="huge-btn text">BLESS US</button>
</div>
<div class="registry-img registry-img-lg" id="parallax2"></div>
</div>
<div class="registry-img registry-img-sm"></div>
<div class="parting-message reveal">
<h1>Hope to See You!</h1>
<button class="huge-btn">RSVP</button>
</div>
<footer>
<h2>Give us a Call</h2>
<h2>Amandeep: 123-456-7890</h2>
<h2>Gurpreet: 123-456-7890</h2>
<div class="text">© 2023 for Aman and Gur. Made by <a href="https://twitter.com/NathArchak" class="text">@NathArchak</a></div>
</footer>
</div>
</div>
<script src="main.js"></script>
</body>
</html>