From fcb3b42bc73ec2f76234f0fd91fd89284ee81e61 Mon Sep 17 00:00:00 2001 From: Emilia Allison Date: Sat, 9 Nov 2024 13:40:48 -0600 Subject: [PATCH] Update books styling --- src/cool-stuff/books.html | 33 ++++++++++++++++----- src/scss/books.scss | 26 ++++++++++++++++ src/scss/waltuh/components/_book_entry.scss | 21 +++++++++++-- 3 files changed, 71 insertions(+), 9 deletions(-) create mode 100644 src/scss/books.scss diff --git a/src/cool-stuff/books.html b/src/cool-stuff/books.html index 6605bf1..279a945 100644 --- a/src/cool-stuff/books.html +++ b/src/cool-stuff/books.html @@ -2,7 +2,7 @@ Emilia Allison - + @@ -13,7 +13,7 @@

Books

-

primarily those that I've read

+

primarily those that I've read

I wouldn't say that I read a lot. This page exists because I am generally dissatisfied will Goodreads @@ -21,7 +21,7 @@ My commentary may or may not include spoilers (clearly marked). The contents are placed here in no particular order.

-

+

the books

@@ -46,6 +46,25 @@
+
+
+

The Message

+
+

Ta-Nehisi Coates

+

2024

+

8

+

+ I really enjoyed the prose in this book; + the elegance of the author's descriptions + served, in my opinion, to enhance the message + of one of the core themes. + I do indeed find myself haunted by this book, + for which I am glad. +

+
+
+
+

Cowboy, Cross My Heart

@@ -93,7 +112,7 @@

1969

8

- Messiah is far more philosophical than Dune. + Messiah is more philosophical than Dune. Herbert's anti-theocracy and anti-autocracy messaging is far stronger here. One might say that Herbert's rejection of charismatically driven tyranny was prescient. @@ -108,7 +127,7 @@

Frank Herbert

1976

-

7.5

+

6

In my mind, Children of Dune exists almost solely to set up its sequel. This book has some very uncomfortable moments @@ -144,7 +163,7 @@

Frank Herbert

1984

-

6.5

+

5

How I adore Herbert's writing of women. There are many interesting ideas in Heretics, @@ -167,7 +186,7 @@

William Gibson

1984

-

7

+

5

Although I found it hard to follow at times, Neuromancer's numerous contributions (if not outright creation of) to the genre diff --git a/src/scss/books.scss b/src/scss/books.scss new file mode 100644 index 0000000..7cead34 --- /dev/null +++ b/src/scss/books.scss @@ -0,0 +1,26 @@ +@use "waltuh/waltuh"; +@use "waltuh/variables"; // Needed to extend ff-serif + +h1 { + @extend .ff-serif; + @extend .fs-700; +} + +h3 { + @extend .ff-serif; + @extend .fs-500; +} + +h2 { + @extend .ff-serif; + @extend .fs-500; +} + +details > div { + @extend .padding-low-top; +} + +p { + @extend .ff-sans; + @extend .fs-300; +} diff --git a/src/scss/waltuh/components/_book_entry.scss b/src/scss/waltuh/components/_book_entry.scss index 1fc8f17..a6f36f5 100644 --- a/src/scss/waltuh/components/_book_entry.scss +++ b/src/scss/waltuh/components/_book_entry.scss @@ -5,6 +5,7 @@ .book-entry { width: 100%; position: relative; + margin-bottom: 1vh !important; &:last-of-type { margin-bottom: 5vh; } @@ -15,23 +16,38 @@ } div { display: grid; - grid-template-columns: 1fr 1fr 1fr; + grid-template-columns: 1fr 0.5fr 1fr; grid-template-rows: max-content 1fr; grid-template-areas: "author year score" - "comments comments comments" + "comments comments comments"; + + padding: 2%; + padding-top: 0px; + } + + &[open] { + border: 2px solid; + border-top: none; } } } .book-entry__author { grid-area: author; + justify-self: end; + font-family: "Inconsolata", monospace; } .book-entry__year { grid-area: year; + justify-self: center; + font-family: "Inconsolata", monospace; } .book-entry__score { + grid-area: score; + justify-self: start; + font-family: "Inconsolata", monospace; &:before { content: "Score: "; } @@ -41,4 +57,5 @@ } .book-entry__comments { grid-area: comments; + padding-top: 0.5rem; }