fix html minification
[books.alexwlchan.net] / static / style.css
1 body {
2   margin: 0;
3   padding: 0;
4   font: 12pt monospace;
5   line-height: 1.55em;
6
7   /* Background from https://www.toptal.com/designers/subtlepatterns/light-paper-fibers/ */
8   background: url('/static/lightpaperfibers.png');
9 }
10
11 h1 {
12   line-height: 1.15em;
13 }
14
15 h1 .book-title {
16   font-style: italic;
17 }
18
19 .book-cover img {
20   float: right;
21   max-width:  180px;
22   max-height: 240px;
23   margin-top: 10px;
24   margin-left: 10px;
25   margin-bottom: 10px;
26   box-shadow: 0px 5px 5px rgba(0,0,0,0.25);
27 }
28
29 @media screen and (max-width: 500px) {
30   .book-cover img {
31     max-width: 90px;
32   }
33 }
34
35 aside {
36   color: white;
37   font-size: 13pt;
38   line-height: 1.35em;
39   margin-bottom: 2em;
40 }
41
42 aside #fallback_background, aside #shelf_background {
43   position: absolute;
44   top: 0;
45   left: 0;
46   width: 100%;
47 }
48
49 aside #fallback_background {
50   background: #666666;
51   height: 30px;
52   z-index: 1;
53 }
54
55 aside #shelf_background {
56   background-size: auto 100%;
57   height: 45px;
58   z-index: 2;
59 }
60
61 aside #aside_inner {
62   padding: 3px 1em;
63 }
64
65 aside a {
66   text-decoration: none;
67 }
68
69 aside img {
70   height: 30px;
71   margin-bottom: -8px;
72   margin-top:    -2px;
73 }
74
75 aside h1 {
76   margin-top: 0;
77   margin-bottom: 0;
78   display: inline;
79   font-size: 1em;
80 }
81
82 main, aside #aside_inner, footer #footer_inner {
83   max-width: 780px;
84   margin-left:  auto;
85   margin-right: auto;
86 }
87
88 main {
89   padding: 1em;
90 }
91
92 a {
93   color: black;
94 }
95
96 a:hover {
97   background: rgba(0, 0, 0, 0.3);
98 }
99
100 aside a {
101   color: white;
102 }
103
104 aside a:hover {
105   background: rgba(255, 255, 255, 0.3);
106 }
107
108 table.book_metadata {
109   border-collapse: collapse;
110   margin-bottom: 1em;
111 }
112
113 td {
114   padding-right: 10px;
115   padding-top:    3px;
116   padding-bottom: 3px;
117 }
118
119 th {
120   text-align: left;
121 }
122
123 footer {
124   border-top: 0.25px solid #bfbfbf;
125   color: #999;
126   font-size: 0.75em;
127   margin-top: 2em;
128   padding: 1em;
129   padding-bottom: 2em;
130 }
131
132 footer a {
133   color: gray;
134 }
135
136 footer a:hover {
137   background: rgba(128, 128, 128, 0.3);
138 }
139
140 .review_preview, .reading {
141   border: 2px solid;
142   border-radius: 6px;
143   margin-bottom: 1em;
144 }
145
146 .review_fave {
147   background: rgba(0, 255, 221, 0.2);
148 }
149
150 .review_preview a, .reading_inner {
151   grid-template-columns: 135px auto;
152   display: grid;
153   grid-gap: 8px;
154   height: 100%;
155   width: 100%;
156   color: black;
157   text-decoration: none;
158   min-height: 157px;
159 }
160
161 .review_preview a:hover {
162   background: rgba(0, 255, 221, 0.3);
163 }
164
165 .review_preview img, .reading_inner img {
166   max-width: 110px;
167   max-height: 130px;
168 /*  margin-top: 12px;
169   margin-bottom: 7px;*/
170   box-shadow: 0px 2.5px 2.5px rgba(0,0,0,0.25);
171   vertical-align: middle;
172 }
173
174 .thumbnail_helper {
175   display: inline-block;
176   height: 100%;
177   vertical-align: middle;
178 }
179
180 .book_thumbnail {
181   text-align: center;
182 }
183
184 .book_metadata {
185   grid-row: 1/1;
186   grid-column: 2/2;
187   display: inline-block;
188   margin-top:    auto;
189   margin-bottom: auto;
190   line-height: 1.25em;
191   padding-right: 10px;
192   padding-top:    10px;
193   padding-bottom: 10px;
194 }
195
196 .book_metadata p.title {
197   font-style: italic;
198   font-size: 1.15em;
199   margin-bottom: 0.5em;
200   line-height: 1.3em;
201 }
202
203 .book_metadata .did_not_finish {
204   font-weight: normal;
205 }
206
207 .book_metadata p {
208   margin: 0;
209 }
210
211 .nav .selected {
212   font-weight: bold;
213 }
214
215 .note {
216   margin-left:  1em;
217   margin-right: 1em;
218 }
219
220 .note p:first-child {
221   margin-top: 0;
222 }
223
224 .note p:last-child {
225   margin-bottom: 0.75em;
226 }
227
228 .divider {
229   text-align: center;
230   margin-top:    1.5em;
231   margin-bottom: 1em;
232 }
233
234 .divider img {
235   width: 50px;
236 }
237
238 #jump_to {
239   margin-bottom: -0.5em;
240 }
241
242 .star_rating {
243   font-size: 100%;
244   letter-spacing: 4px;
245 }
246
247 @media screen and (max-width: 500px) {
248   .review_preview img, .reading_inner img {
249     max-width: 250px;
250     max-height: 150px;
251     margin-bottom: 0;
252   }
253
254   .review_preview a, .reading_inner {
255     grid-template-columns: auto;
256   }
257
258   .book_thumbnail {
259     grid-column: 1/1;
260     grid-row: 1/2;
261   }
262
263   .book_metadata {
264     grid-column: 1/1;
265     grid-row: 2/2;
266     padding: 15px;
267     padding-top: 0;
268   }
269 }