Make pagination colors consistent with the everything else
This commit is contained in:
@@ -12,7 +12,7 @@ defmodule MusicLibraryWeb.Pagination do
|
|||||||
~H"""
|
~H"""
|
||||||
<div
|
<div
|
||||||
id="pagination"
|
id="pagination"
|
||||||
class="flex items-center justify-between border-t border-gray-200 bg-white px-4 py-3 sm:px-6 mb-4"
|
class="flex items-center justify-between border-t border-zinc-200 bg-white px-4 py-3 sm:px-6 mb-4"
|
||||||
>
|
>
|
||||||
<%!-- Only on smallest viewport --%>
|
<%!-- Only on smallest viewport --%>
|
||||||
<div class={[
|
<div class={[
|
||||||
@@ -22,14 +22,14 @@ defmodule MusicLibraryWeb.Pagination do
|
|||||||
<.link
|
<.link
|
||||||
:if={@page_links.prev_page}
|
:if={@page_links.prev_page}
|
||||||
patch={"?" <> encode_query(page: @page_links.prev_page, page_size: @pagination_params.page_size, query: @pagination_params.query)}
|
patch={"?" <> encode_query(page: @page_links.prev_page, page_size: @pagination_params.page_size, query: @pagination_params.query)}
|
||||||
class="relative inline-flex items-center rounded-md border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50"
|
class="relative inline-flex items-center rounded-md border border-zinc-300 bg-white px-4 py-2 text-sm font-medium text-zinc-700 hover:bg-zinc-50"
|
||||||
>
|
>
|
||||||
Previous
|
Previous
|
||||||
</.link>
|
</.link>
|
||||||
<.link
|
<.link
|
||||||
:if={@page_links.next_page}
|
:if={@page_links.next_page}
|
||||||
patch={"?" <> encode_query(page: @page_links.next_page, page_size: @pagination_params.page_size, query: @pagination_params.query)}
|
patch={"?" <> encode_query(page: @page_links.next_page, page_size: @pagination_params.page_size, query: @pagination_params.query)}
|
||||||
class="relative ml-3 inline-flex items-center rounded-md border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50"
|
class="relative ml-3 inline-flex items-center rounded-md border border-zinc-300 bg-white px-4 py-2 text-sm font-medium text-zinc-700 hover:bg-zinc-50"
|
||||||
>
|
>
|
||||||
Next
|
Next
|
||||||
</.link>
|
</.link>
|
||||||
@@ -88,7 +88,7 @@ defmodule MusicLibraryWeb.Pagination do
|
|||||||
defp next_link(assigns) do
|
defp next_link(assigns) do
|
||||||
~H"""
|
~H"""
|
||||||
<.link
|
<.link
|
||||||
class="relative inline-flex items-center rounded-r-md px-2 py-2 text-gray-400 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:z-20 focus:outline-offset-0"
|
class="relative inline-flex items-center rounded-r-md px-2 py-2 text-zinc-400 ring-1 ring-inset ring-zinc-300 hover:bg-zinc-50 focus:z-20 focus:outline-offset-0"
|
||||||
patch={"?" <> encode_query(page: @page_number, page_size: @page_size, query: @query)}
|
patch={"?" <> encode_query(page: @page_number, page_size: @page_size, query: @query)}
|
||||||
>
|
>
|
||||||
<span class="sr-only">Next</span>
|
<span class="sr-only">Next</span>
|
||||||
@@ -110,7 +110,7 @@ defmodule MusicLibraryWeb.Pagination do
|
|||||||
defp prev_link(assigns) do
|
defp prev_link(assigns) do
|
||||||
~H"""
|
~H"""
|
||||||
<.link
|
<.link
|
||||||
class="relative inline-flex items-center rounded-l-md px-2 py-2 text-gray-400 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:z-20 focus:outline-offset-0"
|
class="relative inline-flex items-center rounded-l-md px-2 py-2 text-zinc-400 ring-1 ring-inset ring-zinc-300 hover:bg-zinc-50 focus:z-20 focus:outline-offset-0"
|
||||||
patch={"?" <> encode_query(page: @page_number, page_size: @page_size, query: @query)}
|
patch={"?" <> encode_query(page: @page_number, page_size: @page_size, query: @query)}
|
||||||
>
|
>
|
||||||
<span class="sr-only">Previous</span>
|
<span class="sr-only">Previous</span>
|
||||||
@@ -127,7 +127,7 @@ defmodule MusicLibraryWeb.Pagination do
|
|||||||
|
|
||||||
defp separator(assigns) do
|
defp separator(assigns) do
|
||||||
~H"""
|
~H"""
|
||||||
<span class="relative hidden items-center px-4 py-2 text-sm font-semibold text-gray-900 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:z-20 focus:outline-offset-0 md:inline-flex">
|
<span class="relative hidden items-center px-4 py-2 text-sm font-semibold text-zinc-900 ring-1 ring-inset ring-zinc-300 focus:z-20 focus:outline-offset-0 md:inline-flex">
|
||||||
...
|
...
|
||||||
</span>
|
</span>
|
||||||
"""
|
"""
|
||||||
@@ -140,7 +140,7 @@ defmodule MusicLibraryWeb.Pagination do
|
|||||||
|
|
||||||
defp numbered_link(assigns) when assigns.active do
|
defp numbered_link(assigns) when assigns.active do
|
||||||
~H"""
|
~H"""
|
||||||
<span class="relative z-10 inline-flex items-center first:rounded-l-md last:rounded-r-md bg-indigo-600 px-4 py-2 text-sm font-semibold text-white focus:z-20 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">
|
<span class="relative z-10 inline-flex items-center first:rounded-l-md last:rounded-r-md bg-zinc-600 px-4 py-2 text-sm font-semibold text-white focus:z-20 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-zinc-600">
|
||||||
<%= @page_number %>
|
<%= @page_number %>
|
||||||
</span>
|
</span>
|
||||||
"""
|
"""
|
||||||
@@ -149,7 +149,7 @@ defmodule MusicLibraryWeb.Pagination do
|
|||||||
defp numbered_link(assigns) do
|
defp numbered_link(assigns) do
|
||||||
~H"""
|
~H"""
|
||||||
<.link
|
<.link
|
||||||
class="relative hidden items-center first:rounded-l-md last:rounded-r-md px-4 py-2 text-sm font-semibold text-gray-900 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:z-20 focus:outline-offset-0 md:inline-flex"
|
class="relative hidden items-center first:rounded-l-md last:rounded-r-md px-4 py-2 text-sm font-semibold text-zinc-900 ring-1 ring-inset ring-zinc-300 hover:bg-zinc-100 focus:z-20 focus:outline-offset-0 md:inline-flex"
|
||||||
patch={"?" <> encode_query(page: @page_number, page_size: @page_size, query: @query)}
|
patch={"?" <> encode_query(page: @page_number, page_size: @page_size, query: @query)}
|
||||||
>
|
>
|
||||||
<%= @page_number %>
|
<%= @page_number %>
|
||||||
|
|||||||
Reference in New Issue
Block a user