-
Notifications
You must be signed in to change notification settings - Fork 0
/
booklist.html
107 lines (101 loc) · 4.89 KB
/
booklist.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
<!DOCTYPE html>
<html>
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-178635949-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'UA-178635949-1');
</script>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="styles.css" />
<title>Book Awards</title>
</head>
<body>
<div id=navigation-wrapper>
<div id="navigation">
<a href=index.html id="navigation-title">
<h3>Squared Circle</h3>
<img src="favicon.ico">
</a>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="reviews.html">Reviews</a></li>
<li><a href="booklist.html">Book Awards</a></li>
<li><a href="about.html">About</a></li>
</ul>
</div>
</div>
<div class="main_wrapper">
<div class="main">
<h1 class="page-header">Book Awards</h1>
<h2 style="text-align: center;">My top rated books and series!</h2>
</div>
<div class="main2">
<img src="podium.png" class="image" alt="Podium image"><br>
<p style="font-size: larger;">
Here are some of my favorite books ever! I've broken the lists down into my top four most read genres. I tried to think of at least 3 books or series for every category, but some have more.
I hope you enjoy and maybe even get some inspiration for your next read!
</p>
<br><br>
<div id="booklist-wrapper">
<div class="booklist-genre" id="sci-fi-genre">
<h2>Science Fiction</h2>
<p>Science Fiction is probably my favorite genre. I love the science, technology, space, and just dreaming about the future!</p>
<ol>
<li><span class="booklist-book">The Martian</span> by Andy Weir</li><br>
<li><a href="reviews.html#ender">Ender's Game</a> by Orson Scott Card</li><br>
<li><span class="booklist-book">The Hitchhiker's Guide to the Galaxy</span> by Douglas Adams</li>
</ol>
</div>
<div class="booklist-genre" id="fantasy-genre">
<h2>Fantasy</h2>
<p>
Coming in at a close second to sci-fi is fantasy. Personally I have found fantasy books to have some of the best and most exciting stories. Some of the books below could
be in their own category, but I have just decided to lump them all together in fantasy.
</p>
<ol>
<li><span class="booklist-book">The Mortal Instruments (Series)</span> by Cassandra Clare</li><br>
<li><span class="booklist-book">Percy Jackson and the Olympians (Series)</span> by Rick Riordan</li><br>
<li><span class="booklist-book">Harry Potter (Series)</span> by JK Rowling</li><br>
<li><span class="booklist-book">The Arc of a Scythe (Series)</span> by Neal Shusterman</li>
</ol>
</div>
<div class="booklist-genre" id="realistic-genre">
<h2>Realistic Fiction</h2>
<p>These are the feel-good stories that bring me back down to Earth. Life is not always easy, but somehow all of the characters in these books find a way through it.</p>
<ol>
<li><span class="booklist-book">It's Kind of a Funny Story</span> by Ned Vizzini</li><br>
<li><span class="booklist-book">Wonder</span> by RJ Palacio</li><br>
<li><span class="booklist-book">13 Reasons Why</span> by Jay Asher</li><br>
<li><span class="booklist-book">Out of My Mind</span> by Sharon M. Draper</li>
</ol>
</div>
<div class="booklist-genre" id="science-genre">
<h2>Science</h2>
<p>
Quite different from the other genres, this genre is non-fiction. I am immensely interested in space and physics, so all of my top books are related to one or both of those.
I actually have a personal connection to the number one book, because my beloved camp counselor introduced me to it and started me on this whole path of interest.
As with all of my number one books, I highly recommend it.
</p>
<ol>
<li><span class="booklist-book">The Universe in Your Hand</span> by Christophe Galfard</li><br>
<li><span class="booklist-book">Pale Blue Dot</span> by Carl Sagan</li><br>
<li><span class="booklist-book">Astrophysics for People in a Hurry</span> by Neil deGrasse Tyson</li><br>
</ol>
</div>
</div>
<div class="footer" style="position: absolute; left: 0px;">© 2020 - <span id="year"></span></div>
</div>
</div>
</body>
<script>
function toggleSidebar(x) {
document.getElementById("sidebar").classList.toggle("active");
x.classList.toggle("change");
}
document.getElementById("year").innerHTML = new Date().getFullYear();
</script>
</html>