Add a couple of books about Chinese
[books.alexwlchan.net] / static / style.css
index 4672f17..51c2c65 100644 (file)
@@ -24,11 +24,15 @@ aside {
   background: url('/static/specktre_tQt7j.png') #333366;
   background-size: auto 100%;
   color: white;
-  padding: 8px 1em;
-  font-size: 12pt;
+  padding: 6px 1em;
+  font-size: 10pt;
   line-height: 1.35em;
 }
 
+aside a {
+  text-decoration: none;
+}
+
 aside h1 {
   margin-top: 0;
   margin-bottom: 0;
@@ -72,9 +76,9 @@ table.book_metadata {
 }
 
 td {
-  padding-right: 8px;
-  padding-top:    2px;
-  padding-bottom: 2px;
+  padding-right: 10px;
+  padding-top:    3px;
+  padding-bottom: 3px;
 }
 
 th {
@@ -97,3 +101,101 @@ footer a {
 footer a:hover {
   background: rgba(128, 128, 128, 0.3);
 }
+
+.review_preview {
+  height: 138px;
+}
+
+.reading {
+  min-height: 138px;
+}
+
+.review_preview, .reading {
+  border: 2px solid #00a892;
+  background: rgba(0, 255, 221, 0.05);
+  border-radius: 6px;
+  margin-bottom: 1em;
+}
+
+.review_fave {
+  background: rgba(0, 255, 221, 0.2);
+}
+
+.review_preview a, .reading_inner {
+  grid-template-columns: 135px auto;
+  display: grid;
+  grid-gap: 8px;
+  height: 100%;
+  width: 100%;
+  color: black;
+  text-decoration: none;
+}
+
+.review_preview a:hover {
+  background: rgba(0, 255, 221, 0.3);
+}
+
+.review_preview img, .reading_inner img {
+  max-width: 120px;
+  max-height: 110px;
+  margin-top: 12px;
+  margin-bottom: 7px;
+  box-shadow: 0px 2.5px 2.5px rgba(0,0,0,0.25);
+}
+
+.book_thumbnail {
+  text-align: center;
+}
+
+.book_metadata {
+  grid-row: 1/1;
+  grid-column: 2/2;
+  display: inline-block;
+  margin-top:    auto;
+  margin-bottom: auto;
+  line-height: 1.25em;
+}
+
+.book_metadata p.title {
+  font-style: italic;
+  font-size: 1.15em;
+  margin-bottom: 0.5em;
+  line-height: 1.2em;
+}
+
+.book_metadata p {
+  margin: 0;
+}
+
+.nav {
+  margin-top: 0;
+}
+
+.nav .selected {
+  font-weight: bold;
+}
+
+.note {
+  margin-left:  1em;
+  margin-right: 1em;
+}
+
+.note p:first-child {
+  margin-top: 0;
+}
+
+.note p:last-child {
+  margin-bottom: 0.75em;
+}
+
+.divider {
+  color: #bbb;
+  text-align: center;
+  font-size: 2em;
+  margin-top:    1em;
+  margin-bottom: 1em;
+}
+
+#jump_to {
+  margin-bottom: -0.5em;
+}