chore: re-arrange some dom nodes for focus presentation
This commit is contained in:
parent
897ef64d3c
commit
ee9b7aa778
10 changed files with 67 additions and 61 deletions
|
|
@ -15,27 +15,27 @@ schema: music-index
|
|||
<p><strong class="highlight-text">See more of the</strong> <a href="/music/artists/this-week/">artists</a>, <a href="/music/albums/this-week/">albums</a> or <a href="/music/tracks/this-week/">tracks</a> I've listened to this week. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music/this-month">this month</a> or <a href="/music/three-months">over the last 3 months</a></p>
|
||||
{% render "partials/widgets/now-playing.liquid" %}
|
||||
<hr />
|
||||
<a class="link-icon flex-centered" href="/music/artists/this-week">
|
||||
<h2 id="artists" class="section-header no-top-margin flex-centered">
|
||||
<h2 id="artists" class="section-header no-top-margin">
|
||||
<a class="link-icon" href="/music/artists/this-week">
|
||||
{% tablericon "microphone-2" "Artists" %}
|
||||
Artists
|
||||
</h2>
|
||||
</a>
|
||||
</a>
|
||||
</h2>
|
||||
{% render "partials/media/grid.liquid", data:music.week.artists, shape: "square", count: 8, loading: "eager" %}
|
||||
<a class="link-icon flex-centered" href="/music/albums/this-week">
|
||||
<h2 id="albums" class="section-header reduced-margin flex-centered">
|
||||
<h2 id="albums" class="section-header reduced-margin">
|
||||
<a class="link-icon" href="/music/albums/this-week">
|
||||
{% tablericon "vinyl" "Albums" %}
|
||||
Albums
|
||||
</h2>
|
||||
</a>
|
||||
</a>
|
||||
</h2>
|
||||
{% render "partials/media/grid.liquid", data:music.week.albums, shape: "square", count: 8 %}
|
||||
<div class="section-header-wrapper">
|
||||
<a class="link-icon flex-centered" href="/music/tracks/this-week">
|
||||
<h2 id="tracks" class="section-header reduced-margin flex-centered">
|
||||
<h2 id="tracks" class="section-header reduced-margin">
|
||||
<a class="link-icon" href="/music/tracks/this-week">
|
||||
{% tablericon "playlist" "Tracks" %}
|
||||
Tracks
|
||||
</h2>
|
||||
</a>
|
||||
</a>
|
||||
</h2>
|
||||
<div class="section-header-buttons reduced-margin client-side">
|
||||
<button class="small active" data-toggle="tracks-recent">Recent</button>
|
||||
<button class="small secondary" data-toggle="tracks-window">This week</button>
|
||||
|
|
|
|||
|
|
@ -11,24 +11,24 @@ schema: music-period
|
|||
<p>I've listened to <strong class="highlight-text">{{ music.threeMonth.artists.size }} artists</strong>, <strong class="highlight-text">{{ music.threeMonth.albums.size }} albums</strong> and <strong class="highlight-text">{{ music.threeMonth.totalTracks }} tracks</strong> over the last 3 months. Most of that has been {{ music.threeMonth.genres | sortByPlaysDescending: "plays" | genreStrings: "genre" | mediaLinks: "genre", 5 }}.</p>
|
||||
<p><strong class="highlight-text">See more of the</strong> <a href="/music/artists/three-months/">artists</a>, <a href="/music/albums/three-months/">albums</a> or <a href="/music/tracks/three-months/">tracks</a> I've listened to over the last 3 months. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music">this week</a> or <a href="/music/this-month">this month</a>.</p>
|
||||
<hr />
|
||||
<a class="link-icon flex-centered" href="/music/artists/three-months">
|
||||
<h2 id="artists" class="section-header no-top-margin flex-centered">
|
||||
<h2 id="artists" class="section-header no-top-margin">
|
||||
<a class="link-icon" href="/music/artists/three-months">
|
||||
{% tablericon "microphone-2" "Artists" %}
|
||||
Artists
|
||||
</h2>
|
||||
</a>
|
||||
</a>
|
||||
</h2>
|
||||
{% render "partials/media/grid.liquid", data:music.threeMonth.artists, shape: "square", count: 8, loading: "eager" %}
|
||||
<a class="link-icon flex-centered" href="/music/albums/three-months">
|
||||
<h2 id="albums" class="section-header reduced-margin flex-centered">
|
||||
<h2 id="albums" class="section-header reduced-margin">
|
||||
<a class="link-icon" href="/music/albums/three-months">
|
||||
{% tablericon "vinyl" "Albums" %}
|
||||
Albums
|
||||
</h2>
|
||||
</a>
|
||||
</a>
|
||||
</h2>
|
||||
{% render "partials/media/grid.liquid", data:music.threeMonth.albums, shape: "square", count: 8 %}
|
||||
<a class="link-icon flex-centered" href="/music/tracks/three-months">
|
||||
<h2 id="tracks" class="section-header reduced-margin flex-centered">
|
||||
<h2 id="tracks" class="section-header reduced-margin">
|
||||
<a class="link-icon" href="/music/tracks/three-months">
|
||||
{% tablericon "playlist" "Tracks" %}
|
||||
Tracks
|
||||
</h2>
|
||||
</a>
|
||||
</a>
|
||||
</h2>
|
||||
{% render "partials/media/music/chart.liquid", data:music.threeMonth.tracks, mostPlayed:music.threeMonth.tracks[0].plays, count: 10 %}
|
||||
|
|
@ -11,24 +11,24 @@ schema: music-period
|
|||
<p>I've listened to <strong class="highlight-text">{{ music.month.artists.size }} artists</strong>, <strong class="highlight-text">{{ music.month.albums.size }} albums</strong> and <strong class="highlight-text">{{ music.month.totalTracks }} tracks</strong> this month. Most of that has been {{ music.month.genres | sortByPlaysDescending: "plays" | genreStrings: "genre" | mediaLinks: "genre", 5 }}.</p>
|
||||
<p><strong class="highlight-text">See more of the</strong> <a href="/music/artists/this-month/">artists</a>, <a href="/music/albums/this-month/">albums</a> or <a href="/music/tracks/this-month/">tracks</a> I've listened to this month. <strong class="highlight-text">Or take a look at what I've listened to</strong> <a href="/music">this week</a> or <a href="/music/three-months">over the last 3 months</a>.</p>
|
||||
<hr />
|
||||
<a class="link-icon flex-centered" href="/music/artists/this-month">
|
||||
<h2 id="artists" class="section-header no-top-margin flex-centered">
|
||||
<h2 id="artists" class="section-header no-top-margin">
|
||||
<a class="link-icon" href="/music/artists/this-month">
|
||||
{% tablericon "microphone-2" "Artists" %}
|
||||
Artists
|
||||
</h2>
|
||||
</a>
|
||||
</a>
|
||||
</h2>
|
||||
{% render "partials/media/grid.liquid", data:music.month.artists, shape: "square", count: 8, loading: "eager" %}
|
||||
<a class="link-icon flex-centered" href="/music/albums/this-month">
|
||||
<h2 id="albums" class="section-header reduced-margin flex-centered">
|
||||
<h2 id="albums" class="section-header reduced-margin">
|
||||
<a class="link-icon" href="/music/albums/this-month">
|
||||
{% tablericon "vinyl" "Albums" %}
|
||||
Albums
|
||||
</h2>
|
||||
</a>
|
||||
</a>
|
||||
</h2>
|
||||
{% render "partials/media/grid.liquid", data:music.month.albums, shape: "square", count: 8 %}
|
||||
<a class="link-icon flex-centered" href="/music/tracks/this-month">
|
||||
<h2 id="tracks" class="section-header reduced-margin flex-centered">
|
||||
<h2 id="tracks" class="section-header reduced-margin">
|
||||
<a class="link-icon" href="/music/tracks/this-month">
|
||||
{% tablericon "playlist" "Tracks" %}
|
||||
Tracks
|
||||
</h2>
|
||||
</a>
|
||||
</a>
|
||||
</h2>
|
||||
{% render "partials/media/music/chart.liquid", data:music.month.tracks, mostPlayed:music.month.tracks[0].plays, count: 10 %}
|
||||
|
|
@ -12,33 +12,33 @@ schema: watching
|
|||
<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" %}
|
||||
<hr />
|
||||
<a class="link-icon flex-centered" href="/watching/recent/movies">
|
||||
<h2 id="movies" class="section-header no-top-margin flex-centered">
|
||||
<h2 id="movies" class="section-header no-top-margin">
|
||||
<a class="link-icon" href="/watching/recent/movies">
|
||||
{% tablericon "movie" "Recent movies" %}
|
||||
Recent movies
|
||||
</h2>
|
||||
</a>
|
||||
</a>
|
||||
</h2>
|
||||
{% render "partials/media/grid.liquid", data:movies.recentlyWatched, shape: "vertical", count: 6 %}
|
||||
<a class="link-icon flex-centered" href="/watching/recent/shows">
|
||||
<h2 id="tv" class="section-header reduced-margin flex-centered">
|
||||
<h2 id="tv" class="section-header reduced-margin">
|
||||
<a class="link-icon" href="/watching/recent/shows">
|
||||
{% tablericon "device-tv" "Recent shows" %}
|
||||
Recent shows
|
||||
</h2>
|
||||
</a>
|
||||
</a>
|
||||
</h2>
|
||||
{% render "partials/media/grid.liquid", data:tv.recentlyWatched, shape: "vertical", count: 6 %}
|
||||
<a class="link-icon flex-centered" href="/watching/favorite-movies">
|
||||
<h2 id="favorite-movies" class="section-header reduced-margin flex-centered">
|
||||
<h2 id="favorite-movies" class="section-header reduced-margin">
|
||||
<a class="link-icon" href="/watching/favorite-movies">
|
||||
{% tablericon "star" "Favorite movies" %}
|
||||
Favorite movies
|
||||
</h2>
|
||||
</a>
|
||||
</a>
|
||||
</h2>
|
||||
{% assign favoriteMovies = movies.favorites | featuredWatching: 6 %}
|
||||
{% render "partials/media/watching/grid.liquid", mediaItems:favoriteMovies, count: 6 %}
|
||||
<a class="link-icon flex-centered" href="/watching/favorite-shows">
|
||||
<h2 id="favorite-shows" class="section-header reduced-margin flex-centered">
|
||||
<h2 id="favorite-shows" class="section-header reduced-margin">
|
||||
<a class="link-icon" href="/watching/favorite-shows">
|
||||
{% tablericon "star" "Favorite shows" %}
|
||||
Favorite shows
|
||||
</h2>
|
||||
</a>
|
||||
</a>
|
||||
</h2>
|
||||
{% assign favoriteShows = tv.favorites | featuredWatching: 6 %}
|
||||
{% render "partials/media/watching/grid.liquid", mediaItems:favoriteShows, count: 6 %}
|
||||
Reference in a new issue