Shrink input text size at smallest viewport

This commit is contained in:
Claudio Ortolina
2024-12-23 17:08:44 +00:00
parent fe05efb06d
commit 8b877e7ede
2 changed files with 6 additions and 6 deletions
@@ -319,7 +319,7 @@ defmodule MusicLibraryWeb.CoreComponents do
~H""" ~H"""
<div> <div>
<label class="flex items-center gap-4 text-sm leading-6 text-zinc-600"> <label class="flex items-center gap-4 text-xs sm:text-sm leading-6 text-zinc-600">
<input type="hidden" name={@name} value="false" disabled={@rest[:disabled]} /> <input type="hidden" name={@name} value="false" disabled={@rest[:disabled]} />
<input <input
type="checkbox" type="checkbox"
@@ -350,7 +350,7 @@ defmodule MusicLibraryWeb.CoreComponents do
"bg-white shadow-sm dark:bg-zinc-800", "bg-white shadow-sm dark:bg-zinc-800",
"ring-1 ring-inset focus:z-10 focus:ring-2 focus:ring-inset", "ring-1 ring-inset focus:z-10 focus:ring-2 focus:ring-inset",
"focus:border-zinc-400 focus:ring-zinc-400 dark:focus:ring-zinc-300 focus:ring-0", "focus:border-zinc-400 focus:ring-zinc-400 dark:focus:ring-zinc-300 focus:ring-0",
"sm:text-sm", "text-xs sm:text-sm",
"text-zinc-900 dark:text-zinc-200", "text-zinc-900 dark:text-zinc-200",
"ring-zinc-200 dark:ring-zinc-400", "ring-zinc-200 dark:ring-zinc-400",
"placeholder:text-zinc-400 dark:placeholder:text-zinc-400" "placeholder:text-zinc-400 dark:placeholder:text-zinc-400"
@@ -374,7 +374,7 @@ defmodule MusicLibraryWeb.CoreComponents do
id={@id} id={@id}
name={@name} name={@name}
class={[ class={[
"mt-2 block w-full rounded-lg text-zinc-900 focus:ring-0 sm:text-sm sm:leading-6 min-h-[6rem]", "mt-2 block w-full rounded-lg text-zinc-900 focus:ring-0 text-xs sm:text-sm sm:leading-6 min-h-[6rem]",
@errors == [] && "border-zinc-300 focus:border-zinc-400", @errors == [] && "border-zinc-300 focus:border-zinc-400",
@errors != [] && "border-rose-400 focus:border-rose-400" @errors != [] && "border-rose-400 focus:border-rose-400"
]} ]}
@@ -401,7 +401,7 @@ defmodule MusicLibraryWeb.CoreComponents do
"bg-white shadow-sm dark:bg-zinc-800", "bg-white shadow-sm dark:bg-zinc-800",
"ring-1 ring-inset focus:z-10 focus:ring-2 focus:ring-inset", "ring-1 ring-inset focus:z-10 focus:ring-2 focus:ring-inset",
"focus:border-zinc-400 focus:ring-zinc-400 dark:focus:ring-zinc-300 focus:ring-0", "focus:border-zinc-400 focus:ring-zinc-400 dark:focus:ring-zinc-300 focus:ring-0",
"sm:text-sm", "text-xs sm:text-sm",
"text-zinc-900 dark:text-zinc-200", "text-zinc-900 dark:text-zinc-200",
"ring-zinc-200 dark:ring-zinc-400", "ring-zinc-200 dark:ring-zinc-400",
"placeholder:text-zinc-400 dark:placeholder:text-zinc-400", "placeholder:text-zinc-400 dark:placeholder:text-zinc-400",
@@ -58,7 +58,7 @@ defmodule MusicLibraryWeb.RecordLive.FormComponent do
</.label> </.label>
<span <span
:if={@uploads.cover_data.entries == []} :if={@uploads.cover_data.entries == []}
class="float-right text-zinc-700 dark:text-zinc-400" class="text-xs sm:text-sm float-right text-zinc-700 dark:text-zinc-400"
> >
{gettext("No cover selected")} {gettext("No cover selected")}
</span> </span>
@@ -66,7 +66,7 @@ defmodule MusicLibraryWeb.RecordLive.FormComponent do
<span class="float-right text-zinc-700 dark:text-zinc-400">{entry.progress}%</span> <span class="float-right text-zinc-700 dark:text-zinc-400">{entry.progress}%</span>
<% end %> <% end %>
<.live_file_input <.live_file_input
class="mt-2 block w-full rounded-lg text-zinc-900 dark:text-zinc-200 focus:ring-0 sm:text-sm sm:leading-6" class="mt-2 block w-full rounded-lg text-zinc-900 dark:text-zinc-200 focus:ring-0 text-xs sm:text-sm sm:leading-6"
upload={@uploads.cover_data} upload={@uploads.cover_data}
/> />
</div> </div>