KKlochko
/
decentralised_book_index
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: KKlochko:ac4e28bd56d002bd4c8b7e2dc6f855e6a8837c96
Branches Tags
KKlochko:dev
KKlochko:main
...
compare: KKlochko:e9e49572d12d6948473d570410abd7af298503b2
Branches Tags
KKlochko:dev
KKlochko:main

3 Commits
ac4e28bd56 ... e9e49572d1

Author SHA1 Message Date
KKlochko e9e49572d1 Add the content's horizontal padding for card components.
continuous-integration/drone/push Build is passing Details
4 weeks ago
KKlochko bf333aad07 Update the select components to show the message about no records.
4 weeks ago
KKlochko e226e696da Update the select components to add hover style for records.
4 weeks ago
6 changed files with 121 additions and 34 deletions
Show Stats

2
lib/decentralised_book_index_web/components/my_components/author_card.ex
Unescape View File

@ -63,7 +63,7 @@ defmodule DecentralisedBookIndexWeb.Components.MyComponents.AuthorCard do
</div>
</div>
<% end %>
<div class="flex flex-col items-center py-5 text-center">
<div class="flex flex-col items-center py-5 text-center px-2">
<.link navigate={~p"/authors/#{@author.id}"}>
<%= if @author.avatar_url != nil do %>
<img

2
lib/decentralised_book_index_web/components/my_components/book_card.ex
Unescape View File

@ -63,7 +63,7 @@ defmodule DecentralisedBookIndexWeb.Components.MyComponents.BookCard do
</div>
</div>
<% end %>
<div class="flex flex-col items-center py-5 text-center">
<div class="flex flex-col items-center py-5 text-center px-2">
<.link navigate={~p"/books/#{@book.id}"}>
<%= if @book.cover_image_url != nil do %>
<img class="w-36 mb-3 shadow-lg" src={@book.cover_image_url} alt={"#{@book.title} image"} />

48
lib/decentralised_book_index_web/components/my_components/select_author.ex
Unescape View File

@ -14,18 +14,54 @@ defmodule DecentralisedBookIndexWeb.Components.MyComponents.SelectAuthor do
<label for="simple-search" class="sr-only">Search</label>
<div class="relative w-full">
<div class="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none">
<svg aria-hidden="true" class="w-5 h-5 text-gray-500 dark:text-gray-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z" clip-rule="evenodd"></path>
<svg
aria-hidden="true"
class="w-5 h-5 text-gray-500 dark:text-gray-400"
fill="currentColor"
viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z"
clip-rule="evenodd"
>
</path>
</svg>
</div>
<input name="query" type="text" phx-debounce="300" autocomplete="off" id="simple-search" class="block w-full p-2 pl-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-primary-500 focus:border-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500" placeholder="Search" value="">
<input
name="query"
type="text"
phx-debounce="300"
autocomplete="off"
id="simple-search"
class="block w-full p-2 pl-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-primary-500 focus:border-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
placeholder="Search"
value=""
/>
</div>
</form>
<%= for author <- @page.results do %>
<div phx-click="select-author" phx-target={@notify_component} phx-value-author={author.id} phx-value-path={@form_path} class="w-full bg-white border border-gray-200 rounded-lg shadow-sm dark:bg-gray-800 dark:border-gray-700 mx-auto my-3">
<h5 class="mb-1 text-lg font-medium text-gray-900 dark:text-white px-2 pt-1">{author.name}</h5>
<%= if Enum.empty?(@page.results) do %>
<div class="flex justify-center ">
<p class="text-lg font-semibold py-5 dark:text-white">
No Authors
</p>
</div>
<% else %>
<%= for author <- @page.results do %>
<div
phx-click="select-author"
phx-target={@notify_component}
phx-value-author={author.id}
phx-value-path={@form_path}
class="w-full bg-white border border-gray-200 rounded-lg shadow-sm dark:bg-gray-800 dark:border-gray-700 mx-auto my-3 hover:bg-gray-100 dark:hover:bg-gray-700"
>
<h5 class="mb-1 text-lg font-medium text-gray-900 dark:text-white px-2 pt-1">
{author.name}
</h5>
</div>
<% end %>
<% end %>
</div>
"""

28
lib/decentralised_book_index_web/components/my_components/select_author_alias.ex
Unescape View File

@ -42,17 +42,25 @@ defmodule DecentralisedBookIndexWeb.Components.MyComponents.SelectAuthorAlias do
</div>
</form>
<%= for author_alias <- @page.results do %>
<div
phx-click="select-author-alias"
phx-target={@notify_component}
phx-value-author-alias={author_alias.author_alias_registry_id}
class="w-full bg-white border border-gray-200 rounded-lg shadow-sm dark:bg-gray-800 dark:border-gray-700 mx-auto my-3"
>
<h5 class="mb-1 text-lg font-medium text-gray-900 dark:text-white px-2 pt-1">
{author_alias.name}
</h5>
<%= if Enum.empty?(@page.results) do %>
<div class="flex justify-center ">
<p class="text-lg font-semibold py-5 dark:text-white">
No Authors
</p>
</div>
<% else %>
<%= for author_alias <- @page.results do %>
<div
phx-click="select-author-alias"
phx-target={@notify_component}
phx-value-author-alias={author_alias.author_alias_registry_id}
class="w-full bg-white border border-gray-200 rounded-lg shadow-sm dark:bg-gray-800 dark:border-gray-700 mx-auto my-3 hover:bg-gray-100 dark:hover:bg-gray-700"
>
<h5 class="mb-1 text-lg font-medium text-gray-900 dark:text-white px-2 pt-1">
{author_alias.name}
</h5>
</div>
<% end %>
<% end %>
</div>
"""

