From b41b2bac3df813f56226e0a7b9c1a56379adfb08 Mon Sep 17 00:00:00 2001 From: Campbell Alden Date: Wed, 24 Aug 2022 14:31:59 +0900 Subject: [PATCH] Style reviews --- content/reviews/the-french-dispatch.md | 6 ++-- docs/quick_look.css | 1 - layouts/partials/head.html | 1 + layouts/reviews/single.html | 10 +++--- static/quick_look.css | 1 - static/review.css | 46 ++++++++++++++++++++++++++ static/style.css | 3 -- 7 files changed, 56 insertions(+), 12 deletions(-) create mode 100644 static/review.css diff --git a/content/reviews/the-french-dispatch.md b/content/reviews/the-french-dispatch.md index d0d1b5e..a5dac99 100644 --- a/content/reviews/the-french-dispatch.md +++ b/content/reviews/the-french-dispatch.md @@ -30,7 +30,7 @@ I really enjoyed how the dynamic between the artist prisoner character (Benicio ### The Art -Another moment I enjoyed was the discussion about modern art. There's a funny commentary on the idea that "a third grader could have made this", wherein they discuss his arts validity and make the claim that because he has techinical prowess (the ability to draw a realistic picture of a bird) his more modern style is somehow valid. The sort of mental gymnastics that the art collectors go through to justify why the art is the next best thing works as a commentary on art in general in a way I liked. +Another moment I enjoyed was the discussion about modern art. There's a funny commentary on the idea that "a third grader could have made this", wherein they discuss his arts validity and make the claim that because he has technical prowess (the ability to draw a realistic picture of a bird) his more modern style is somehow valid. The sort of mental gymnastics that the art collectors go through to justify why the art is the next best thing works as a commentary on art in general in a way I liked. ### The Revolutionary Students @@ -38,8 +38,8 @@ I have quite a soft spot for chess, so the sections of the magazine following th ### The Dinner Party Kidnapping -I felt the storyline where the author recounts the dinner party kidnapping was honestly the weakest part of the film. For me it's a combination of not really liking that cartoon style (and this is partially why I haven't made it through Isle of Dogs yet dispite that on the surface seeming like a perfect fit for me.) The other issue I have with it was pointed out in a review I read, which I will paraphrase as being too many layers deep. +I felt the storyline where the author recounts the dinner party kidnapping was honestly the weakest part of the film. For me it's a combination of not really liking that cartoon style (and this is partially why I haven't made it through Isle of Dogs yet despite that on the surface seeming like a perfect fit for me.) The other issue I have with it was pointed out in a review I read, which I will paraphrase as being too many layers deep. The story is told in the setting of a section of the magazine, but in retrospective as spoken by the author on the set of a talk show. Then we have the actual story which has aspects of live action and cartoon. The cartoon scenes feel nested within the live action for a total depth 4 levels removed from the viewer. It just makes things a little difficult to follow. That style of storytelling can work: I loved _If on a Winter's Night a Traveler_ by _Italio Calvino_ which relies heavily on this nesting of view points, but the first chapter of that book is incredibly jarring as you get accustomed to the style. -I think because this section stands alone and is tonally different from the rest of the movie, you don't have time to get over that jarring feeling to orient yourself. I think as a stand alone short it might work, and it's just it's presence in this larger narrative that makes it feel especially awkard tonally. For me, this discordance is the main reason I feel this movie is more of a 4/5 than a perfect 5/7. +I think because this section stands alone and is tonally different from the rest of the movie, you don't have time to get over that jarring feeling to orient yourself. I think as a stand alone short it might work, and it's just it's presence in this larger narrative that makes it feel especially awkward tonally. For me, this discordance is the main reason I feel this movie is more of a 4/5 than a perfect 5/7. diff --git a/docs/quick_look.css b/docs/quick_look.css index ae474f1..2ae99e4 100644 --- a/docs/quick_look.css +++ b/docs/quick_look.css @@ -1,6 +1,5 @@ .quicklook { max-width: 600px; - flex-basis: 600px; border-radius: 16px; background: #F4C2CD; color: #702E2E; diff --git a/layouts/partials/head.html b/layouts/partials/head.html index dbd51c9..b389358 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -5,6 +5,7 @@ + diff --git a/layouts/reviews/single.html b/layouts/reviews/single.html index 6caa4d5..410ec1b 100644 --- a/layouts/reviews/single.html +++ b/layouts/reviews/single.html @@ -1,13 +1,15 @@ {{ define "main" }}
-
-

{{- .Title -}}

+
{{ if .Params.image }} - Poster +
+ Poster +
{{ end }} +

{{- .Title -}}

{{ partial "quicklook.html" . }}
-
+
{{- .Content -}}
diff --git a/static/quick_look.css b/static/quick_look.css index ae474f1..2ae99e4 100644 --- a/static/quick_look.css +++ b/static/quick_look.css @@ -1,6 +1,5 @@ .quicklook { max-width: 600px; - flex-basis: 600px; border-radius: 16px; background: #F4C2CD; color: #702E2E; diff --git a/static/review.css b/static/review.css new file mode 100644 index 0000000..96d18cf --- /dev/null +++ b/static/review.css @@ -0,0 +1,46 @@ +.review { + max-width: 800px; + display: flex; + flex-direction: column; + align-items: center; +} + +.review-header { + display: flex; + flex-direction: column; + align-items: center; + gap: 30px; + margin: 30px 0; +} + +.review-header h1 { + text-align: center; +} + +.review-poster { + aspect-ratio: 1/1; + flex-basis: 200px; + max-width: 200px; + overflow: hidden; + border-radius: 8px; +} + +.review-poster > img { + position: relative; + width: 100%; + height: 100%; + object-fit: cover; +} + +.core-review { + margin: 30px 10px; +} +.core-review p { + margin-bottom: 20px; +} + +.core-review h2,h3,h4,h5 { + margin-top: 30px; + margin-bottom: 10px; + text-align: center; +} diff --git a/static/style.css b/static/style.css index 27d210a..5820b99 100644 --- a/static/style.css +++ b/static/style.css @@ -212,6 +212,3 @@ a:hover { padding: 10px; } -.review { - max-width: 800px; -}