-
Notifications
You must be signed in to change notification settings - Fork 7
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
17 changed files
with
281 additions
and
24 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,61 @@ | ||
|
|
||
| <div class="flex justify-between items-center"> | ||
| <div class="py-4"> | ||
| <% Category.playlist_types.each do |item| %> | ||
| <%= link_to user_playlists_filter_path(@user.username, kind: item), | ||
| data: { turbo_frame: "playlist-cards" }, | ||
| class: "bg-muted text-sm inline-flex | ||
| hover:cursor-pointer | ||
| items-center rounded-full | ||
| hover:bg-emphasis | ||
| px-3 py-1 font-medium" do %> | ||
| <%= item.humanize %> | ||
| <% end %> | ||
| <% end %> | ||
| </div> | ||
|
|
||
| <%= link_to user_playlists_path(@user.username), class: "text-sm font-semibold leading-6 text-brand-600" do %> | ||
| See all <span aria-hidden="true">→</span> | ||
| <% end %> | ||
| </div> | ||
|
|
||
| <h2 class="text-md font-medium text-gray-500">Albums</h2> | ||
|
|
||
| <ul role="list" | ||
| class="mt-3 grid grid-cols-1 gap-5 sm:grid-cols-2 sm:gap-6 lg:grid-cols-4"> | ||
| <% # pink purple yellow green %> | ||
| <% @playlists.each do |playlist| %> | ||
| <li class="col-span-1 flex rounded-md shadow-sm"> | ||
| <div class="flex w-16 flex-shrink-0 items-center justify-center bg-pink-600 rounded-l-md text-sm font-medium text-default"> | ||
| <%= image_tag(playlist.cover_url(:medium), | ||
| class: "object-center object-cover group-hover:opacity-75" | ||
| ) %> | ||
| </div> | ||
| <div class="flex flex-1 items-center justify-between truncate rounded-r-md border-b border-r border-t border-muted bg-default"> | ||
| <div class="flex-1 truncate px-4 py-2 text-sm"> | ||
| <%= link_to playlist_path(playlist), | ||
| data: {turbo_frame: "_top"}, | ||
| class: "font-medium text-muted hover:text-emphasis" do %> | ||
| <%= playlist.title %> | ||
| <% end %> | ||
| <p class="text-gray-500"> | ||
| <%= playlist&.release_date&.year%> · | ||
| <%= playlist.tracks.size %> Tracks | ||
| </p> | ||
| </div> | ||
| <!--<div class="flex-shrink-0 pr-2"> | ||
| <button type="button" | ||
| class="inline-flex h-8 w-8 items-center | ||
| justify-center rounded-full bg-transparent | ||
| text-default hover:text-emphasis | ||
| hover:bg-brand-700 | ||
| focus:outline-none focus:ring-2 focus:ring-indigo-500 | ||
| focus:ring-offset-2"> | ||
| <span class="sr-only">Open options</span> | ||
| <%= heroicon("play", variant: :mini) %> | ||
| </button> | ||
| </div>--> | ||
| </div> | ||
| </li> | ||
| <% end %> | ||
| </ul> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,66 @@ | ||
| <% | ||
| first, *rest = articles | ||
| %> | ||
|
|
||
| <div class="bg-default py-24 sm:py-32"> | ||
| <div class="mx-auto grid max-w-7xl grid-cols-1 gap-x-8 gap-y-12 px-6 sm:gap-y-16 lg:grid-cols-2 lg:px-8"> | ||
|
|
||
| <article class="mx-auto w-full max-w-2xl lg:mx-0 lg:max-w-lg"> | ||
| <%= link_to user_path(first.user.username) do %> | ||
| <time datetime="<%= l first.created_at, format: :short %>" class="block text-sm leading-6 text-muted"> | ||
| <%= l first.created_at, format: :short %> | ||
| </time> | ||
| <h2 id="featured-post" class="mt-4 text-3xl font-bold tracking-tight text-default sm:text-4xl"> | ||
| <%= first.title %> | ||
| </h2> | ||
| <p class="mt-4 text-lg leading-8 text-emphasis"> | ||
| <%= first.excerpt %> | ||
| </p> | ||
|
|
||
| <div class="mt-4 flex flex-col justify-between gap-6 sm:mt-8 sm:flex-row-reverse sm:gap-8 lg:mt-4 lg:flex-col"> | ||
| <div class="flex"> | ||
| <%= link_to user_articles_path(first.user.username), class: "text-sm font-semibold leading-6 text-brand-600", "aria-describedby": "featured-post" do %> | ||
| Continue reading <span aria-hidden="true">→</span> | ||
| <% end %> | ||
| </div> | ||
| <div class="flex lg:border-t lg:border-default/10 lg:pt-8"> | ||
| <%= link_to user_path(first.user.username), class: "flex gap-x-2.5 text-sm font-semibold leading-6 text-default" do %> | ||
| <%= image_tag first.user.avatar_url(:small), class: "h-6 w-6 flex-none rounded-full bg-gray-50" %> | ||
| <%= first.user.first_name %> <%= first.user.last_name %> | ||
| <% end %> | ||
| </div> | ||
| </div> | ||
| <% end %> | ||
| </article> | ||
|
|
||
| <div class="mx-auto w-full max-w-2xl border-t border-default/10 pt-12 sm:pt-16 lg:mx-0 lg:max-w-none lg:border-t-0 lg:pt-0"> | ||
| <div class="-my-12 divide-y divide-default/10"> | ||
| <% rest.each do |article|%> | ||
| <article class="py-12"> | ||
| <div class="group relative max-w-xl"> | ||
| <time datetime="<%= l article.created_at %>" class="block text-sm leading-6 text-muted"> | ||
| <%= l article.created_at, format: :short %> | ||
| </time> | ||
| <h2 class="mt-2 text-lg font-semibold text-default group-hover:text-muted"> | ||
| <%= link_to article_path(article) do %> | ||
| <span class="absolute inset-0"></span> | ||
| <%= article.title %> | ||
| <% end %> | ||
| </h2> | ||
| <p class="mt-4 text-sm leading-6 text-muted"> | ||
| <%= article.excerpt %> | ||
| </p> | ||
| </div> | ||
| <div class="mt-4 flex"> | ||
| <%= link_to article_path(article), class: "relative flex gap-x-2.5 text-sm font-semibold leading-6 text-default" do %> | ||
| <%= image_tag article.user.avatar_url(:small), class: "h-6 w-6 flex-none rounded-full bg-gray-50" %> | ||
| <%= article.user.first_name %> <%= article.user.last_name %> | ||
| <% end %> | ||
| </div> | ||
| </article> | ||
| <% end %> | ||
| </div> | ||
| </div> | ||
|
|
||
| </div> | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,54 @@ | ||
| <div class="bg-white py-24 sm:py-32"> | ||
| <div class="mx-auto max-w-7xl px-6 lg:px-8"> | ||
| <div class="mx-auto max-w-2xl"> | ||
| <h2 class="text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl"> | ||
| <%= @user.first_name.humanize %> <%= @user.last_name.humanize %>'s Blog | ||
| </h2> | ||
| <p class="mt-2 text-lg leading-8 text-gray-600"> | ||
| <%= link_to user_path(@user.username), class: "flex items-center text-sm font-semibold leading-6 text-brand-600" do %> | ||
| <%= heroicon("chevron-left", variant: :mini)%> | ||
| back to <%= @user.username %> music | ||
| <% end %> | ||
| </p> | ||
|
|
||
| <div class="mt-10 space-y-16 border-t border-gray-200 pt-10 sm:mt-16 sm:pt-16"> | ||
|
|
||
| <% @articles.each do |article| %> | ||
| <article class="flex max-w-xl flex-col items-start justify-between"> | ||
| <div class="flex items-center gap-x-4 text-xs"> | ||
| <time datetime="<%= l(article.created_at) %>" class="text-gray-500"> | ||
| <%= l(article.created_at, format: :short) %> | ||
| </time> | ||
| <!--<a href="#" class="relative z-10 rounded-full bg-gray-50 px-3 py-1.5 font-medium text-gray-600 hover:bg-gray-100"> | ||
| Marketing | ||
| </a>--> | ||
| </div> | ||
| <div class="group relative"> | ||
| <h3 class="mt-3 text-lg font-semibold leading-6 text-gray-900 group-hover:text-gray-600"> | ||
| <%= link_to article_path(article) do %> | ||
| <span class="absolute inset-0"></span> | ||
| <%= article.title %> | ||
| <% end %> | ||
| </h3> | ||
| <p class="mt-5 line-clamp-3 text-sm leading-6 text-gray-600"> | ||
| <%= article.excerpt %> | ||
| </p> | ||
| </div> | ||
| <div class="relative mt-8 flex items-center gap-x-4"> | ||
| <%= image_tag article.user.avatar_url(:small), class: "h-10 w-10 rounded-full bg-gray-50" %> | ||
| <div class="text-sm leading-6"> | ||
| <p class="font-semibold text-gray-900"> | ||
| <a href="#"> | ||
| <span class="absolute inset-0"></span> | ||
| <%= article.user.username %> | ||
| </a> | ||
| </p> | ||
| <!--<p class="text-gray-600">Co-Founder / CTO</p>--> | ||
| </div> | ||
| </div> | ||
| </article> | ||
| <% end %> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,5 @@ | ||
| <%= turbo_frame_tag "playlist-cards" do %> | ||
| <% unless @render_empty %> | ||
| <%= render "playlists/cards" %> | ||
| <% end %> | ||
| <% end %> |
Oops, something went wrong.