-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathbiography.html
More file actions
272 lines (255 loc) · 13.8 KB
/
biography.html
File metadata and controls
272 lines (255 loc) · 13.8 KB
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
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Biographies - Readlytic</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<h1>Biographies</h1>
<ul id = "lih">
<li><a href="index.html" class="category-link">Home</a></li>
</ul>
</header>
<section>
<h2>Popular Biographies</h2>
<ul>
<div>
<div style="margin-right: 25px;">
<img src="https://assets.onecompiler.app/42vy5gdhb/42vy5hpnx/Wings%20of%20Fire.jpg"
alt="Wings of Fire A.P.J Abdul Kalam and Arun Tiwari"
<a href="#" onclick="BookBG('1');
openModal('Wings of Fire',
'https://assets.onecompiler.app/42vy5gdhb/42vy5hpnx/Wings%20of%20Fire.jpg',
'In Wings of Fire, Dr. A.P.J. Abdul Kalam, the former President of India and renowned scientist, recounts his journey from a humble childhood in a small village to becoming one of the key figures in India\'s space and missile programs. The autobiography is both inspirational and motivational, reflecting on themes of hard work, determination, and the power of dreams in shaping one\'s destiny.',
'https://en.wikipedia.org/wiki/Wings_of_Fire_(autobiography)',
'https://www.google.com/search?q=Books by A.P.J Abdul Kalam and Arun Tiwari',
'https://www.google.com/search?q=Wings of Fire A.P.J Abdul Kalam and Arun Tiwari',
'https://www.amazon.in/Wings-Fire-Autobiography-Arun-Tiwari/dp/8173711461');
return false;">
</div>
<div style="margin-right: 25px;">
<img src="https://assets.onecompiler.app/42vy5gdhb/42vy5hpnx/Steve%20Jobs.jpg"
alt="Steve Jobs by Walter Isaacson"
<a href="#" onclick="BookBG('2');
openModal('Steve Jobs by Walter Isaacson',
'https://assets.onecompiler.app/42vy5gdhb/42vy5hpnx/Steve%20Jobs.jpg',
'Written by Walter Isaacson, Steve Jobs is an authorized biography of the co-founder of Apple Inc., detailing his life from his early years to his revolutionary impact on the world of technology. Through in-depth interviews and research, the book explores Jobs\' genius, his intense drive for perfection, and the controversies surrounding his leadership style. It’s a candid portrayal of a visionary who changed the way we interact with technology.',
'https://en.wikipedia.org/wiki/Steve_Jobs_(book)',
'https://www.google.com/search?q=Books by Walter Isaacson',
'https://www.google.com/search?q=Steve Jobs by Walter Isaacson',
'https://www.amazon.in/STEVE-JOBS-EXCLUSIVE-BIOGRAPHY-Paperback/dp/034914043X');
return false;">
</div>
<div>
<img src="https://assets.onecompiler.app/42vy5gdhb/42vy5hpnx/The%20Diary%20of%20A%20Young%20GIrl.jpg"
alt="The Diary of a Young Girl"
<a href="#" onclick="BookBG('3');
openModal('The Diary of a Young Girl',
'https://assets.onecompiler.app/42vy5gdhb/42vy5hpnx/The%20Diary%20of%20A%20Young%20GIrl.jpg',
'In The Diary of a Young Girl, Anne Frank, a Jewish teenager, chronicles her life in hiding during the Holocaust, documenting her thoughts, fears, and experiences in a secret annex in Amsterdam. Written over two years, her diary is a poignant and powerful reflection on the human spirit, resilience, and the horrors of war. Anne’s words provide a personal, intimate look at life during one of history\'s darkest times.',
'https://en.wikipedia.org/wiki/The_Diary_of_a_Young_Girl',
'https://www.google.com/search?q=Books by Anne Frank',
'https://www.google.com/search?q=The Diary of a Young Girl by Anne Frank',
'https://www.amazon.in/Diary-Young-Girl-Anne-Frank/dp/8172345194');
return false;">
</div>
</div>
<div>
<div style="margin-right: 15px;">
<li>
<a href="https://www.google.com/search?q=Wings of Fire"
class="category-link"
target="_blank">
Wings of Fire
</a>
</li>
</div>
<div style="margin-right: 10px; margin-left: 50px;">
<li>
<a href="https://www.google.com/search?q=Steve Jobs Book by Walter Isaacson"
class="category-link"
target="_blank">
Steve Jobs
</a>
</li>
</div>
<div style="margin-left: 10px;">
<li>
<a href="https://www.google.com/search?q=The Diary of a Young Girl"
class="category-link"
target="_blank">
The Diary of a Young Girl
</a>
</li>
</div>
</div>
<div>
<div style="margin-right: 25px;">
<img src="https://assets.onecompiler.app/42vy5gdhb/42vy5hpnx/Ambedkar%20A%20Life.jpg"
alt="Ambedkar: A Life by Shashi Tharoor"
<a href="#" onclick="BookBG('4');
openModal('Ambedkar: A Life',
'https://assets.onecompiler.app/42vy5gdhb/42vy5hpnx/Ambedkar%20A%20Life.jpg',
'In Ambedkar: A Life, Shashi Tharoor delves into the life of Dr. B.R. Ambedkar, one of India’s most influential social reformers, who championed the rights of the Dalits and played a key role in drafting the Indian Constitution. Tharoor explores Ambedkar\'s journey from his challenging childhood to his emergence as a leader who fought against caste discrimination and for equality. The biography offers a rich narrative of his intellectual and political battles, as well as his legacy in shaping modern India.',
'https://en.wikipedia.org/wiki/Ambedkar:_A_Life',
'https://www.google.com/search?q=Books by Shashi Tharoor',
'https://www.google.com/search?q=Ambedkar: A Life by Shashi Tharoor',
'https://www.amazon.in/Ambedkar-Life-Shashi-Tharoor/dp/9391047505');
return false;">
</div>
<div style="margin-right: 25px;">
<img src="https://assets.onecompiler.app/42vy5gdhb/42vy5hpnx/Einstein.jpg"
alt="Einstein: His Life and Universe by Walter Isaacson"
<a href="#" onclick="BookBG('5');
openModal('Einstein: His Life and Universe',
'https://assets.onecompiler.app/42vy5gdhb/42vy5hpnx/Einstein.jpg',
'In Einstein: His Life and Universe, Walter Isaacson provides an insightful and comprehensive biography of Albert Einstein, exploring not only his groundbreaking contributions to science but also his personal life, passions, and philosophical beliefs. Isaacson traces Einstein’s journey from his early struggles in academia to his theories of relativity, while also shedding light on his complex personality, relationships, and influence on both science and society.',
'https://en.wikipedia.org/wiki/Einstein:_His_Life_and_Universe',
'https://www.google.com/search?q=Books by Walter Isaacson',
'https://www.google.com/search?q=Einstein: His Life and Universe by Walter Isaacson',
'https://www.amazon.in/Einstein-Life-Universe-Walter-Isaacson/dp/1847390544');
return false;">
</div>
<div>
<img src="https://assets.onecompiler.app/42vy5gdhb/42vy5hpnx/Team%20of%20Rivals.jpg"
alt="Team of Rivals"
<a href="#" onclick="BookBG('6');
openModal('Team of Rivals by Doris Kearns Goodwin',
'https://assets.onecompiler.app/42vy5gdhb/42vy5hpnx/Team%20of%20Rivals.jpg',
'In Team of Rivals, Doris Kearns Goodwin examines the leadership of Abraham Lincoln during the American Civil War, focusing on his ability to bring together a group of political rivals to form his cabinet. Through meticulous research and storytelling, Goodwin reveals how Lincoln navigated the political, military, and personal challenges of the time. The book is a powerful study of leadership, collaboration, and the moral courage required to steer a nation through its most difficult period.',
'https://en.wikipedia.org/wiki/Team_of_Rivals',
'https://www.google.com/search?q=Books by Doris Kearns Goodwin',
'https://www.google.com/search?q=Team of Rivals by Doris Kearns Goodwin',
'https://www.amazon.in/Team-Rivals-Political-Abraham-Lincoln/dp/0743270754');
return false;">
</div>
</div>
<div>
<div style="margin-right: 10px;">
<li>
<a href="https://www.google.com/search?q=Ambedkar: A Life"
class="category-link"
target="_blank">
Ambedkar: A Life
</a>
</li>
</div>
<div style="margin-right: 10px;">
<li>
<a href="https://www.google.com/search?q=Einstein: His Life and Universe"
class="category-link"
target="_blank">
Einstein: His Life and Universe
</a>
</li>
</div>
<div>
<li>
<a href="https://www.google.com/search?q=Team of Rivals"
class="category-link"
target="_blank">
Team of Rivals
</a>
</li>
</div>
</div>
</ul>
</section>
<div id="modal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal()">×</span>
<h2 id="modal-title"></h2>
<div class="modal-body">
<div>
<img id="modal-image" src="" alt="Book Image" class="modal-image">
<div class="button-container">
<!-- Wikipedia Button -->
<a href="#" target="_blank" id="spotify-link" class="button">
s<img src="https://assets.onecompiler.app/42vy5gdhb/42xepub3m/Screenshot%202024-11-07%20212533.png" alt="Wikipedia Logo">
</a>
<!-- More from the Author Button -->
<a href="#" target="_blank" id="author-link" class="button">
a<img style="width: 120px;" src="https://assets.onecompiler.app/42vy5gdhb/42xdkqbfy/Screenshot%202024-11-07%20143109.png" alt="Author Logo">
</a>
<!-- Google Button -->
<a href="#" target="_blank" id="google-link" class="button">
g<img src="https://assets.onecompiler.app/42vy5gdhb/42xdkqbfy/Google%20logo.png" alt="Google Logo">
</a>
</div>
<div class="button-container">
<!-- Amazon Button -->
<a href="#" target="_blank" id="amazon-link" style="display: flex;
align-items: center;
padding: 5px 5px;
border: none;
border-radius: 5px;
background-color: #fff;
color: #fff;
font-size: 14px;
text-decoration: none;
transition: background-color 0.3s ease;">
g<img src="https://assets.onecompiler.app/42vy5gdhb/42xkuvscn/buy%20book.png" alt="Amazon Logo" style="height: 50px;
width: 130px;
margin-right: 8px;">
</a>
</div>
</div>
<div class="modal-details">
<p id="modal-description"></p>
</div>
<!-- Button Container -->
</div>
</div>
</div>
<script>
function openModal(title, imageUrl, description, spotifyUrl, authorUrl, googleUrl, amazonUrl) {
document.getElementById('modal').style.display = 'block';
document.getElementById('modal-title').innerText = title;
document.getElementById('modal-image').src = imageUrl;
document.getElementById('modal-description').innerText = description;
// Set the URLs for the buttons
document.getElementById('spotify-link').href = spotifyUrl;
document.getElementById('author-link').href = authorUrl;
document.getElementById('google-link').href = googleUrl;
document.getElementById('amazon-link').href = amazonUrl;
}
function closeModal() {
document.getElementById('modal').style.display = 'none';
}
</script>
<section id="contact">
<h2>Contact Us</h2>
<p>If you have any questions or feedback, feel free to <a href="mailto:readlytic14@gmail.com">email us</a>.</p>
</section>
<footer>
<p>© 2024 Readlytic. All rights reserved.</p>
</footer>
</body>
<script src="genre_color.js"></script>
<script>
const hexcodes = {
1 : "#875E1C",
2 : "#FFFFFF",
3 : "#F2D59D",
4 : "#6C6C6E",
5 : "#EDEEDC",
6 : "#F7E8D1",
7 : "#0E0C0D",
8 : "#00AAD6",
9 : "#00AAD6"
};
function BookBG(book) {
const hex = hexcodes[book];
if (hex) {
// Set the CSS variable --hex-color in the root element (:root)
document.documentElement.style.setProperty('--hex-color', hex);
console.log(document.documentElement.style.getPropertyValue('--hex-color'));
} else {
console.error("Invalid book ID");
}
}
</script>
</html>