From 2f4fc94af0a2742a49979a4199457f62b37fc5ac Mon Sep 17 00:00:00 2001 From: j-james Date: Mon, 24 May 2021 17:20:54 -0700 Subject: Create bookshelf --- assets/2001-a-space-odyssey.jpg | Bin 0 -> 103668 bytes assets/a-softer-world.png | Bin 0 -> 36665 bytes assets/avatar-the-last-airbender.jpg | Bin 0 -> 73482 bytes assets/blade-runner.jpg | Bin 0 -> 87332 bytes assets/bone.jpg | Bin 0 -> 96981 bytes assets/calvin-and-hobbes.jpg | Bin 0 -> 92197 bytes assets/dr-strangelove.jpg | Bin 0 -> 64438 bytes assets/fahrenheit-451.jpg | Bin 0 -> 48537 bytes assets/hark.png | Bin 0 -> 165918 bytes assets/harrison-bergeron.jpg | Bin 0 -> 16182 bytes assets/harry-potter.jpg | Bin 0 -> 76411 bytes assets/homestuck.svg | 12 +++ assets/ishmael.jpg | Bin 0 -> 64667 bytes assets/my-neighbor-totoro.jpg | Bin 0 -> 82737 bytes assets/narnia.jpg | Bin 0 -> 116354 bytes assets/nineteen-eighty-four.jpeg | Bin 0 -> 38090 bytes assets/notes-from-the-underground.jpg | Bin 0 -> 30384 bytes assets/siddhartha.jpg | Bin 0 -> 80008 bytes assets/slaughterhouse-five.jpg | Bin 0 -> 47780 bytes assets/the-giver.jpg | Bin 0 -> 100392 bytes assets/the-library-of-babel.png | Bin 0 -> 5269 bytes assets/the-lord-of-the-rings.jpg | Bin 0 -> 106179 bytes assets/the-lottery.png | Bin 0 -> 536 bytes assets/the-picture-of-dorian-gray.jpg | Bin 0 -> 84915 bytes assets/the-secret-history.jpg | Bin 0 -> 29624 bytes assets/twilight.jpg | Bin 0 -> 32232 bytes assets/xkcd.png | Bin 0 -> 7695 bytes bookshelf.html | 169 +++++++++++++++++++++++++++++++++- css/bookshelf.css | 53 +++++++++++ 29 files changed, 232 insertions(+), 2 deletions(-) create mode 100644 assets/2001-a-space-odyssey.jpg create mode 100644 assets/a-softer-world.png create mode 100644 assets/avatar-the-last-airbender.jpg create mode 100644 assets/blade-runner.jpg create mode 100644 assets/bone.jpg create mode 100644 assets/calvin-and-hobbes.jpg create mode 100644 assets/dr-strangelove.jpg create mode 100644 assets/fahrenheit-451.jpg create mode 100644 assets/hark.png create mode 100644 assets/harrison-bergeron.jpg create mode 100644 assets/harry-potter.jpg create mode 100644 assets/homestuck.svg create mode 100644 assets/ishmael.jpg create mode 100644 assets/my-neighbor-totoro.jpg create mode 100644 assets/narnia.jpg create mode 100644 assets/nineteen-eighty-four.jpeg create mode 100644 assets/notes-from-the-underground.jpg create mode 100644 assets/siddhartha.jpg create mode 100644 assets/slaughterhouse-five.jpg create mode 100644 assets/the-giver.jpg create mode 100644 assets/the-library-of-babel.png create mode 100644 assets/the-lord-of-the-rings.jpg create mode 100644 assets/the-lottery.png create mode 100644 assets/the-picture-of-dorian-gray.jpg create mode 100644 assets/the-secret-history.jpg create mode 100644 assets/twilight.jpg create mode 100644 assets/xkcd.png create mode 100644 css/bookshelf.css diff --git a/assets/2001-a-space-odyssey.jpg b/assets/2001-a-space-odyssey.jpg new file mode 100644 index 0000000..449ec09 Binary files /dev/null and b/assets/2001-a-space-odyssey.jpg differ diff --git a/assets/a-softer-world.png b/assets/a-softer-world.png new file mode 100644 index 0000000..83d917f Binary files /dev/null and b/assets/a-softer-world.png differ diff --git a/assets/avatar-the-last-airbender.jpg b/assets/avatar-the-last-airbender.jpg new file mode 100644 index 0000000..bbd05cc Binary files /dev/null and b/assets/avatar-the-last-airbender.jpg differ diff --git a/assets/blade-runner.jpg b/assets/blade-runner.jpg new file mode 100644 index 0000000..08a860f Binary files /dev/null and b/assets/blade-runner.jpg differ diff --git a/assets/bone.jpg b/assets/bone.jpg new file mode 100644 index 0000000..58d8c6f Binary files /dev/null and b/assets/bone.jpg differ diff --git a/assets/calvin-and-hobbes.jpg b/assets/calvin-and-hobbes.jpg new file mode 100644 index 0000000..0657fab Binary files /dev/null and b/assets/calvin-and-hobbes.jpg differ diff --git a/assets/dr-strangelove.jpg b/assets/dr-strangelove.jpg new file mode 100644 index 0000000..2d0373e Binary files /dev/null and b/assets/dr-strangelove.jpg differ diff --git a/assets/fahrenheit-451.jpg b/assets/fahrenheit-451.jpg new file mode 100644 index 0000000..7de2c61 Binary files /dev/null and b/assets/fahrenheit-451.jpg differ diff --git a/assets/hark.png b/assets/hark.png new file mode 100644 index 0000000..30525f2 Binary files /dev/null and b/assets/hark.png differ diff --git a/assets/harrison-bergeron.jpg b/assets/harrison-bergeron.jpg new file mode 100644 index 0000000..0367e4d Binary files /dev/null and b/assets/harrison-bergeron.jpg differ diff --git a/assets/harry-potter.jpg b/assets/harry-potter.jpg new file mode 100644 index 0000000..f89148a Binary files /dev/null and b/assets/harry-potter.jpg differ diff --git a/assets/homestuck.svg b/assets/homestuck.svg new file mode 100644 index 0000000..e257591 --- /dev/null +++ b/assets/homestuck.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + \ No newline at end of file diff --git a/assets/ishmael.jpg b/assets/ishmael.jpg new file mode 100644 index 0000000..4b10a38 Binary files /dev/null and b/assets/ishmael.jpg differ diff --git a/assets/my-neighbor-totoro.jpg b/assets/my-neighbor-totoro.jpg new file mode 100644 index 0000000..5db60b5 Binary files /dev/null and b/assets/my-neighbor-totoro.jpg differ diff --git a/assets/narnia.jpg b/assets/narnia.jpg new file mode 100644 index 0000000..faf84f2 Binary files /dev/null and b/assets/narnia.jpg differ diff --git a/assets/nineteen-eighty-four.jpeg b/assets/nineteen-eighty-four.jpeg new file mode 100644 index 0000000..04a1ad6 Binary files /dev/null and b/assets/nineteen-eighty-four.jpeg differ diff --git a/assets/notes-from-the-underground.jpg b/assets/notes-from-the-underground.jpg new file mode 100644 index 0000000..5f4c974 Binary files /dev/null and b/assets/notes-from-the-underground.jpg differ diff --git a/assets/siddhartha.jpg b/assets/siddhartha.jpg new file mode 100644 index 0000000..0963af4 Binary files /dev/null and b/assets/siddhartha.jpg differ diff --git a/assets/slaughterhouse-five.jpg b/assets/slaughterhouse-five.jpg new file mode 100644 index 0000000..f3fcdc4 Binary files /dev/null and b/assets/slaughterhouse-five.jpg differ diff --git a/assets/the-giver.jpg b/assets/the-giver.jpg new file mode 100644 index 0000000..be21020 Binary files /dev/null and b/assets/the-giver.jpg differ diff --git a/assets/the-library-of-babel.png b/assets/the-library-of-babel.png new file mode 100644 index 0000000..5ec5aaf Binary files /dev/null and b/assets/the-library-of-babel.png differ diff --git a/assets/the-lord-of-the-rings.jpg b/assets/the-lord-of-the-rings.jpg new file mode 100644 index 0000000..4593a31 Binary files /dev/null and b/assets/the-lord-of-the-rings.jpg differ diff --git a/assets/the-lottery.png b/assets/the-lottery.png new file mode 100644 index 0000000..d43ea95 Binary files /dev/null and b/assets/the-lottery.png differ diff --git a/assets/the-picture-of-dorian-gray.jpg b/assets/the-picture-of-dorian-gray.jpg new file mode 100644 index 0000000..6ea843a Binary files /dev/null and b/assets/the-picture-of-dorian-gray.jpg differ diff --git a/assets/the-secret-history.jpg b/assets/the-secret-history.jpg new file mode 100644 index 0000000..dd5cd5e Binary files /dev/null and b/assets/the-secret-history.jpg differ diff --git a/assets/twilight.jpg b/assets/twilight.jpg new file mode 100644 index 0000000..12d41d8 Binary files /dev/null and b/assets/twilight.jpg differ diff --git a/assets/xkcd.png b/assets/xkcd.png new file mode 100644 index 0000000..b2a5482 Binary files /dev/null and b/assets/xkcd.png differ diff --git a/bookshelf.html b/bookshelf.html index 491302e..aaba135 100644 --- a/bookshelf.html +++ b/bookshelf.html @@ -6,6 +6,7 @@ +
@@ -19,7 +20,171 @@ bookshelf
-
- Under Construction +
+

