gavin/labelmaker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Phoenix Liveview had some complaints

Browse Source
This commit is contained in:
Gavin McDonald
2025-05-12 09:15:22 -04:00
parent 6e1a25b5d6
commit 15eb2512b0
1 changed files with 10 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
lib/labelmaker_web/live/home.ex
View File

@@ -33,7 +33,12 @@ defmodule LabelmakerWeb.Home do
end
def render(assigns) do
label_too_long = String.length(assigns.label) > Constants.max_label_length()
assigns =
assign(
assigns,
:label_too_long,
String.length(assigns.label) > Constants.max_label_length()
)
~H"""
<div class="max-w-xl mx-auto p-4 space-y-6">
@@ -41,10 +46,10 @@ defmodule LabelmakerWeb.Home do
<div
class={
"flex justify-center items-center p-4 overflow-hidden whitespace-nowrap bg-gradient-to-r from-black to-white border rounded transition duration-300 #{if label_too_long, do: "border-danger", else: "border-primary"} #{if label_too_long, do: "outline-danger", else: @outline != "none" && "outline-#{@outline}"}"}
style={"height: calc(2rem + #{@preview_height}px); color: #{if label_too_long, do: "white", else: @color}; font-family: #{@font}; font-size: #{@size}px; line-height: #{@size}px;"}
"flex justify-center items-center p-4 overflow-hidden whitespace-nowrap bg-gradient-to-r from-black to-white border rounded transition duration-300 #{if @label_too_long, do: "border-danger", else: "border-primary"} #{if @label_too_long, do: "outline-danger", else: @outline != "none" && "outline-#{@outline}"}"}
style={"height: calc(2rem + #{@preview_height}px); color: #{if @label_too_long, do: "white", else: @color}; font-family: #{@font}; font-size: #{@size}px; line-height: #{@size}px;"}
>
<%= if label_too_long do %>
<%= if @label_too_long do %>
{Constants.max_label_error()}
<% else %>
<%= for {str, i} <- Enum.with_index(@preview_text) do %>
@@ -63,7 +68,7 @@ defmodule LabelmakerWeb.Home do
name="label"
value={@label}
placeholder="Enter text"
class={"mt-1 block w-full rounded border border-gray-300 px-3 py-2 text-fg-light dark:text-fg-dark dark:border-gray-600 focus:ring-primary dark:placeholder-gray-400/50 transition duration-300 #{if label_too_long, do: "bg-danger", else: "bg-secondary-light dark:bg-secondary-dark"}"}
class={"mt-1 block w-full rounded border border-gray-300 px-3 py-2 text-fg-light dark:text-fg-dark dark:border-gray-600 focus:ring-primary dark:placeholder-gray-400/50 transition duration-300 #{if @label_too_long, do: "bg-danger", else: "bg-secondary-light dark:bg-secondary-dark"}"}
/>
</div>