Shrink buttons on mobile
This commit is contained in:
@@ -236,8 +236,8 @@ defmodule MusicLibraryWeb.CoreComponents do
|
||||
<button
|
||||
type={@type}
|
||||
class={[
|
||||
"phx-submit-loading:opacity-75 rounded-md py-2 px-3 mt-2",
|
||||
"text-sm font-semibold leading-6 ",
|
||||
"phx-submit-loading:opacity-75 rounded-md py-1 sm:py-2 px-2 sm:px-3 mt-2",
|
||||
"text-xs sm:text-sm font-semibold leading-6 ",
|
||||
"bg-zinc-900 hover:bg-zinc-800 dark:bg-zinc-100 dark:hover:bg-zinc-200",
|
||||
"text-white active:text-white/80 dark:text-zinc-900 dark:active:text-zinc-900/80",
|
||||
"focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-zinc-600",
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
)} · {Records.Record.type_long_label(@record.type)}
|
||||
</p>
|
||||
<!-- TODO: extract to a component -->
|
||||
<nav class="mt-5 isolate inline-flex rounded-md shadow-sm">
|
||||
<nav class="mt-3 sm:mt-5 isolate inline-flex rounded-md shadow-sm">
|
||||
<.link patch={~p"/collection/#{@record}/show/edit"} phx-click={JS.push_focus()}>
|
||||
<.button type="button" class="relative inline-flex items-center rounded-r-none">
|
||||
{gettext("Edit")}
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
)} · {Records.Record.type_long_label(@record.type)}
|
||||
</p>
|
||||
<!-- TODO: extract to a component -->
|
||||
<nav class="mt-5 isolate inline-flex rounded-md shadow-sm">
|
||||
<nav class="mt-3 sm:mt-5 isolate inline-flex rounded-md shadow-sm">
|
||||
<.link patch={~p"/wishlist/#{@record}/show/edit"} phx-click={JS.push_focus()}>
|
||||
<.button type="button" class="relative inline-flex items-center rounded-r-none">
|
||||
{gettext("Edit")}
|
||||
|
||||
Reference in New Issue
Block a user