azpect/Potion
1
1
Fork 0
Code Issues 9 Pull Requests Actions Packages Projects Releases Wiki Activity

(FIX): Better styles and some small fixes.

Browse Source
This commit is contained in:
Hayden Hargreaves 2025-11-30 22:01:13 -07:00
parent 25ac0fd527
commit 90ebdd3a9a
3 changed files with 6 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/components/cards/RecipeCardLarge.tsx
View File

@ -31,7 +31,7 @@ export default function RecipeCardLarge({ recipe }: RecipeCardLargeProps) {
return ( return (
<div className="flex flex-col items-center justify-between rounded-lg border-gray-300 border shadow-md p-4 flex-shrink-0"> <div className="flex flex-col items-center justify-between rounded-lg border-gray-300 border shadow-md p-4 flex-shrink-0">
<img className="size-80 rounded-sm" src={RecipePlaceholder} /> <img className="size-80 rounded-sm border border-gray-200 shadow-sm shadow-gray-100" src={RecipePlaceholder} />
<div className="w-full mt-8"> <div className="w-full mt-8">
<h2 className="font-semibold overflow-hidden whitespace-nowrap text-ellipsis"> <h2 className="font-semibold overflow-hidden whitespace-nowrap text-ellipsis">
{recipe.Title} {recipe.Title}

2
web/src/components/cards/RecipeCardSmall.tsx
View File

@ -25,7 +25,7 @@ export default function RecipeCardSmall({ recipe }: RecipeCardSmallProps) {
return ( return (
<div className="flex flex-col items-center justify-between rounded-lg border-gray-300 border shadow-md p-4 flex-shrink-0"> <div className="flex flex-col items-center justify-between rounded-lg border-gray-300 border shadow-md p-4 flex-shrink-0">
<img className="size-52 md:size-48 rounded-sm" src={RecipePlaceholder} /> <img className="size-52 md:size-48 rounded-sm border border-gray-200 shadow-sm shadow-gray-100" src={RecipePlaceholder} />
<div className="w-52 md:w-48 mt-8"> <div className="w-52 md:w-48 mt-8">
<h2 className="font-semibold overflow-hidden whitespace-nowrap text-ellipsis"> <h2 className="font-semibold overflow-hidden whitespace-nowrap text-ellipsis">
{recipe.Title} {recipe.Title}

5
web/src/components/items/RecipeSearchResult.tsx
View File

@ -63,7 +63,10 @@ export default function RecipeSearchResult({ recipe }: RecipeSearchResultProps)
)} )}
</div> </div>
</div> </div>
<p className="text-sm my-2 text-center md:text-left overflow-hidden text-ellipsis break-all" <div className="my-1">
<p className="text-xs text-gray-500 italic">{recipe.Tags.map(x => x.Name).join(", ")}</p>
</div>
<p className="text-sm text-center md:text-left overflow-hidden text-ellipsis break-all"
style={{ display: "-webkit-box", WebkitLineClamp: 3, WebkitBoxOrient: "vertical" }}> style={{ display: "-webkit-box", WebkitLineClamp: 3, WebkitBoxOrient: "vertical" }}>
{recipe.Description} {recipe.Description}
</p> </p>