Organize bookshelf assets

1 files changed, 60 insertions, 63 deletions

diff --git a/bookshelf.html b/bookshelf.html
index afabdf2..7387b9c 100644
--- a/bookshelf.html
+++ b/bookshelf.html
@@ -21,44 +21,15 @@
 		</nav>
 	</header>
 	<main>
-		<h2>Philosophy</h2>
-		<div class="shelf" id="philosophy">
+		<h2>Classics</h2>
+		<div class="shelf" id="classics">
 			<div>
-				<img src="assets/ishmael.jpg" class="cover"/>
-				<h3>Ishmael</h3>
-				<i>Daniel Quinn</i>
-			</div>
-			<div>
-				<img src="assets/notes-from-the-underground.jpg" class="cover"/>
-				<h3>Notes from the Underground</h3>
-				<i>Fyodor Dostoevsky</i>
-			</div>
-			<div>
-				<img src="assets/slaughterhouse-five.jpg" class="cover"/>
-				<h3>Slaughterhouse-Five</h3>
-				<i>Kurt Vonnegut</i>
-			</div>
-			<div>
-				<img src="assets/siddhartha.jpg" class="cover"/>
-				<h3>Siddhartha</h3>
-				<i>Hermann Hesse</i>
-			</div>
-			<div>
-				<img src="assets/catch-22.jpg" class="cover"/>
-				<h3>Catch-22</h3>
-				<i>Joseph Heller</i>
-			</div>
-		</div>
-		<hr>
-		<h2>Romantic</h2>
-		<div class="shelf" id="academia">
-			<div>
-				<img src="assets/the-picture-of-dorian-gray.jpg" class="cover"/>
+				<img src="assets/books/the-picture-of-dorian-gray.jpg" class="cover"/>
 				<h3>The Picture of Dorian Gray</h3>
 				<i>Oscar Wilde</i>
 			</div>
 			<div>
-				<img src="assets/the-secret-history.jpg" class="cover"/>
+				<img src="assets/books/the-secret-history.jpg" class="cover"/>
 				<h3>The Secret History</h3>
 				<i>Donna Tartt</i>
 			</div>
@@ -67,60 +38,89 @@
 		<h2>Dystopian</h2>
 		<div class="shelf" id="dystopia">
 			<div>
-				<img src="assets/the-giver.jpg" class="cover"/>
+				<img src="assets/books/the-giver.jpg" class="cover"/>
 				<h3>The Giver</h3>
 				<i>Lois Lowry</i>
 			</div>
 			<div>
-				<img src="assets/fahrenheit-451.jpg" class="cover"/>
+				<img src="assets/books/fahrenheit-451.jpg" class="cover"/>
 				<h3>Fahrenheit 451</h3>
 				<i>Ray Bradbury</i>
 			</div>
-			<div>
-				<img src="assets/nineteen-eighty-four.jpeg" class="cover"/>
+			<!-- <div>
+				<img src="assets/books/nineteen-eighty-four.jpeg" class="cover"/>
 				<h3>Nineteen Eighty-Four</h3>
 				<i>George Orwell</i>
-			</div>
+			</div> -->
 			<div>
-				<img src="assets/the-handmaids-tale.jpg" class="cover"/>
+				<img src="assets/books/the-handmaids-tale.jpg" class="cover"/>
 				<h3>The Handmaid's Tale</h3>
 				<i>Margaret Atwood</i>
 			</div>
 		</div>
 		<hr>
+		<h2>Philosophy</h2>
+		<div class="shelf" id="philosophy">
+			<div>
+				<img src="assets/books/ishmael.jpg" class="cover"/>
+				<h3>Ishmael</h3>
+				<i>Daniel Quinn</i>
+			</div>
+			<div>
+				<img src="assets/books/notes-from-the-underground.jpg" class="cover"/>
+				<h3>Notes from the Underground</h3>
+				<i>Fyodor Dostoevsky</i>
+			</div>
+			<div>
+				<img src="assets/books/slaughterhouse-five.jpg" class="cover"/>
+				<h3>Slaughterhouse-Five</h3>
+				<i>Kurt Vonnegut</i>
+			</div>
+			<div>
+				<img src="assets/books/siddhartha.jpg" class="cover"/>
+				<h3>Siddhartha</h3>
+				<i>Hermann Hesse</i>
+			</div>
+			<div>
+				<img src="assets/books/catch-22.jpg" class="cover"/>
+				<h3>Catch-22</h3>
+				<i>Joseph Heller</i>
+			</div>
+		</div>
+		<hr>
 		<h2>Fantasy</h2>
 		<div class="shelf" id="fantasy">
 			<div>
-				<img src="assets/narnia.jpg" class="cover"/>
+				<img src="assets/books/narnia.jpg" class="cover"/>
 				<h3>Narnia</h3>
 				<i>C.S. Lewis</i>
 			</div>
 			<div>
-				<img src="assets/harry-potter.jpg" class="cover"/>
+				<img src="assets/books/harry-potter.jpg" class="cover"/>
 				<h3>Harry Potter</h3>
 				<i>J.K. Rowling</i>
 			</div>
 			<div>
-				<img src="assets/the-lord-of-the-rings.jpg" class="cover"/>
+				<img src="assets/books/the-lord-of-the-rings.jpg" class="cover"/>
 				<h3>The Lord of the Rings</h3>