Philosophy

+
+
+ +

Ishmael

+ Daniel Quinn +
+
+ +

Notes from the Underground

+ Fyodor Dostoevsky +
+
+ +

Slaughterhouse-Five

+ Kurt Vonnegut +
+ +
+
+ +

Romantic

+
+ +
+ +

Twilight

+ Stephenie Meyer +
+
+ +

The Picture of Dorian Gray

+ Oscar Wilde +
+
+ +

The Secret History

+ Donna Tartt +
+
+
+

Dystopian

+
+
+ +

The Giver

+ Lois Lowry +
+
+ +

Fahrenheit 451

+ Ray Bradbury +
+
+ +

Nineteen Eighty-Four

+ George Orwell +
+
+
+

Fantasy

+
+
+ +

Narnia

+ C.S. Lewis +
+
+ +

Harry Potter

+ J.K. Rowling +
+
+ +

The Lord of the Rings

+ J.R.R. Tolkin +
+
+
+

Short Stories

+
+
+ +

The Library of Babel

+ Jorge Luis Borges +
+
+ +

The Lottery

+ Shirley Jackson +
+
+ +

Harrison Bergeron

+ Kurt Vonnegut +
+
+
+

Comics

+
+ +
+ +

Calvin and Hobbes

+ Bill Watterson +
+
+ +