28
lib/decentralised_book_index_web/components/my_components/select_book_edition.ex
Unescape View File

@ -42,17 +42,25 @@ defmodule DecentralisedBookIndexWeb.Components.MyComponents.SelectBookEdition do
</div>
</form>
<%= for book_edition <- @page.results do %>
<div
phx-click="select-book-edition"
phx-target={@notify_component}
phx-value-book-edition={book_edition.book_editions_registry_id}
class="w-full bg-white border border-gray-200 rounded-lg shadow-sm dark:bg-gray-800 dark:border-gray-700 mx-auto my-3"
>
<h5 class="mb-1 text-lg font-medium text-gray-900 dark:text-white px-2 pt-1">
{book_edition.title}
</h5>
<%= if Enum.empty?(@page.results) do %>
<div class="flex justify-center ">
<p class="text-lg font-semibold py-5 dark:text-white">
No Books
</p>
</div>
<% else %>
<%= for book_edition <- @page.results do %>
<div
phx-click="select-book-edition"
phx-target={@notify_component}
phx-value-book-edition={book_edition.book_editions_registry_id}
class="w-full bg-white border border-gray-200 rounded-lg shadow-sm dark:bg-gray-800 dark:border-gray-700 mx-auto my-3 hover:bg-gray-100 dark:hover:bg-gray-700"
>
<h5 class="mb-1 text-lg font-medium text-gray-900 dark:text-white px-2 pt-1">
{book_edition.title}
</h5>
</div>
<% end %>
<% end %>
</div>
"""

47
lib/decentralised_book_index_web/components/my_components/select_publisher.ex
Unescape View File

@ -14,18 +14,53 @@ defmodule DecentralisedBookIndexWeb.Components.MyComponents.SelectPublisher do
<label for="simple-search" class="sr-only">Search</label>
<div class="relative w-full">
<div class="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none">
<svg aria-hidden="true" class="w-5 h-5 text-gray-500 dark:text-gray-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z" clip-rule="evenodd"></path>
<svg
aria-hidden="true"
class="w-5 h-5 text-gray-500 dark:text-gray-400"
fill="currentColor"
viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z"
clip-rule="evenodd"
>
</path>
</svg>
</div>
<input name="query" type="text" phx-debounce="300" autocomplete="off" id="simple-search" class="block w-full p-2 pl-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-primary-500 focus:border-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500" placeholder="Search" value="">
<input
name="query"
type="text"
phx-debounce="300"
autocomplete="off"
id="simple-search"
class="block w-full p-2 pl-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-primary-500 focus:border-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
placeholder="Search"
value=""
/>
</div>
</form>
<%= for publisher <- @page.results do %>
<div phx-click="select-publisher" phx-target={@notify_component} phx-value-publisher={publisher.id} class="w-full bg-white border border-gray-200 rounded-lg shadow-sm dark:bg-gray-800 dark:border-gray-700 mx-auto my-3">
<h5 class="mb-1 text-lg font-medium text-gray-900 dark:text-white px-2 pt-1">{publisher.name}</h5>
<%= if Enum.empty?(@page.results) do %>
<div class="flex justify-center ">
<p class="text-lg font-semibold py-5 dark:text-white">
No Publishers
</p>
</div>
<% else %>
<%= for publisher <- @page.results do %>
<div
phx-click="select-publisher"
phx-target={@notify_component}
phx-value-publisher={publisher.id}
class="w-full bg-white border border-gray-200 rounded-lg shadow-sm dark:bg-gray-800 dark:border-gray-700 mx-auto my-3 hover:bg-gray-100 dark:hover:bg-gray-700"
>
<h5 class="mb-1 text-lg font-medium text-gray-900 dark:text-white px-2 pt-1">
{publisher.name}
</h5>
</div>
<% end %>
<% end %>
</div>
"""

Write Preview
Loading…
Cancel
Save