-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
137 lines (137 loc) · 6.26 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
<!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">
<title>Olympics Games</title>
<script src="https://kit.fontawesome.com/53a64647bf.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="styles/style.css">
</head>
<body>
<header class="header">
<div class="medium">
<ul class="header-1 header-2 header-3">
<li class="media-link">
<a href="#"><i class="fa fa-facebook"></i></a>
</li>
<li class="media-link">
<a href="#"><i class="fa fa-twitter"></i></a>
</li>
<li class="media-link"><a href="#">English</a></li>
<li class="media-link"><a href="#">My page</a></li>
<li class="media-link"><a href="#">Logout</a></li>
</ul>
</div>
<nav class="nav-bar">
<div class="Hamburger header-2 header-3">
<img src="images/hamburger-1.png" class="show-btn" alt="Show menu">
<img src="images/Icon-Cancel.png" class="close-btn" alt="close menu">
<div class="logo active">
<a href="./index.html">
<img src="images/olympics.png" alt="logo">
</a>
</div>
<ul class="nav-menu header-2 header-3">
<li class="nav-menu-link"><a href="./about.html">About</a></li>
<li class="nav-menu-link"><a href="#Sports">Sports</a></li>
<li class="nav-menu-link"><a href="#Games">Games</a></li>
<li class="nav-menu-link"><a href="#Sponsors">Sponsors</a></li>
<li class="nav-menu-link active"><a href="./about.html">Soccer</a></li>
</ul>
</div>
</nav>
</header>
<main>
<section id="Home" class="home-1">
<div class="home-2">
<h2>"HELLO! OLYMPICS WORLD"</h2>
<h1>OLYMPICS GAMES 2022<br/>LIVE</h1>
</div>
<article>
<h4>
Walter Camp is considered the 'founder' of American football. Camp was a great rugby player from Yale University who began to transform rules of rugby
for a more 'modern' style of play, which eventually developed into the sport of football during the 1880's.
</h4>
</article>
<div class="sports">
<h3>FROM 31st(MON)AUG ~~ 04th(Fri)OCT, 2022</h3>
<p>@Olympics 2022/Beijing 2022</p>
</div>
</section>
<section id="Sports" class="sports-section">
<h2>Upcoming Games</h2>
<ul class="main-program">
<li class="sports-item header-2 header-3">
<div>
<img src="images/skiing.png" class="icons" alt="skii">
</div>
<h3>Skiing</h3>
<p>Watch in live streaming the 2022 Olympics Games in China, Beijing and follow exciting sports games.</p>
</li>
<li class="sports-item header-2 header-3">
<div>
<img src="images/cycling.png" class="icons" alt="cycle">
</div>
<h3>Cycling</h3>
<p>Watch in live streaming the 2022 Olympics Games in China, Beijing and follow exciting sports games.</p>
</li>
<li class="sports-item header-2 header-3">
<div>
<img src="images/formula-1.png" class="icons" alt="formula 1">
</div>
<h3>Formula 1</h3>
<p>Watch in live streaming the 2022 Olympics Games in China, Beijing and follow exciting sports games.</p>
</li>
<li class="sports-item header-2 header-3">
<div>
<img src="images/swim.png" class="icons" alt="swimming">
</div>
<h3>Swimming</h3>
<p>Watch in live streaming the 2022 Olympics Games in China, Beijing and follow exciting sports games.</p>
</li>
<li class="sports-item header-2 header-3">
<div>
<img src="images/boxing.png" class="icons" alt="boxing">
</div>
<h3>Boxing</h3>
<p>Watch in live streaming the 2022 Olympics Games in China, Beijing and follow exciting sports games.</p>
</li>
</ul>
<div class="btn-1 game-btn">
<button type="button">Olympics</button>
</div>
<div class="btn-1 games-btn"><button type="button">Games</button></div>
</section>
<section id="Games" class="featured-section">
<h2>Olympics Games</h2>
<ul class="games">
</ul>
<div class="arrow header-2 header-3">
<button type="submit"><span>MORE</span> <i class="fa fa-chevron-down"></i></button>
</div>
</section>
<section id="Sponsors" class="sponsors-section">
<h2 class="sponsors-title">Sponsors</h2>
<ul class="sponsors-list header-2 header-3">
<li><img src="images/visa-master.png" alt="visa-master"></li>
<li><img src="images/google-logo.png" alt="google-logo"></li>
<li><img src="images/Toyota-Logo.png" alt="Toyota-Logo"></li>
<li><img src="images/mozilla.png" alt="mozilla"></li>
<li><img src="images/airbnb.png" alt="airbnb"></li>
<li><img src="images/naver.png" alt="naver"></li>
</ul>
</section>
</main>
<footer id="footer" class="footer-container header-2">
<div class="logo">
<img src="images/olympics.png" alt="logo">
</div>
<div class="created">
<p>© Copyright/OLYMPICS 2022</p>
</div>
</footer>
<script src="./functions/main.js"></script>
<script src="./functions/feature.js"></script>
</body>
</html>