diff --git a/package-lock.json b/package-lock.json
index d8c5e114..b8561265 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
{
"name": "coryd.dev",
- "version": "16.4.2",
+ "version": "16.5.0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "coryd.dev",
- "version": "16.4.2",
+ "version": "16.5.0",
"license": "MIT",
"dependencies": {
"@cdransf/api-text": "^1.2.2",
diff --git a/package.json b/package.json
index 5f8bbf17..da394397 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "coryd.dev",
- "version": "16.4.2",
+ "version": "16.5.0",
"description": "The source for my personal site. Built using 11ty.",
"type": "module",
"scripts": {
diff --git a/src/_data/movies.js b/src/_data/movies.js
index 7bdbab74..c98f57a7 100644
--- a/src/_data/movies.js
+++ b/src/_data/movies.js
@@ -63,7 +63,7 @@ export default async function () {
}).filter(movie => watched ? movie['lastWatched'] : !movie['lastWatched'])
const favoriteMovies = movies.filter(movie => movie['favorite'])
const collectedMovies = movies.filter(movie => movie['collected'])
- const recentlyWatchedMovies = movies.filter(movie => movie['last_watched']).sort((a, b) => new Date(b['last_watched']) - new Date(a['last_watched'])).slice(0, 6)
+ const recentlyWatchedMovies = movies.filter(movie => movie['last_watched']).sort((a, b) => new Date(b['last_watched']) - new Date(a['last_watched']))
return {
movies: [...formatMovieData(movies), ...formatMovieData(movies, false)],
diff --git a/src/_includes/base.liquid b/src/_includes/base.liquid
index 0b6d7977..005c34ae 100644
--- a/src/_includes/base.liquid
+++ b/src/_includes/base.liquid
@@ -9,19 +9,19 @@
{% endif %}
{%- endcapture -%}
{%- capture ogImage -%}
- {% if schema == 'blog' %}
+ {%- if schema == 'blog' -%}
{{ meta.url }}/assets/img/ogi/{{ title | slugifyString }}-preview.png
- {% elsif schema == 'music' %}
+ {%- elsif schema == 'music' -%}
{{ music.recent.artists[0].image }}
- {% elsif schema == 'watching' %}
+ {%- elsif schema == 'watching' -%}
{%- assign featuredMovie = movies.recentlyWatched | first -%}
{{ featuredMovie.backdrop }}
- {% elsif schema == 'books' %}
+ {%- elsif schema == 'books' -%}
{%- assign featuredBook = books | bookStatus: 'started' | reverse | first -%}
{{ featuredBook.image }}
- {% else %}
+ {%- else -%}
{{ meta.meta_data.opengraph_default }}
-{% endif %}
+{%- endif -%}
{%- endcapture -%}
<!doctype html>
<html lang="en">
diff --git a/src/_includes/partials/media/watching/backdrop-grid.liquid b/src/_includes/partials/media/watching/backdrop-grid.liquid
new file mode 100644
index 00000000..9a2d79d9
--- /dev/null
+++ b/src/_includes/partials/media/watching/backdrop-grid.liquid
@@ -0,0 +1,28 @@
+{% if mediaItems.size > 0 %}
+ <div class="watching grid">
+ {% for media in mediaItems limit: count %}
+ {% capture alt %}{{ media.title | escape }} ({{ media.year }}){% endcapture %}
+ <a href="{{ media.url }}">
+ <div class="watching item shadow">
+ <div class="meta-text">
+ {% if media.type == 'movie' %}
+ <div class="header">{{ media.title }}</div>
+ <div class="subheader flex-centered gap-xs">
+ {{ media.year }}
+ {% if rating and media.rating %}
+ <span class="rating"> ({{ media.rating }})</span>
+ {% endif %}
+ </div>
+ {% else %}
+ <div class="header">{{ media.name }}</div>
+ {% endif %}
+ </div>
+ {%- capture loadingStrategy -%}
+ {%- if loading -%}{{ loading }}{%- else -%}lazy{%- endif -%}
+ {%- endcapture -%}
+ <img src="https://coryd.dev/.netlify/images/?url={{ media.backdrop }}&fit=cover&w=256&h=144&fm=webp&q=75" alt="{{ alt }}" loading="{{ loadingStrategy }}" decoding="async" width="256" height="144" />
+ </div>
+ </a>
+ {% endfor %}
+ </div>
+{% endif %}
\ No newline at end of file
diff --git a/src/_includes/partials/media/watching/favorites-grid.liquid b/src/_includes/partials/media/watching/favorites-grid.liquid
deleted file mode 100644
index 9d59cfbf..00000000
--- a/src/_includes/partials/media/watching/favorites-grid.liquid
+++ /dev/null
@@ -1,23 +0,0 @@
-{% if favorites.size > 0 %}
- <div class="watching grid">
- {% for favorite in favorites limit: count %}
- {% capture alt %}{{ favorite.title | escape }} ({{ favorite.year }}){% endcapture %}
- <a href="{{ favorite.url }}">
- <div class="watching item shadow">
- <div class="meta-text">
- {% if favorite.type == 'movie' %}
- <div class="header">{{ favorite.title }}</div>
- <div class="subheader">{{ favorite.year }}</div>
- {% else %}
- <div class="header">{{ favorite.name }}</div>
- {% endif %}
- </div>
- {%- capture loadingStrategy -%}
- {%- if loading -%}{{ loading }}{%- else -%}lazy{%- endif -%}
- {%- endcapture -%}
- <img src="https://coryd.dev/.netlify/images/?url={{ favorite.backdrop }}&fit=cover&w=256&h=144&fm=webp&q=75" alt="{{ alt }}" loading="{{ loadingStrategy }}" decoding="async" width="256" height="144" />
- </div>
- </a>
- {% endfor %}
- </div>
-{% endif %}
\ No newline at end of file
diff --git a/src/assets/styles/pages/watching.css b/src/assets/styles/pages/watching.css
index 66f8990f..76e839b1 100644
--- a/src/assets/styles/pages/watching.css
+++ b/src/assets/styles/pages/watching.css
@@ -7,27 +7,25 @@
position: relative;
overflow: hidden;
- div {
- &.meta-text{
- color: white;
- position: absolute;
- left: var(--sizing-sm);
- bottom: var(--sizing-lg);
- z-index: 2;
+ div.meta-text {
+ color: white;
+ position: absolute;
+ left: var(--sizing-sm);
+ bottom: var(--sizing-lg);
+ z-index: 2;
- & .header {
- font-weight: var(--font-weight-bold);
- }
+ & .header {
+ font-weight: var(--font-weight-bold);
+ }
- & .subheader {
- font-size: var(--font-size-sm);
- }
+ & .subheader {
+ font-size: var(--font-size-sm);
+ }
- & .header,
- & .subheader {
- line-height: 1.5;
- text-shadow: rgba(0, 0, 0, 0.7) 0px 0px 10px;
- }
+ & .header,
+ & .subheader {
+ line-height: 1.5;
+ text-shadow: rgba(0, 0, 0, 0.7) 0px 0px 10px;
}
}
@@ -74,13 +72,18 @@
flex-direction: column;
& .header,
- & .subheader {
+ & .subheader,
+ & .rating {
color: var(--color-lightest);
font-size: var(--font-size-xs);
line-height: 1.5;
text-shadow: rgba(0, 0, 0, 0.7) 0px 0px 10px;
}
+ & .rating {
+ font-size: calc(var(--font-size-xs) * .75);
+ }
+
& .header {
font-weight: var(--font-weight-bold);
}
diff --git a/src/pages/main/watching/favorites/movies.html b/src/pages/main/watching/favorites/movies.html
index 256638d3..5fec3fce 100644
--- a/src/pages/main/watching/favorites/movies.html
+++ b/src/pages/main/watching/favorites/movies.html
@@ -8,4 +8,4 @@ schema: watching
<h2 class="watching page-header">{{ title }}</h2>
<p>These are my favorite movies. There are many like them, but these are mine.</p>
<hr class="large-spacing" />
-{% render "partials/media/watching/favorites-grid.liquid", favorites:movies.favorites, count: 99 %}
\ No newline at end of file
+{% render "partials/media/watching/backdrop-grid.liquid", mediaItems:movies.favorites, count: 99 %}
\ No newline at end of file
diff --git a/src/pages/main/watching/favorites/shows.html b/src/pages/main/watching/favorites/shows.html
index 761eaf77..70354431 100644
--- a/src/pages/main/watching/favorites/shows.html
+++ b/src/pages/main/watching/favorites/shows.html
@@ -8,4 +8,4 @@ schema: watching
<h2 class="watching page-header">{{ title }}</h2>
<p>These are my favorite shows. There are many like them, but these are mine.</p>
<hr class="large-spacing" />
-{% render "partials/media/watching/favorites-grid.liquid", favorites:tv.favorites, count: 99 %}
\ No newline at end of file
+{% render "partials/media/watching/backdrop-grid.liquid", mediaItems:tv.favorites, count: 99 %}
\ No newline at end of file
diff --git a/src/pages/main/watching/index.html b/src/pages/main/watching/index.html
index 5e9523c8..dacd41c3 100644
--- a/src/pages/main/watching/index.html
+++ b/src/pages/main/watching/index.html
@@ -10,15 +10,19 @@ schema: watching
{% render "partials/media/watching/hero.liquid" movie:featuredMovie %}
<p>Here's all of the TV and movies I've been watching presented in what is (hopefully) an organized fashion. You can also take a look at the <a href="/watching/movies-to-watch">movies</a> and <a href="/watching/shows-to-watch">shows</a> I'm planning to watch.</p>
{% render "partials/banners/rss.liquid", url: "https://feedpress.me/coryd-movies", text: "Subscribe to my movies feed or follow along on this page" %}
-<h2 id="movies" class="section-header flex-centered">
- {% tablericon "movie" "Recent movies" %}
- Recent movies
-</h2>
+<a class="link-icon flex-centered" href="/recent/movies">
+ <h2 id="movies" class="section-header flex-centered">
+ {% tablericon "movie" "Recent movies" %}
+ Recent movies
+ </h2>
+</a>
{% render "partials/media/grid.liquid", data:movies.recentlyWatched, shape: "vertical", count: 6 %}
-<h2 id="tv" class="section-header flex-centered">
- {% tablericon "device-tv" "Recent shows" %}
- Recent shows
-</h2>
+<a class="link-icon flex-centered" href="/recent/shows">
+ <h2 id="tv" class="section-header flex-centered">
+ {% tablericon "device-tv" "Recent shows" %}
+ Recent shows
+ </h2>
+</a>
{% render "partials/media/grid.liquid", data:tv.recentlyWatched, shape: "vertical", count: 6 %}
<a class="link-icon flex-centered" href="/watching/favorite-movies">
<h2 class="section-header flex-centered">
@@ -27,7 +31,7 @@ schema: watching
</h2>
</a>
{% assign favoriteMovies = movies.favorites | featuredWatching: 6 %}
-{% render "partials/media/watching/favorites-grid.liquid", favorites:favoriteMovies, count: 6 %}
+{% render "partials/media/watching/backdrop-grid.liquid", mediaItems:favoriteMovies, count: 6 %}
<a class="link-icon flex-centered" href="/watching/favorite-shows">
<h2 class="section-header flex-centered">
{% tablericon "star" "Favorite shows" %}
@@ -35,4 +39,4 @@ schema: watching
</h2>
</a>
{% assign favoriteShows = tv.favorites | featuredWatching: 6 %}
-{% render "partials/media/watching/favorites-grid.liquid", favorites:favoriteShows, count: 6 %}
\ No newline at end of file
+{% render "partials/media/watching/backdrop-grid.liquid", mediaItems:favoriteShows, count: 6 %}
\ No newline at end of file
diff --git a/src/pages/main/watching/recent/movies.html b/src/pages/main/watching/recent/movies.html
new file mode 100644
index 00000000..3c20bcd3
--- /dev/null
+++ b/src/pages/main/watching/recent/movies.html
@@ -0,0 +1,11 @@
+---
+title: Recent movies
+layout: default
+permalink: "/recent/movies/index.html"
+schema: watching
+---
+<p><a class="link-icon flex-centered" href="/watching">{% tablericon "arrow-left" "Go back" %} Go back</a></p>
+<h2 class="watching page-header">{{ title }}</h2>
+<p>These are the movies I've watched recently. There are many like them, but these are mine.</p>
+<hr class="large-spacing" />
+{% render "partials/media/watching/backdrop-grid.liquid", mediaItems:movies.recentlyWatched, count: 99, rating: true %}
\ No newline at end of file
diff --git a/src/pages/main/watching/recent/shows.html b/src/pages/main/watching/recent/shows.html
new file mode 100644
index 00000000..cd6a73d9
--- /dev/null
+++ b/src/pages/main/watching/recent/shows.html
@@ -0,0 +1,11 @@
+---
+title: Recent shows
+layout: default
+permalink: "/recent/shows/index.html"
+schema: watching
+---
+<p><a class="link-icon flex-centered" href="/watching">{% tablericon "arrow-left" "Go back" %} Go back</a></p>
+<h2 class="watching page-header">{{ title }}</h2>
+<p>These are the shows I've watched recently. There are many like them, but these are mine.</p>
+<hr class="large-spacing" />
+{% render "partials/media/watching/backdrop-grid.liquid", mediaItems:tv.recentlyWatched, count: 99 %}
\ No newline at end of file