-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathabout.html
174 lines (171 loc) · 6.27 KB
/
about.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
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
<!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="icon" href="assets/images/cup.jpeg" type="image/x-icon" />
<link rel="stylesheet" href="src/css/style.css" />
<link rel="stylesheet" href="src/css/top-section-about.css" />
<link rel="stylesheet" href="src/css/mid-section.css" />
<link rel="stylesheet" href="src/css/guests-section.css" />
<script
src="https://kit.fontawesome.com/a4bb0e0fbd.js"
crossorigin="anonymous"
></script>
<title>Friends Reunion</title>
</head>
<body>
<section class="header">
<header>
<nav class="nav">
<div class="mobile-menu">
<i class="fa-sharp fa-solid fa-bars"></i>
</div>
<div class="menu-mobile hideMenu">
<button class="close"><h2>X</h2></button>
<ul class="mobile-links">
<li class="mobileLink">
<a class="mobileLinkText" href="./index.html">Home</a>
</li>
<li class="mobileLink">
<a class="mobileLinkText" href="./about.html">About</a>
</li>
<li class="mobileLink">
<a class="mobileLinkText" href="#program">Program</a>
</li>
<li class="mobileLink">
<a class="mobileLinkText" href="#guests">Join</a>
</li>
<li class="mobileLink">
<a class="mobileLinkText buy-ticket" href="#">Buy ticket</a>
</li>
</ul>
</div>
<div class="social">
<ul class="social-links">
<li><img src="assets/images/GitHub.png" alt="Github Link" /></li>
<li>
<img src="assets/images/Twitter.png" alt="Twiter Link" />
</li>
<li>English</li>
<li>My Page</li>
<li>Logout</li>
</ul>
</div>
<div class="desktop-menu">
<a href="./index.html" class="logo"
><span class="logo-left">Fri</span><span>🔥</span
><span class="logo-right">Ends</span></a
>
<ul class="desktop-links">
<li class="link"><a href="./about.html">About</a></li>
<li class="link"><a href="./index.html#program">Program</a></li>
<li class="link"><a href="./index.html#guests">Join</a></li>
<li class="link"><a href="./index.html#partners">Sponsor</a></li>
<li class="link"><a href="#">Fans</a></li>
</ul>
<button class="buy-ticket">Buy Ticket</button>
</div>
</nav>
</header>
<section class="hero-main">
<div class="breadCrambs">
<a href="./index.html"> <i class="fa-solid fa-house"></i></a>
<i class="fa-solid fa-chevron-right"></i>
<a href="./index.html">Home</a>
<i class="fa-solid fa-chevron-right"></i>
About
</div>
<div class="hero">
<p class="sub-heading">"Hello! F.r.i.e.n.d.s Fans"</p>
<div class="h1-bg">
<h1 class="hero-h1">
Friends The Reunion <span>Super Fan's Conference</span>
<span>2023</span>
</h1>
</div>
<div class="welcome">
<p class="welcome-text">
As we gather together, we will reminisce on the incredible journey
we shared with Rachel, Ross, Monica, Chandler, Joey, and Phoebe.
This is a unique opportunity to celebrate the magic of the show
that captured our hearts for a decade and beyond.
</p>
</div>
<div class="date-location">
<h3>
Save your seat on this wonderfull event, you can contact us via
<span>[email protected]</span>
</h3>
</div>
</div>
</section>
</section>
<!-- Mid Section -->
<section class="advert">
<h2>Set Replica Build Competition</h2>
<p>
A compition to build the replica of your favirote friends set,
submissions start April, 10 2023.Participants must choose a set or
location from Friends to replicate and submit a design plan with
dimensions and materials before the competition. The design plan should
be approved by the competition organizers before building begins.
</p>
<img
class="competion"
src="assets/images/lego-set.webp"
alt="Friend Set"
/>
</section>
<!-- Stream -->
<section class="advert">
<h2>You can Stream the live event</h2>
<p>
Subscribe to HBO Max or Apple TV + to see the live event, coverage
starts @5pm.
</p>
<div class="stream">
<div class="img-container">
<img
class="stream-img"
src="assets/images/concert.jpg"
alt=" Stream with Hbo"
/>
<p>HBO Max<span>Catch all the action live on HBO MAx</span></p>
</div>
<div class="img-container">
<img
class="stream-img"
src="assets/images/concert.jpg"
alt="Strream with Apple TV +"
/>
<p>
Apple TV +<span>Dont miss a single action with apple TV +</span>
</p>
</div>
</div>
</section>
<section class="partner" id="partners">
<h2>Partner</h2>
<ul class="partners">
<li><img src="assets/images/warner-bros.png" alt="warner bros" /></li>
<li><img src="assets//images/hbo.png" alt="Hbo Max" /></li>
<li><img src="assets/images/netflix.png" alt="netflix" /></li>
<li><img src="assets/images/apple-tv.png" alt="apple TV" /></li>
<li><img src="assets/images/roku.png" alt="Roku" /></li>
</ul>
</section>
<footer class="footer">
<a href="#" class="logo"
><span class="logo-left">Fri</span><span>🔥</span
><span class="logo-right">Ends</span></a
>
<div class="rights">
<p>2023 Abel Tsegaye, All rights are Reserved</p>
<p>Built with ❤️ by Abel</p>
</div>
</footer>
<script src="src/js/index.js"></script>
</body>
</html>