diff options
| -rw-r--r-- | .gitignore | 1 | ||||
| -rw-r--r-- | assets/css/main.css | 120 | ||||
| -rw-r--r-- | content/_index.md | 4 | ||||
| -rw-r--r-- | content/movies/frames/2001.jpg | bin | 0 -> 227058 bytes | |||
| -rw-r--r-- | content/movies/frames/alien.jpg | bin | 0 -> 411720 bytes | |||
| -rw-r--r-- | content/movies/frames/burn_after_reading.jpg | bin | 0 -> 315139 bytes | |||
| -rw-r--r-- | content/movies/frames/ghost_in_the_shell.jpg | bin | 0 -> 370715 bytes | |||
| -rw-r--r-- | content/movies/frames/memories_magnetic_rose.jpg | bin | 0 -> 435345 bytes | |||
| -rw-r--r-- | content/movies/frames/shin_godzilla.jpg | bin | 0 -> 544746 bytes | |||
| -rw-r--r-- | content/movies/frames/stalker.jpg | bin | 0 -> 364296 bytes | |||
| -rw-r--r-- | content/movies/frames/the_big_lebowski.jpg | bin | 0 -> 298723 bytes | |||
| -rw-r--r-- | content/movies/frames/the_thing.jpg | bin | 0 -> 267252 bytes | |||
| -rw-r--r-- | content/movies/index.md | 134 | ||||
| -rw-r--r-- | layouts/_shortcodes/movie.html | 27 | ||||
| -rw-r--r-- | layouts/_shortcodes/movies.html | 10 |
15 files changed, 295 insertions, 1 deletions
@@ -1,2 +1,3 @@ +*.DS_Store *.lock public diff --git a/assets/css/main.css b/assets/css/main.css index 4671b37..5d3e4a5 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -28,3 +28,123 @@ img { max-width: 100%; height: auto; } + +/* Movie list */ + +.movies { + --movie-cols: 1rem 1fr 12rem 4.5rem 5rem; + margin: 1rem 0; +} + +.movies-head, +.movie-plain, +.movie > summary { + display: grid; + grid-template-columns: var(--movie-cols); + align-items: baseline; + gap: 0 0.5rem; + padding: 0.3rem 0; + border-bottom: 1px solid #e2e2dd; +} + +.movies-head { + font-weight: bold; + border-bottom: 2px solid #cccccc; +} + +.movie > summary { + cursor: pointer; + list-style: none; +} + +.movie > summary::-webkit-details-marker { + display: none; +} + +.movie > summary:hover { + background: #f7f7f7; +} + +.movie-caret { + display: inline-block; + color: #888888; + transition: transform 0.1s; +} + +.movie[open] > summary .movie-caret { + transform: rotate(90deg); +} + +.movie-date, +.movie-rating-cell { + white-space: nowrap; +} + +.movie-rating { + position: relative; + display: inline-block; + color: #d0d0cb; + letter-spacing: 0.05em; +} + +.movie-rating::before { + content: "\2605\2605\2605\2605\2605"; +} + +.movie-rating-fill { + position: absolute; + top: 0; + left: 0; + overflow: hidden; + color: #444444; +} + +.movie-rating-fill::before { + content: "\2605\2605\2605\2605\2605"; +} + +.movie-review { + margin: 0 0 0.5rem 1.5rem; + padding: 0.5rem 0.75rem; + border-left: 2px solid #d5d5cf; +} + +.movie-review > :first-child { + margin-top: 0; +} + +.movie-review > :last-child { + margin-bottom: 0; +} + +@media (max-width: 34rem) { + .movies { + --movie-cols: 1rem 1fr 5rem; + } + + .movies-head { + display: none; + } + + .movie-title { + grid-column: 2; + grid-row: 1; + } + + .movie-director { + grid-column: 2; + grid-row: 2; + color: #666666; + } + + .movie-date { + grid-column: 2; + grid-row: 3; + color: #666666; + } + + .movie-rating-cell { + grid-column: 3; + grid-row: 1; + } +} diff --git a/content/_index.md b/content/_index.md index 06e92c7..0049f79 100644 --- a/content/_index.md +++ b/content/_index.md @@ -1 +1,3 @@ -Hello. Right now this website just hosts some notes. I will add more stuff later. +Hello. Right now this website hosts some notes. I will add more stuff later. + +[Movie list](/movies/) diff --git a/content/movies/frames/2001.jpg b/content/movies/frames/2001.jpg Binary files differnew file mode 100644 index 0000000..582871e --- /dev/null +++ b/content/movies/frames/2001.jpg diff --git a/content/movies/frames/alien.jpg b/content/movies/frames/alien.jpg Binary files differnew file mode 100644 index 0000000..6d040a0 --- /dev/null +++ b/content/movies/frames/alien.jpg diff --git a/content/movies/frames/burn_after_reading.jpg b/content/movies/frames/burn_after_reading.jpg Binary files differnew file mode 100644 index 0000000..597d66e --- /dev/null +++ b/content/movies/frames/burn_after_reading.jpg diff --git a/content/movies/frames/ghost_in_the_shell.jpg b/content/movies/frames/ghost_in_the_shell.jpg Binary files differnew file mode 100644 index 0000000..53cae92 --- /dev/null +++ b/content/movies/frames/ghost_in_the_shell.jpg diff --git a/content/movies/frames/memories_magnetic_rose.jpg b/content/movies/frames/memories_magnetic_rose.jpg Binary files differnew file mode 100644 index 0000000..589b009 --- /dev/null +++ b/content/movies/frames/memories_magnetic_rose.jpg diff --git a/content/movies/frames/shin_godzilla.jpg b/content/movies/frames/shin_godzilla.jpg Binary files differnew file mode 100644 index 0000000..d17ae6d --- /dev/null +++ b/content/movies/frames/shin_godzilla.jpg diff --git a/content/movies/frames/stalker.jpg b/content/movies/frames/stalker.jpg Binary files differnew file mode 100644 index 0000000..6ff3975 --- /dev/null +++ b/content/movies/frames/stalker.jpg diff --git a/content/movies/frames/the_big_lebowski.jpg b/content/movies/frames/the_big_lebowski.jpg Binary files differnew file mode 100644 index 0000000..64fde5c --- /dev/null +++ b/content/movies/frames/the_big_lebowski.jpg diff --git a/content/movies/frames/the_thing.jpg b/content/movies/frames/the_thing.jpg Binary files differnew file mode 100644 index 0000000..63c8bb6 --- /dev/null +++ b/content/movies/frames/the_thing.jpg diff --git a/content/movies/index.md b/content/movies/index.md new file mode 100644 index 0000000..ef5f46d --- /dev/null +++ b/content/movies/index.md @@ -0,0 +1,134 @@ ++++ +title = 'Movies' ++++ + +This is an incomplete list of movies I have seen. Any entry with an arrow on the left can be +clicked to reveal additional comments, which may contain spoilers. + +{{< movies >}} + +{{< movie title="2001: A Space Odyssey" director="Stanley Kubrick" released="1968" rating="4.0" >}} +Incredible filmmaking. I did not like the ending. + +Favorite frame: + +{{< /movie >}} + +{{< movie title="Akira" director="Katsuhiro Otomo" released="1988" />}} +{{< movie title="Alien" director="Ridley Scott" released="1979" rating="5.0" >}} +Favorite frame: + +{{< /movie >}} +{{< movie title="Aliens" director="James Cameron" released="1986" rating="4.0" />}} +{{< movie title="American Psycho" director="Mary Harron" released="2000" rating="4.5" />}} +{{< movie title="Arrival" director="Denis Villeneuve" released="2016" rating="4.5" />}} +{{< movie title="Avengers: Endgame" director="Anthony Russo, Joe Russo" released="2019" />}} +{{< movie title="Avengers: Infinity War" director="Anthony Russo, Joe Russo" released="2018" />}} + +{{< movie title="Baby Driver" director="Edgar Wright" released="2017" />}} +{{< movie title="Back to the Future" director="Robert Zemeckis" released="1985" />}} +{{< movie title="Back to the Future Part II" director="Robert Zemeckis" released="1989" />}} +{{< movie title="Blazing Saddles" director="Mel Brooks" released="1974" rating="3.0" />}} +{{< movie title="Burn After Reading" director="Coen brothers" released="2008" rating="3.5" >}} +Favorite frame: + +{{< /movie >}} + +{{< movie title="Crouching Tiger, Hidden Dragon" director="Ang Lee" released="2000" rating="4.0" />}} + +{{< movie title="Donnie Darko" director="Richard Kelly" released="2001" />}} +{{< movie title="Drive" director="Nicolas Winding Refn" released="2011" />}} + +{{< movie title="Everything Everywhere All at Once" director="Daniel Kwan, Daniel Scheinert" released="2022" rating="4.0" />}} +{{< movie title="Eyes Wide Shut" director="Stanley Kubrick" released="1999" />}} + +{{< movie title="Fight Club" director="David Fincher" released="1999" rating="4.0" />}} +{{< movie title="Forrest Gump" director="Robert Zemeckis" released="1994" />}} + +{{< movie title="Ghost in the Shell" director="Mamoru Oshii" released="1995" rating="4.5" >}} +Favorite frame: + +{{< /movie >}} +{{< movie title="Ghostbusters" director="Ivan Reitman" released="1984" />}} +{{< movie title="Good Will Hunting" director="Gus Van Sant" released="1997" rating="4.5" />}} + +{{< movie title="Hereditary" director="Ari Aster" released="2018" rating="1.0" />}} + +{{< movie title="Interstellar" director="Christopher Nolan" released="2014" rating="5.0" />}} + +{{< movie title="Jaws" director="Steven Spielberg" released="1975" />}} +{{< movie title="Joker" director="Todd Phillips" released="2019" />}} +{{< movie title="Judge Dredd" director="Danny Cannon" released="1995" rating="2.5" />}} +{{< movie title="Jurassic Park" director="Steven Spielberg" released="1993" />}} + +{{< movie title="Lars and the Real Girl" director="Craig Gillespie" released="2007" rating="3.5" />}} +{{< movie title="Léon: The Professional" director="Luc Besson" released="1994" />}} + +{{< movie title="Mad Max: Fury Road" director="George Miller" released="2015" />}} +{{< movie title="Memories: Cannon Fodder" director="Katsuhiro Otomo" released="1995" rating="2.0" />}} +{{< movie title="Memories: Magnetic Rose" director="Kōji Morimoto" released="1995" rating="5.0" >}} +A solid science fiction story in 45 minutes. Beautiful visuals and sound. + +Favorite frame: + +{{< /movie >}} +{{< movie title="Memories: Stink Bomb" director="Tensai Okamura" released="1995" rating="4.0" />}} +{{< movie title="Midsommar" director="Ari Aster" released="2019" rating="1.0" />}} + +{{< movie title="No Country for Old Men" director="Coen brothers" released="2007" rating="3.5" />}} + +{{< movie title="Oppenheimer" director="Christopher Nolan" released="2023" rating="3.0" />}} + +{{< movie title="Paprika" director="Satoshi Kon" released="2006" rating="3.5" />}} +{{< movie title="Perfect Blue" director="Satoshi Kon" released="1997" />}} +{{< movie title="Perfect Days" director="Wim Wenders" released="2023" rating="5.0" />}} +{{< movie title="Project Hail Mary" director="Phil Lord, Christopher Miller" released="2026" rating="3.5" />}} +{{< movie title="Prometheus" director="Ridley Scott" released="2012" />}} +{{< movie title="Pulp Fiction" director="Quentin Tarantino" released="1994" rating="3.5" />}} + +{{< movie title="Se7en" director="David Fincher" released="1995" rating="2.5" />}} +{{< movie title="Shin Godzilla" director="Hideaki Anno, Shinji Higuchi" released="2016" rating="5.0" >}} +Favorite frame: + +{{< /movie >}} +{{< movie title="Sicario" director="Denis Villeneuve" released="2015" rating="3.5" />}} +{{< movie title="Spider-Man: Into the Spider-Verse" director="Bob Persichetti, Peter Ramsey, Rodney Rothman" released="2018" />}} +{{< movie title="Stalker" director="Andrei Tarkovsky" released="1979" rating="5.0" >}} +Very beautiful and atmospheric. Slow and suspenseful; give it your full attention when watching. + +Favorite frame: + +{{< /movie >}} + +{{< movie title="Taxi Driver" director="Martin Scorsese" released="1976" rating="4.0" />}} +{{< movie title="The Accountant" director="Gavin O'Connor" released="2016" rating="3.5" />}} +{{< movie title="The Batman" director="Matt Reeves" released="2022" rating="2.5" />}} +{{< movie title="The Big Lebowski" director="Coen brothers" released="1998" rating="5.0" >}} +My favorite comedy. + +Favorite frame: + +{{< /movie >}} +{{< movie title="The Dark Knight" director="Christopher Nolan" released="2008" rating="4.5" />}} +{{< movie title="The Dark Knight Rises" director="Christopher Nolan" released="2012" rating="4.5" />}} +{{< movie title="The Grand Budapest Hotel" director="Wes Anderson" released="2014" />}} +{{< movie title="The Hunger Games" director="Gary Ross" released="2012" />}} +{{< movie title="The Lego Movie" director="Phil Lord, Christopher Miller" released="2014" rating="5.0" />}} +{{< movie title="The Matrix" director="The Wachowskis" released="1999" />}} +{{< movie title="The Royal Tenenbaums" director="Wes Anderson" released="2001" rating="4.0" />}} +{{< movie title="The Shining" director="Stanley Kubrick" released="1980" />}} +{{< movie title="The Thing" director="John Carpenter" released="1982" rating="4.5" >}} +My favorite performance by an animal. + +Favorite frame: + +{{< /movie >}} +{{< movie title="The Wolf of Wall Street" director="Martin Scorsese" released="2013" rating="5.0" />}} +{{< movie title="Titanic" director="James Cameron" released="1997" />}} +{{< movie title="Tokyo Godfathers" director="Satoshi Kon" released="2003" rating="3.5" />}} +{{< movie title="Tropic Thunder" director="Ben Stiller" released="2008" rating="4.0" />}} + +{{< movie title="Vampire Hunter D" director="Toyoo Ashida" released="1985" />}} +{{< movie title="Vampire Hunter D: Bloodlust" director="Yoshiaki Kawajiri" released="2000" rating="4.5" />}} + +{{< /movies >}} diff --git a/layouts/_shortcodes/movie.html b/layouts/_shortcodes/movie.html new file mode 100644 index 0000000..58ac53b --- /dev/null +++ b/layouts/_shortcodes/movie.html @@ -0,0 +1,27 @@ +{{- $review := trim .Inner "\n\r\t " -}} +{{- $rating := "" -}} +{{- with .Get "rating" -}} + {{- $r := float . -}} + {{- $pct := div (mul (math.Min (math.Max $r 0) 5) 100.0) 5 -}} + {{- $rating = printf `<span class="movie-rating" role="img" aria-label="%v out of 5" title="%v / 5"><span class="movie-rating-fill" style="width:%v%%"></span></span>` $r $r $pct | safeHTML -}} +{{- end -}} +{{- if $review -}} +<details class="movie"> + <summary> + <span class="movie-caret">▸</span> + <span class="movie-title">{{ .Get "title" }}</span> + <span class="movie-director">{{ .Get "director" }}</span> + <span class="movie-date">{{ .Get "released" }}</span> + <span class="movie-rating-cell">{{ $rating }}</span> + </summary> + <div class="movie-review">{{ $review | markdownify }}</div> +</details> +{{- else -}} +<div class="movie movie-plain"> + <span></span> + <span class="movie-title">{{ .Get "title" }}</span> + <span class="movie-director">{{ .Get "director" }}</span> + <span class="movie-date">{{ .Get "released" }}</span> + <span class="movie-rating-cell">{{ $rating }}</span> +</div> +{{- end -}} diff --git a/layouts/_shortcodes/movies.html b/layouts/_shortcodes/movies.html new file mode 100644 index 0000000..51d95f7 --- /dev/null +++ b/layouts/_shortcodes/movies.html @@ -0,0 +1,10 @@ +<div class="movies"> + <div class="movies-head"> + <span></span> + <span>Title</span> + <span class="movie-director">Director(s)</span> + <span class="movie-date">Released</span> + <span class="movie-rating-cell">Rating</span> + </div> + {{ .Inner }} +</div> |