-				<i>J.R.R. Tolkin</i>
+				<i>J.R.R. Tolkien</i>
 			</div>
 		</div>
 		<hr>
 		<h2>Short Stories</h2>
 		<div class="shelf" id="short-stories">
 			<div>
-				<img src="assets/the-library-of-babel.png" class="icon"/>
+				<img src="assets/books/the-library-of-babel.png" class="icon"/>
 				<h3>The Library of Babel</h3>
 				<i>Jorge Luis Borges</i>
 			</div>
 			<div>
-				<img src="assets/the-lottery.png" class="icon"/>
+				<img src="assets/books/the-lottery.png" class="icon"/>
 				<h3>The Lottery</h3>
 				<i>Shirley Jackson</i>
 			</div>
 			<div>
-				<img src="assets/harrison-bergeron.jpg" style="width: 80px;" class="icon"/>
+				<img src="assets/books/harrison-bergeron.jpg" style="width: 80px;" class="icon"/>
 				<h3>Harrison Bergeron</h3>
 				<i>Kurt Vonnegut</i>
 			</div>
@@ -129,42 +129,42 @@
 		<h2>Comics</h2>
 		<div class="shelf" id="comics">
 			<div>
-				<img src="assets/calvin-and-hobbes.jpg" class="cover"/>
+				<img src="assets/comics/calvin-and-hobbes.jpg" class="cover"/>
 				<h3>Calvin and Hobbes</h3>
 				<i>Bill Watterson</i>
 			</div>
 			<div>
-				<img src="assets/bone.jpg" class="cover"/>
+				<img src="assets/books/bone.jpg" class="cover"/>
 				<h3>BONE</h3>
 				<i>Jeff Smith</i>
 			</div>
 			<div>
-				<img src="assets/copper.jpg" class="cover"/>
+				<img src="assets/comics/copper.jpg" class="cover"/>
 				<h3><a href="https://www.boltcityproductions.com/copper/">Copper</a></h3>
 				<i>Kazu Kibuishi</i>
 			</div>
 			<div>
-				<img src="assets/hark.png" class="cover"/>
+				<img src="assets/comics/hark.png" class="cover"/>
 				<h3><a href="http://www.harkavagrant.com/">Hark! a Vagrant</a></h3>
 				<i>Kate Beaton</i>
 			</div>
 			<div>
-				<img src="assets/homestuck.svg" class="icon"/>
+				<img src="assets/comics/homestuck.svg" class="icon"/>
 				<h3><a href="https://homestuck.com">Homestuck</a></h3>
 				<i>Andrew Hussie</i>
 			</div>
 			<div>
-				<img src="assets/avasdemon.jpg" class="cover"/>
+				<img src="assets/comics/avasdemon.jpg" class="cover"/>
 				<h3><a href="https://www.avasdemon.com/">Ava's Demon</a></h3>
 				<i>Michelle Czajkowski</i>
 			</div>
 			<div>
-				<img src="assets/a-softer-world.png" class="icon"/>
+				<img src="assets/comics/a-softer-world.png" class="icon"/>
 				<h3><a href="https://www.asofterworld.com/">a softer world</a></h3>
 				<i>Emily Horne and Joey Comeau</i>
 			</div>
 			<div>
-				<img src="assets/xkcd.png" class="icon"/>
+				<img src="assets/comics/xkcd.png" class="icon"/>
 				<h3><a href="https://xkcd.com/">xkcd</a></h3>
 				<i>Randall Munroe</i>
 			</div>
@@ -173,34 +173,31 @@
 		<h2>Media</h2>
 		<div class="shelf" id="media">
 			<div>
-				<img src="assets/2001-a-space-odyssey.jpg" class="poster"/>
+				<img src="assets/posters/2001-a-space-odyssey.jpg" class="poster"/>
 				<p><h3>2001: A Space Odyssey</h3></p>
 			</div>
 			<div>
-				<img src="assets/blade-runner.jpg" class="poster"/>
+				<img src="assets/posters/blade-runner.jpg" class="poster"/>
 				<p><h3>Blade Runner</h3></p>
 			</div>
 			<div>
-				<img src="assets/dr-strangelove.jpg" class="poster"/>
+				<img src="assets/posters/dr-strangelove.jpg" class="poster"/>
 				<p><h3>Dr. Strangelove</h3></p>
 			</div>
 			<div>
-				<img src="assets/avatar-the-last-airbender.jpg" class="poster"/>
+				<img src="assets/posters/avatar-the-last-airbender.jpg" class="poster"/>
 				<p><h3>Avatar: The Last Airbender</h3></p>
 			</div>
 			<div>
-				<img src="assets/coraline.jpg" class="poster"/>
+				<img src="assets/posters/coraline.jpg" class="poster"/>
 				<p><h3>Coraline</h3></p>
 			</div>
 			<div>
-				<img src="assets/my-neighbor-totoro.jpg" class="poster"/>
+				<img src="assets/posters/my-neighbor-totoro.jpg" class="poster"/>
 				<p><h3>My Neighbor Totoro</h3></p>
 			</div>
 		</div>
 		<hr>
 	</main>
-	<footer>
-		<p> © 2020-2021 j-james </p>
-	</footer>
 </body>
 </html>