BONE

+ Jeff Smith +
+
+ +

Homestuck

+ Andrew Hussie +
+
+ +

Hark! a Vagrant

+ Kate Beaton +
+
+ +

a softer world

+ Emily Horne and Joey Comeau +
+
+ +

xkcd

+ Randall Munroe +
+
+
+

Media

+
+
+ +

2001: A Space Odyssey

+
+
+ +

Blade Runner

+
+
+ +

Dr. Strangelove

+
+
+ +

Avatar: The Last Airbender

+
+
+ +

My Neighbor Totoro

+
+
+
+
+ diff --git a/css/bookshelf.css b/css/bookshelf.css new file mode 100644 index 0000000..b8795fa --- /dev/null +++ b/css/bookshelf.css @@ -0,0 +1,53 @@ +a { + color: inherit; +} + +h2 { + margin-bottom: 4px; +} + +hr { + background: black; + height: 6px; + margin-bottom: 20px; +} + +.cover, .poster, .icon { + max-height: 250px; + /* max-width: 165px; */ + max-width: 200px; + border-radius: 10px; +} + +.cover { + border: 2px solid black; + box-shadow: 8px 8px grey; +} + +.icon { + filter: drop-shadow(0px 0px 2px black); +} + +.shelf { + display: flex; + flex-direction: row; + justify-content: space-around; + text-align: center; + align-items: flex-end; + flex-wrap: wrap; +} + +.shelf div { + margin-right: 1em; + margin-top: 20px; +} + +.shelf h3 { + margin-bottom: 0px; +} + +@media screen and (max-width: 700px) { + h2 { + text-align: center; + } +} -- cgit v1.2.3-70-g09d2