indicate which sizing mode is in play

lib/labelmaker_web/constants.ex

@@ -9,6 +9,7 @@ defmodule LabelmakerWeb.Constants do
     link: "",
     outline: "none",
     size: "72",
+    sizing: "font",
     rows: 2,
     width: ""
   }

lib/labelmaker_web/live/home.html.heex

@@ -107,7 +107,7 @@
         </select>
       </div>
 
-      <div>
+      <div class={if(@sizing == "wxh", do: "opacity-50", else: "")}>
         <label for="size" class="block text-sm font-medium">Size</label>
         <select
           id="size"
@@ -120,7 +120,7 @@
         </select>
       </div>
 
-      <div>
+      <div class={if(@sizing == "font", do: "opacity-50", else: "")}>
         <label for="width" class="block text-sm font-medium">Width</label>
         <input
           type="number"
@@ -131,11 +131,15 @@
           step={1}
           value={if @width != 0, do: @width}
           placeholder="Image width"
-          class="mt-1 block w-full rounded border border-gray-300 px-3 py-2 bg-secondary-light text-fg-light dark:bg-secondary-dark dark:text-fg-dark dark:border-gray-600 focus:ring-primary"
+          class={[
+            "mt-1 block w-full rounded border border-gray-300 px-3 py-2",
+            "bg-secondary-light text-fg-light focus:ring-primary",
+            "dark:bg-secondary-dark dark:text-fg-dark dark:border-gray-600"
+          ]}
         />
       </div>
 
-      <div>
+      <div class={if(@sizing == "font", do: "opacity-50", else: "")}>
         <label for="height" class="block text-sm font-medium">Height</label>
         <input
           type="number"
@@ -155,6 +159,7 @@
       options={Constants.permitted_alignments()}
       selected={@align}
       event_name="update_alignment"
+      class={if(@sizing == "font", do: "opacity-50", else: "")}
     />
   </form>
 

lib/labelmaker_web/tools.ex

@@ -49,6 +49,9 @@ defmodule LabelmakerWeb.Tools do
         {:rows, _} ->
           {:rows, process_rows(parameters["label"])}
 
+        {:sizing, _} ->
+          {:sizing, process_sizing(parameters)}
+
         {:width, width} ->
           {:width, process_width(width, parameters)}
 
@@ -140,6 +143,14 @@ defmodule LabelmakerWeb.Tools do
     |> min(Constants.rows_max())
   end
 
+  defp process_sizing(%{"_target" => [target | _tail]})
+       when target in ["width", "height", "radio_option"],
+       do: "wxh"
+
+  defp process_sizing(%{"_target" => ["size" | _tail]}), do: "font"
+
+  defp process_sizing(%{"sizing" => sizing}), do: sizing
+
   def outline(_, error: true), do: outline(Constants.danger(), false)
   def outline("none", _error), do: ""