-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathinterests.html
130 lines (118 loc) · 6.61 KB
/
interests.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
<link href='https://fonts.googleapis.com/css?family=Sofia' rel='stylesheet'>
<link href="styles.css" rel="stylesheet">
<title>My Interests</title>
</head>
<body>
<nav id="navbar">
<div class="container">
<div class="welcome">
<span>Welcome to my homepage.</span>
</div>
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="life.html">LIFE</a></li>
<li><a href="interests.html" class="active">INTERESTS</a></li>
<li><a href="feedback.html">FEEDBACK</a></li>
</ul>
</div>
</nav>
<div class="interests-h">
<h1>Music</h1>
</div>
<div class="slider">
<span id="slide-1"></span>
<span id="slide-2"></span>
<span id="slide-3"></span>
<div class="image-container">
<a href="https://open.spotify.com/artist/4YRxDV8wJFPHPTeXepOstw?autoplay=true"><img src="/homepage/images/arijit.jpg" alt="Arijit Singh" class="slide" width="500" height="300"></a>
<a href="https://open.spotify.com/artist/2oSONSC9zQ4UonDKnLqksx?autoplay=true"><img src="/homepage/images/atif.jpg" alt="Atif Aslam" class="slide" width="500" height="300"></a>
<a href="https://open.spotify.com/artist/1mYsTxnqsietFxj1OgoGbG?autoplay=true"><img src="/homepage/images/arrahman.jpg" alt="A R Rahman" class="slide" width="500" height="300"></a>
</div>
<div class="buttons">
<a href="#slide-1"></a>
<a href="#slide-2"></a>
<a href="#slide-3"></a>
</div>
</div>
<div class="interests-h">
<h1>Movies & Shows</h1>
</div>
<div class="slider">
<span id="slide-4"></span>
<span id="slide-5"></span>
<span id="slide-6"></span>
<div class="image-container">
<a href="https://www.marvel.com/movies/avengers-endgame"><img src="/homepage/images/endgame.jpg" alt="Avengers Endgame" class="slide" width="500" height="300"></a>
<a href="https://www.hbo.com/game-of-thrones"><img src="/homepage/images/got.jpg" alt="Game of Thrones" class="slide" width="500" height="300"></a>
<a href="https://www.wizardingworld.com/"><img src="/homepage/images/hp.jpg" alt="Harry Potter" class="slide" width="500" height="300"></a>
</div>
<div class="buttons">
<a href="#slide-4"></a>
<a href="#slide-5"></a>
<a href="#slide-6"></a>
</div>
</div>
<div class="interests-h">
<h1>Food</h1>
</div>
<div class="slider">
<span id="slide-7"></span>
<span id="slide-8"></span>
<span id="slide-9"></span>
<div class="image-container">
<a href="https://www.google.com/search?q=biryani"><img src="/homepage/images/biryani.jpg" alt="Biryani" class="slide" width="500" height="300"></a>
<a href="https://www.google.com/search?q=burger"><img src="/homepage/images/burger.jpg" alt="Burger" class="slide" width="500" height="300"></a>
<a href="https://www.google.com/search?q=pizzad"><img src="/homepage/images/pizza.jpg" alt="Pizza" class="slide" width="500" height="300"></a>
</div>
<div class="buttons">
<a href="#slide-7"></a>
<a href="#slide-8"></a>
<a href="#slide-9"></a>
</div>
</div>
<div class="container">
<footer class="row row-cols-5 py-5 my-5 border-top">
<div class="col">
<h1>This is CS50!</h1>
<p class="text-muted">© 2022 Irfan Salim</p>
</div>
<div class="col">
</div>
<div class="col">
<h5>REACH OUT</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="https://www.facebook.com/itxirfan" class="nav-link p-0 text-muted">Facebook</a></li>
<li class="nav-item mb-2"><a href="https://twitter.com/itxirfan" class="nav-link p-0 text-muted">Twitter</a></li>
<li class="nav-item mb-2"><a href="https://www.instagram.com/itxirfan/" class="nav-link p-0 text-muted">Instagram</a></li>
<li class="nav-item mb-2"><a href="mailto:[email protected]" class="nav-link p-0 text-muted">Email</a></li>
</ul>
</div>
<div class="col">
<h5>LINKS</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="index.html" class="nav-link p-0 text-muted">Home</a></li>
<li class="nav-item mb-2"><a href="life.html" class="nav-link p-0 text-muted">Life</a></li>
<li class="nav-item mb-2"><a href="interests.html" class="nav-link p-0 text-muted">Interests</a></li>
<li class="nav-item mb-2"><a href="feedback.html" class="nav-link p-0 text-muted">Feedback</a></li>
</ul>
</div>
<div class="col">
<h5>CS50 LINKS</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="https://www.edx.org/course/cs50s-introduction-to-computer-science" class="nav-link p-0 text-muted">Take CS50</a></li>
<li class="nav-item mb-2"><a href="https://discord.com/invite/QYZQfZ6" class="nav-link p-0 text-muted">Join CS50 Discord</a></li>
<li class="nav-item mb-2"><a href="https://www.facebook.com/groups/cs50/" class="nav-link p-0 text-muted">CS50 FB Group</a></li>
<li class="nav-item mb-2"><a href="http://www.youtube.com/subscription_center?add_user=cs50tv" class="nav-link p-0 text-muted">CS50 Youtube</a></li>
</ul>
</div>
</footer>
</div>
</body>
</html>