From 2dc99c30c86aa2bb5a1f17f7ae0749c7f1773ce0 Mon Sep 17 00:00:00 2001 From: Hayden Hargreaves Date: Sun, 27 Jul 2025 18:41:10 -0700 Subject: [PATCH] (FIX/UI): Only displaying 3 lines in search results. --- internal/app/service/recipe_service.go | 2 +- internal/templates/pages/favorites.templ | 7 +- internal/templates/pages/favorites_templ.go | 4 +- internal/templates/pages/search.templ | 7 +- internal/templates/pages/search_templ.go | 4 +- web/static/css/tailwind.css | 78 ++++++++++++++++++++- 6 files changed, 93 insertions(+), 9 deletions(-) diff --git a/internal/app/service/recipe_service.go b/internal/app/service/recipe_service.go index 063db48..fc89a87 100644 --- a/internal/app/service/recipe_service.go +++ b/internal/app/service/recipe_service.go @@ -136,7 +136,7 @@ func (s *RecipeService) GetRecipe(id int, userId *int) (*domain.Recipe, error) { recipe, err := s.recipeRepository.GetRecipe(id, userId) if recipe == nil { - return nil, fmt.Errorf("Failed to get recipe from database. Nil result.") + return nil, fmt.Errorf("Recipe does not exist or has been relocated. Please try again.") } return recipe, err diff --git a/internal/templates/pages/favorites.templ b/internal/templates/pages/favorites.templ index b51f075..4fff94f 100644 --- a/internal/templates/pages/favorites.templ +++ b/internal/templates/pages/favorites.templ @@ -60,7 +60,12 @@ templ favoriteResult(recipe domain.Recipe) { -

{ recipe.Description }

+

+ { recipe.Description } +

} diff --git a/internal/templates/pages/favorites_templ.go b/internal/templates/pages/favorites_templ.go index a3fffd0..26b9e43 100644 --- a/internal/templates/pages/favorites_templ.go +++ b/internal/templates/pages/favorites_templ.go @@ -177,14 +177,14 @@ func favoriteResult(recipe domain.Recipe) templ.Component { if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "

") + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "

") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } var templ_7745c5c3_Var8 string templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(recipe.Description) if templ_7745c5c3_Err != nil { - return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/favorites.templ`, Line: 63, Col: 72} + return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/favorites.templ`, Line: 67, Col: 24} } _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8)) if templ_7745c5c3_Err != nil { diff --git a/internal/templates/pages/search.templ b/internal/templates/pages/search.templ index 6ec50ef..d82baec 100644 --- a/internal/templates/pages/search.templ +++ b/internal/templates/pages/search.templ @@ -84,7 +84,12 @@ templ searchResult(recipe domain.Recipe) { } -

{ recipe.Description }

+

+ { recipe.Description } +

} diff --git a/internal/templates/pages/search_templ.go b/internal/templates/pages/search_templ.go index 0dd6fc0..1c6ee7a 100644 --- a/internal/templates/pages/search_templ.go +++ b/internal/templates/pages/search_templ.go @@ -243,14 +243,14 @@ func searchResult(recipe domain.Recipe) templ.Component { return templ_7745c5c3_Err } } - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "

") + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "

") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } var templ_7745c5c3_Var9 string templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(recipe.Description) if templ_7745c5c3_Err != nil { - return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/search.templ`, Line: 87, Col: 72} + return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/search.templ`, Line: 91, Col: 24} } _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9)) if templ_7745c5c3_Err != nil { diff --git a/web/static/css/tailwind.css b/web/static/css/tailwind.css index 080b507..ab46c0e 100644 --- a/web/static/css/tailwind.css +++ b/web/static/css/tailwind.css @@ -238,6 +238,9 @@ .static { position: static; } + .top-1 { + top: calc(var(--spacing) * 1); + } .top-1\/2 { top: calc(1/2 * 100%); } @@ -247,6 +250,9 @@ .left-0 { left: calc(var(--spacing) * 0); } + .left-1 { + left: calc(var(--spacing) * 1); + } .left-1\/2 { left: calc(1/2 * 100%); } @@ -397,6 +403,12 @@ .h-20 { height: calc(var(--spacing) * 20); } + .h-56 { + height: calc(var(--spacing) * 56); + } + .h-72 { + height: calc(var(--spacing) * 72); + } .h-96 { height: calc(var(--spacing) * 96); } @@ -412,18 +424,24 @@ .h-screen { height: 100vh; } - .min-h-72 { - min-height: calc(var(--spacing) * 72); + .max-h-72 { + max-height: calc(var(--spacing) * 72); } .min-h-screen { min-height: 100vh; } + .w-1 { + width: calc(var(--spacing) * 1); + } .w-1\/3 { width: calc(1/3 * 100%); } .w-1\/4 { width: calc(1/4 * 100%); } + .w-3 { + width: calc(var(--spacing) * 3); + } .w-3\/4 { width: calc(3/4 * 100%); } @@ -436,6 +454,9 @@ .w-5 { width: calc(var(--spacing) * 5); } + .w-9 { + width: calc(var(--spacing) * 9); + } .w-9\/10 { width: calc(9/10 * 100%); } @@ -457,6 +478,9 @@ .max-w-2xl { max-width: var(--container-2xl); } + .flex-shrink { + flex-shrink: 1; + } .flex-shrink-0 { flex-shrink: 0; } @@ -466,10 +490,21 @@ .flex-grow { flex-grow: 1; } + .border-collapse { + border-collapse: collapse; + } + .-translate-x-1 { + --tw-translate-x: calc(var(--spacing) * -1); + translate: var(--tw-translate-x) var(--tw-translate-y); + } .-translate-x-1\/2 { --tw-translate-x: calc(calc(1/2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); } + .-translate-y-1 { + --tw-translate-y: calc(var(--spacing) * -1); + translate: var(--tw-translate-x) var(--tw-translate-y); + } .-translate-y-1\/2 { --tw-translate-y: calc(calc(1/2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); @@ -482,9 +517,15 @@ --tw-scale-y: 50%; scale: var(--tw-scale-x) var(--tw-scale-y); } + .transform { + transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,); + } .cursor-pointer { cursor: pointer; } + .resize { + resize: both; + } .resize-none { resize: none; } @@ -839,6 +880,9 @@ .text-ellipsis { text-overflow: ellipsis; } + .whitespace-normal { + white-space: normal; + } .whitespace-nowrap { white-space: nowrap; } @@ -1308,6 +1352,11 @@ height: calc(var(--spacing) * 24); } } + .md\:h-40 { + @media (width >= 48rem) { + height: calc(var(--spacing) * 40); + } + } .md\:w-1\/2 { @media (width >= 48rem) { width: calc(1/2 * 100%); @@ -1494,6 +1543,26 @@ inherits: false; initial-value: 1; } +@property --tw-rotate-x { + syntax: "*"; + inherits: false; +} +@property --tw-rotate-y { + syntax: "*"; + inherits: false; +} +@property --tw-rotate-z { + syntax: "*"; + inherits: false; +} +@property --tw-skew-x { + syntax: "*"; + inherits: false; +} +@property --tw-skew-y { + syntax: "*"; + inherits: false; +} @property --tw-border-style { syntax: "*"; inherits: false; @@ -1703,6 +1772,11 @@ --tw-scale-x: 1; --tw-scale-y: 1; --tw-scale-z: 1; + --tw-rotate-x: initial; + --tw-rotate-y: initial; + --tw-rotate-z: initial; + --tw-skew-x: initial; + --tw-skew-y: initial; --tw-border-style: solid; --tw-gradient-position: initial; --tw-gradient-from: #0000;