This commit is contained in:
Gavin McDonald
2025-05-16 17:06:26 -04:00
4 changed files with 58 additions and 60 deletions

View File

@@ -3,37 +3,3 @@
@import 'tailwindcss/utilities';
/* This file is for your main application CSS */
.outline-black {
text-shadow:
-1px -1px 0 black,
1px -1px 0 black,
-1px 1px 0 black,
1px 1px 0 black;
}
.outline-gray {
text-shadow:
-1px -1px 0 gray,
1px -1px 0 gray,
-1px 1px 0 gray,
1px 1px 0 gray;
}
.outline-white {
color: white;
text-shadow:
-1px -1px 0 white,
1px -1px 0 white,
-1px 1px 0 white,
1px 1px 0 white;
}
.outline-danger {
color: #ff6b6b;
text-shadow:
-1px -1px 0 #ff6b6b,
1px -1px 0 #ff6b6b,
-1px 1px 0 #ff6b6b,
1px 1px 0 #ff6b6b;
}

View File

@@ -19,42 +19,63 @@ defmodule LabelmakerWeb.Constants do
|> Map.keys()
|> Enum.map(&Atom.to_string/1)
@colors System.cmd("magick", ["-list", "color"])
|> elem(0)
|> String.split("\n")
# drop header stuff
|> Enum.drop(5)
|> Enum.map(fn color_info -> color_info |> String.split() |> List.first() end)
|> Enum.reject(&is_nil/1)
# filter out colors that end in a number (no CSS equivalent)
|> Enum.reject(fn color -> String.match?(color, ~r/\d+$/) end)
|> Enum.uniq()
@colors [
"black",
"blue",
"brown",
"gray",
"green",
"orange",
"pink",
"purple",
"red",
"white",
"yellow"
]
@fonts System.cmd("magick", ["-list", "font"])
|> elem(0)
|> String.split("\n")
|> Enum.filter(&String.starts_with?(&1, " Font:"))
|> Enum.reject(&String.starts_with?(&1, " Font: ."))
|> Enum.map(&String.trim_leading(&1, " Font: "))
@danger "#FF6B6B"
@font_map %{
"cs" => "Comic-Sans-MS",
"comic" => "Comic-Sans-MS",
"comic sans" => "Comic-Sans-MS",
"comic-sans" => "Comic-Sans-MS",
"comic-sans-ms" => "Comic-Sans-MS",
"cr" => "Courier",
"courier" => "Courier",
"g" => "Georgia",
"georgia" => "Georgia",
"h" => "Helvetica",
"helvetica" => "Helvetica",
"i" => "Impact",
"impact" => "Impact",
"v" => "Verdana",
"verdana" => "Verdana"
}
@max_label_length 64
@max_label_error "64-character maximum"
@outlines ~w(none white black gray)
@sizes 16..128
|> Enum.to_list()
|> Enum.take_every(8)
|> Enum.map(&Integer.to_string/1)
def colors, do: @colors
def color_count, do: @colors |> length()
def danger, do: @danger
def defaults, do: @defaults
def fonts, do: @fonts
def font_count, do: @fonts |> length()
def fonts,
do:
@font_map
|> Map.values()
|> Enum.uniq()
|> Enum.map(fn color -> color |> String.replace("-MS", "") |> String.replace("-", " ") end)
def font_map, do: @font_map
def max_label_length, do: @max_label_length
def max_label_error, do: @max_label_error
def outlines, do: @outlines
def outlines, do: ["none" | @colors]
def permitted_keys, do: @permitted_keys
def preview, do: @preview
def sizes, do: @sizes

View File

@@ -43,7 +43,7 @@ defmodule LabelmakerWeb.Home do
case assigns.preview_bg do
"r" -> "bg-[linear-gradient(to_right,_black_33%,_white_67%)]"
"b" -> "bg-[linear-gradient(to_bottom,_black_33%,_white_67%)]"
"c" -> "bg-[#{assigns.color}]"
"c" -> ""
_ -> "bg-[linear-gradient(to_right,_black_33%,_white_67%)]"
end
@@ -61,7 +61,7 @@ defmodule LabelmakerWeb.Home do
<div
class={
"flex justify-center items-center p-4 overflow-hidden whitespace-nowrap border rounded transition duration-300 #{@preview_background} #{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; background-color: #{if @preview_bg == "c", do: @color, else: ""}"}
style={"height: calc(2rem + #{@preview_height}px); color: #{if @label_too_long, do: "white", else: @color}; #{Tools.outline(@outline, @label_too_long)} font-family: #{@font}; font-size: #{@size}px; line-height: #{@size}px; background-color: #{if @preview_bg == "c", do: @color, else: ""}"}
>
<%= if @label_too_long do %>
{Constants.max_label_error()}
@@ -74,7 +74,7 @@ defmodule LabelmakerWeb.Home do
</div>
<div class="flex flex-row justify-between" style="margin-top: 5px;">
<p class="text-xs text-gray-600 dark:text-gray-400 m-0 ml-1">
Note: not all fonts and colors are available for preview.
Note: not all fonts are available for preview.
</p>
<div class="flex flex-row gap-1">
<div

View File

@@ -8,6 +8,7 @@ defmodule LabelmakerWeb.Tools do
alias LabelmakerWeb.Constants
def process_parameters(parameters) do
# ensure our defaults are in place to cover any missing parameters
%{"label" => label, "size" => size} =
Constants.defaults()
|> Map.new(fn {k, v} -> {Atom.to_string(k), v} end)
@@ -22,6 +23,9 @@ defmodule LabelmakerWeb.Tools do
|> Map.take(Constants.permitted_keys())
|> Map.new(fn {k, v} -> {String.to_atom(k), v} end)
|> Enum.map(fn
{:font, font} ->
{:font, Constants.font_map()[String.downcase(font)]}
{:label, label} ->
if String.length(label) > Constants.max_label_length(),
do: {:label, String.slice(label, 0, Constants.max_label_length() + 1)},
@@ -41,7 +45,7 @@ defmodule LabelmakerWeb.Tools do
end)
|> Enum.filter(fn
{:color, color} -> color in Constants.colors()
{:font, font} -> font in Constants.fonts()
{:font, font} -> font in Map.values(Constants.font_map())
{:outline, outline} -> outline in Constants.outlines()
{:size, size} -> size in Constants.sizes()
_ -> true
@@ -50,4 +54,11 @@ defmodule LabelmakerWeb.Tools do
Map.merge(Constants.defaults(), parameters)
end
def outline(_, error: true), do: outline(Constants.danger(), false)
def outline("none", _error), do: ""
def outline(color, _error),
do:
"text-shadow: -1px -1px 0 #{color}, 1px -1px 0 #{color}, -1px 1px 0 #{color}, 1px 1px 0 #{color};"
end