From ac00a321d5634a553257f8465e3af44e550b35c3 Mon Sep 17 00:00:00 2001 From: Hayden Hargreaves Date: Mon, 23 Jun 2025 20:18:58 -0700 Subject: [PATCH] (UI/STYLE): Added heart buttons. Need to work on the search piece, its not amazing right now. --- doc/TechnicalSpecification.md | 32 +-- internal/templates/pages/home.templ | 374 +++++++++++++------------ internal/templates/pages/home_templ.go | 216 ++++++++++---- web/static/css/tailwind.css | 271 +----------------- 4 files changed, 384 insertions(+), 509 deletions(-) diff --git a/doc/TechnicalSpecification.md b/doc/TechnicalSpecification.md index aa744cc..0ad9d2f 100644 --- a/doc/TechnicalSpecification.md +++ b/doc/TechnicalSpecification.md @@ -38,9 +38,9 @@ well as view lists of recently made recipes, recently viewed and trending recipe ##### UI Requirements -- [ ] Welcome Banner - - [ ] Video display with large text overhead - - [ ] Sub text below the video with a "Call to Action" +- [x] Welcome Banner + - [x] Video display with large text overhead + - [x] Sub text below the video with a "Call to Action" - [ ] Interactive banner that can be hidden with a "Got it!" or "X" - [ ] Message & Pills Banner @@ -56,22 +56,22 @@ well as view lists of recently made recipes, recently viewed and trending recipe - [ ] **Filter by difficulty** - *1 to 5 stars* - [ ] **Filter by serving size** - *1 to 16* -- [ ] Recipe of The Week - - [ ] **Single recipe display** of the best performing recipe, with spotlight effect - - [ ] **Display recipe details in depth** - Title, duration, **image***, meal category, simplified description - - [ ] **Make now** button to allow easy access to meal directions +- [x] Recipe of The Week + - [x] **Single recipe display** of the best performing recipe, with spotlight effect + - [x] **Display recipe details in depth** - Title, duration, **image***, meal category, simplified description + - [x] **Make now** button to allow easy access to meal directions -- [ ] Recently Viewed List - - [ ] Scrolling list of the most recent 5-10 recipes viewed - - [ ] **Display recipe details** - Title, duration, **image***, meal category, and a heart to like the recipe +- [x] Recently Viewed List + - [x] Scrolling list of the most recent 5-10 recipes viewed + - [x] **Display recipe details** - Title, duration, **image***, meal category, and a heart to like the recipe -- [ ] Make Again List - - [ ] Scrolling list of the most recent 5-10 recipes made - - [ ] **Display recipe details** - Title, duration, **image***, meal category, and a heart to like the recipe +- [x] Make Again List + - [x] Scrolling list of the most recent 5-10 recipes made + - [x] **Display recipe details** - Title, duration, **image***, meal category, and a heart to like the recipe -- [ ] Create Recipe CTA (call-to-action) - - [ ] **Large CTA banner** with text prompting users to create a recipe - - [ ] **Button** to take the user to the create page +- [x] Create Recipe CTA (call-to-action) + - [x] **Large CTA banner** with text prompting users to create a recipe + - [x] **Button** to take the user to the create page '*': Not sure yet, still under consideration diff --git a/internal/templates/pages/home.templ b/internal/templates/pages/home.templ index 5be3722..f4dd750 100644 --- a/internal/templates/pages/home.templ +++ b/internal/templates/pages/home.templ @@ -3,211 +3,227 @@ package templates import "github.com/haydenhargreaves/Potion/internal/templates/components" templ introSection() { -
-
- -

- Discover Your Next Favorite Meal -

-
-

- Welcome to your ultimate recipe hub! Whether you're a seasoned chef or just starting your culinary adventure, - we're here to inspire. Explore thousands of delicious recipes, from quick weeknight dinners to gourmet delights, - all at your fingertips. Find exactly what you're craving with our powerful search and intuitive filters, or - browse our trending dishes for fresh ideas. -

-
+
+
+ +

+ Discover Your Next Favorite Meal +

+
+

+ Welcome to your ultimate recipe hub! Whether you're a seasoned chef or just starting your culinary adventure, + we're here to inspire. Explore thousands of delicious recipes, from quick weeknight dinners to gourmet delights, + all at your fingertips. Find exactly what you're craving with our powerful search and intuitive filters, or + browse our trending dishes for fresh ideas. +

+
} templ pillButton(name string) { - + } templ bannerText(content string) { -

- { content } -

+

+ { content } +

} templ searchBar() { -
- - - - -
+
+ + + + +
} templ searchSection() { -
- @bannerText("Craving Something Specific?") -
- @searchBar() -
- @pillButton("Breakfast") - @pillButton("Lunch") - @pillButton("Dinner") - @pillButton("Desert") - @pillButton("Snack") - @pillButton("Side") - @pillButton("Other") -
- -
-
+
+ @bannerText("Craving Something Specific?") +
+ @searchBar() +
+ @pillButton("Breakfast") + @pillButton("Lunch") + @pillButton("Dinner") + @pillButton("Desert") + @pillButton("Snack") + @pillButton("Side") + @pillButton("Other") +
+ +
+
} -templ highlightSection() { -
- @bannerText("Recipe of the Week!") -

- Our 'Recipe of the Week' is the cream of the crop! We handpick it by looking at what recipes - our community loves most. This isn't just about how many people view a recipe; it's also about - how many times it's been made, liked, reviewed, and its average rating, all combined to find - the true fan favorite of the week. It's our way of highlighting the best recipes that truly - resonate with our users! -

-
-
- -
-

Avocado Toast

-

- Hayden Hargreaves -

-

- Avocado toast is a delicious and simple breakfast, snack or light meal! Learn how to - make the BEST avocado toast with this recipe, plus fun variations. - Avocado toast is a delicious and simple breakfast, snack or light meal! Learn how to - make the BEST avocado toast with this recipe, plus fun variations. - Avocado toast is a delicious and simple breakfast, snack or light meal! Learn how to - make the BEST avocado toast with this recipe, plus fun variations. -

-

- Breakfast - 15 min -

- -
-
-
-
+templ largeLikeButton(liked bool) { + } -templ smallRecipeIcon(name, meal, author string) { -
- -
-

- { name } -

-

- { author } -

-

{ meal }

- -
-
+templ highlightSection(liked bool) { +
+ @bannerText("Recipe of the Week!") +

+ Our 'Recipe of the Week' is the cream of the crop! We handpick it by looking at what recipes + our community loves most. This isn't just about how many people view a recipe; it's also about + how many times it's been made, liked, reviewed, and its average rating, all combined to find + the true fan favorite of the week. It's our way of highlighting the best recipes that truly + resonate with our users! +

+
+
+ +
+

Avocado Toast

+

+ Hayden Hargreaves +

+

+ Avocado toast is a delicious and simple breakfast, snack or light meal! Learn how to + make the BEST avocado toast with this recipe, plus fun variations. + Avocado toast is a delicious and simple breakfast, snack or light meal! Learn how to + make the BEST avocado toast with this recipe, plus fun variations. + Avocado toast is a delicious and simple breakfast, snack or light meal! Learn how to + make the BEST avocado toast with this recipe, plus fun variations. +

+
+

+ Breakfast - 15 min +

+ @likeButton(liked) +
+ +
+
+
+
+} + +templ likeButton(liked bool) { + +} + +templ smallRecipeIcon(name, meal, author string, liked bool) { +
+ +
+

+ { name } +

+

+ { author } +

+
+

+ { meal } +

+ @likeButton(liked) +
+ +
+
} templ listsSection() { -
- @bannerText("Take Another Look.") -
-

Recently viewed

-
- @smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves") - @smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves") - @smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves") - @smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves") - @smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves") - @smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves") -
-

Make again

-
- @smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves") - @smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves") - @smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves") - @smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves") - @smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves") - @smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves") -
-
-
+
+ @bannerText("Take Another Look.") +
+

Recently viewed

+
+ @smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves", true) + @smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves", false) + @smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves", false) + @smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves", true) + @smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves", false) + @smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves", false) +
+

Make again

+
+ @smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves", true) + @smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves", false) + @smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves", false) + @smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves", true) + @smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves", false) + @smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves", false) +
+
+
} templ ctaSection() { -
-

- Unleash Your Inner Chef! -

-

- Have a unique recipe idea? Want to share your culinary masterpiece with the world? - It's time to bring your creations to life! -

- +

+ Unleash Your Inner Chef! +

+

+ Have a unique recipe idea? Want to share your culinary masterpiece with the world? + It's time to bring your creations to life! +

+
- Create Your Recipe! - -
+ text-lg md:text-2xl font-bold uppercase tracking-wide"> + Create Your Recipe! + + } templ HomePage() { - @components.Navbar("home") -
-
- @introSection() - @searchSection() - @highlightSection() - @listsSection() - @ctaSection() -
-
+@components.Navbar("home") +
+
+ @introSection() + @searchSection() + @highlightSection(false) + @listsSection() + @ctaSection() +
+
} diff --git a/internal/templates/pages/home_templ.go b/internal/templates/pages/home_templ.go index 541736a..00eaa66 100644 --- a/internal/templates/pages/home_templ.go +++ b/internal/templates/pages/home_templ.go @@ -67,7 +67,7 @@ func pillButton(name string) templ.Component { var templ_7745c5c3_Var3 string templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(name) if templ_7745c5c3_Err != nil { - return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/home.templ`, Line: 31, Col: 8} + return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/home.templ`, Line: 28, Col: 8} } _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3)) if templ_7745c5c3_Err != nil { @@ -109,7 +109,7 @@ func bannerText(content string) templ.Component { var templ_7745c5c3_Var5 string templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(content) if templ_7745c5c3_Err != nil { - return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/home.templ`, Line: 37, Col: 11} + return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/home.templ`, Line: 34, Col: 11} } _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5)) if templ_7745c5c3_Err != nil { @@ -229,7 +229,7 @@ func searchSection() templ.Component { }) } -func highlightSection() templ.Component { +func largeLikeButton(liked bool) templ.Component { return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) { templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil { @@ -250,15 +250,22 @@ func highlightSection() templ.Component { templ_7745c5c3_Var8 = templ.NopComponent } ctx = templ.ClearChildren(ctx) - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "
") + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "
") + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } @@ -266,7 +273,7 @@ func highlightSection() templ.Component { }) } -func smallRecipeIcon(name, meal, author string) templ.Component { +func highlightSection(liked bool) templ.Component { return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) { templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil { @@ -287,46 +294,143 @@ func smallRecipeIcon(name, meal, author string) templ.Component { templ_7745c5c3_Var9 = templ.NopComponent } ctx = templ.ClearChildren(ctx) - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "

") + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "
") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - var templ_7745c5c3_Var10 string - templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(name) - if templ_7745c5c3_Err != nil { - return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/home.templ`, Line: 137, Col: 10} - } - _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10)) + templ_7745c5c3_Err = bannerText("Recipe of the Week!").Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "

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

Our 'Recipe of the Week' is the cream of the crop! We handpick it by looking at what recipes our community loves most. This isn't just about how many people view a recipe; it's also about how many times it's been made, liked, reviewed, and its average rating, all combined to find the true fan favorite of the week. It's our way of highlighting the best recipes that truly resonate with our users!

Avocado Toast

Hayden Hargreaves

Avocado toast is a delicious and simple breakfast, snack or light meal! Learn how to make the BEST avocado toast with this recipe, plus fun variations. Avocado toast is a delicious and simple breakfast, snack or light meal! Learn how to make the BEST avocado toast with this recipe, plus fun variations. Avocado toast is a delicious and simple breakfast, snack or light meal! Learn how to make the BEST avocado toast with this recipe, plus fun variations.

Breakfast - 15 min

") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - var templ_7745c5c3_Var11 string - templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(author) - if templ_7745c5c3_Err != nil { - return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/home.templ`, Line: 140, Col: 12} - } - _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11)) + templ_7745c5c3_Err = likeButton(liked).Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "

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

") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + return nil + }) +} + +func likeButton(liked bool) templ.Component { + return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) { + templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context + if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil { + return templ_7745c5c3_CtxErr + } + templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W) + if !templ_7745c5c3_IsBuffer { + defer func() { + templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer) + if templ_7745c5c3_Err == nil { + templ_7745c5c3_Err = templ_7745c5c3_BufErr + } + }() + } + ctx = templ.InitializeContext(ctx) + templ_7745c5c3_Var10 := templ.GetChildren(ctx) + if templ_7745c5c3_Var10 == nil { + templ_7745c5c3_Var10 = templ.NopComponent + } + ctx = templ.ClearChildren(ctx) + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + return nil + }) +} + +func smallRecipeIcon(name, meal, author string, liked bool) templ.Component { + return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) { + templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context + if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil { + return templ_7745c5c3_CtxErr + } + templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W) + if !templ_7745c5c3_IsBuffer { + defer func() { + templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer) + if templ_7745c5c3_Err == nil { + templ_7745c5c3_Err = templ_7745c5c3_BufErr + } + }() + } + ctx = templ.InitializeContext(ctx) + templ_7745c5c3_Var11 := templ.GetChildren(ctx) + if templ_7745c5c3_Var11 == nil { + templ_7745c5c3_Var11 = templ.NopComponent + } + ctx = templ.ClearChildren(ctx) + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "

") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } var templ_7745c5c3_Var12 string - templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(meal) + templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(name) if templ_7745c5c3_Err != nil { - return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/home.templ`, Line: 142, Col: 72} + return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/home.templ`, Line: 153, Col: 12} } _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12)) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "

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

") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + var templ_7745c5c3_Var13 string + templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(author) + if templ_7745c5c3_Err != nil { + return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/home.templ`, Line: 156, Col: 14} + } + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13)) + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "

") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + var templ_7745c5c3_Var14 string + templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(meal) + if templ_7745c5c3_Err != nil { + return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/home.templ`, Line: 160, Col: 14} + } + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14)) + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "

") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + templ_7745c5c3_Err = likeButton(liked).Render(ctx, templ_7745c5c3_Buffer) + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, "
") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } @@ -350,12 +454,12 @@ func listsSection() templ.Component { }() } ctx = templ.InitializeContext(ctx) - templ_7745c5c3_Var13 := templ.GetChildren(ctx) - if templ_7745c5c3_Var13 == nil { - templ_7745c5c3_Var13 = templ.NopComponent + templ_7745c5c3_Var15 := templ.GetChildren(ctx) + if templ_7745c5c3_Var15 == nil { + templ_7745c5c3_Var15 = templ.NopComponent } ctx = templ.ClearChildren(ctx) - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "
") + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, "
") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } @@ -363,63 +467,63 @@ func listsSection() templ.Component { if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "

Recently viewed

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

Recently viewed

") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves").Render(ctx, templ_7745c5c3_Buffer) + templ_7745c5c3_Err = smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves", true).Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves").Render(ctx, templ_7745c5c3_Buffer) + templ_7745c5c3_Err = smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves", false).Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves").Render(ctx, templ_7745c5c3_Buffer) + templ_7745c5c3_Err = smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves", false).Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves").Render(ctx, templ_7745c5c3_Buffer) + templ_7745c5c3_Err = smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves", true).Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves").Render(ctx, templ_7745c5c3_Buffer) + templ_7745c5c3_Err = smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves", false).Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves").Render(ctx, templ_7745c5c3_Buffer) + templ_7745c5c3_Err = smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves", false).Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "

Make again

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

Make again

") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves").Render(ctx, templ_7745c5c3_Buffer) + templ_7745c5c3_Err = smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves", true).Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves").Render(ctx, templ_7745c5c3_Buffer) + templ_7745c5c3_Err = smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves", false).Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves").Render(ctx, templ_7745c5c3_Buffer) + templ_7745c5c3_Err = smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves", false).Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves").Render(ctx, templ_7745c5c3_Buffer) + templ_7745c5c3_Err = smallRecipeIcon("Avocado Toast", "Breakfast - 15 min", "Hayden Hargreaves", true).Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves").Render(ctx, templ_7745c5c3_Buffer) + templ_7745c5c3_Err = smallRecipeIcon("Fried Chicken", "Dinner - 120 min", "Hayden Hargreaves", false).Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves").Render(ctx, templ_7745c5c3_Buffer) + templ_7745c5c3_Err = smallRecipeIcon("Classic Butter Chicken", "Dinner - 60 min", "Hayden Hargreaves", false).Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "
") + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 30, "
") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } @@ -443,12 +547,12 @@ func ctaSection() templ.Component { }() } ctx = templ.InitializeContext(ctx) - templ_7745c5c3_Var14 := templ.GetChildren(ctx) - if templ_7745c5c3_Var14 == nil { - templ_7745c5c3_Var14 = templ.NopComponent + templ_7745c5c3_Var16 := templ.GetChildren(ctx) + if templ_7745c5c3_Var16 == nil { + templ_7745c5c3_Var16 = templ.NopComponent } ctx = templ.ClearChildren(ctx) - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "

Unleash Your Inner Chef!

Have a unique recipe idea? Want to share your culinary masterpiece with the world? It's time to bring your creations to life!

Create Your Recipe!
") + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 31, "

Unleash Your Inner Chef!

Have a unique recipe idea? Want to share your culinary masterpiece with the world? It's time to bring your creations to life!

Create Your Recipe!
") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } @@ -472,16 +576,16 @@ func HomePage() templ.Component { }() } ctx = templ.InitializeContext(ctx) - templ_7745c5c3_Var15 := templ.GetChildren(ctx) - if templ_7745c5c3_Var15 == nil { - templ_7745c5c3_Var15 = templ.NopComponent + templ_7745c5c3_Var17 := templ.GetChildren(ctx) + if templ_7745c5c3_Var17 == nil { + templ_7745c5c3_Var17 = templ.NopComponent } ctx = templ.ClearChildren(ctx) templ_7745c5c3_Err = components.Navbar("home").Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "
") + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, "
") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } @@ -493,7 +597,7 @@ func HomePage() templ.Component { if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = highlightSection().Render(ctx, templ_7745c5c3_Buffer) + templ_7745c5c3_Err = highlightSection(false).Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } @@ -505,7 +609,7 @@ func HomePage() templ.Component { if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "
") + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 33, "
") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } diff --git a/web/static/css/tailwind.css b/web/static/css/tailwind.css index a4dac4f..ea1a457 100644 --- a/web/static/css/tailwind.css +++ b/web/static/css/tailwind.css @@ -248,9 +248,6 @@ .mx-4 { margin-inline: calc(var(--spacing) * 4); } - .mx-8 { - margin-inline: calc(var(--spacing) * 8); - } .my-2 { margin-block: calc(var(--spacing) * 2); } @@ -260,9 +257,6 @@ .my-8 { margin-block: calc(var(--spacing) * 8); } - .my-16 { - margin-block: calc(var(--spacing) * 16); - } .mt-2 { margin-top: calc(var(--spacing) * 2); } @@ -278,12 +272,6 @@ .mt-16 { margin-top: calc(var(--spacing) * 16); } - .mr-3 { - margin-right: calc(var(--spacing) * 3); - } - .mb-2 { - margin-bottom: calc(var(--spacing) * 2); - } .mb-6 { margin-bottom: calc(var(--spacing) * 6); } @@ -318,42 +306,10 @@ width: calc(var(--spacing) * 5); height: calc(var(--spacing) * 5); } - .size-6 { - width: calc(var(--spacing) * 6); - height: calc(var(--spacing) * 6); - } - .size-7 { - width: calc(var(--spacing) * 7); - height: calc(var(--spacing) * 7); - } - .size-8 { - width: calc(var(--spacing) * 8); - height: calc(var(--spacing) * 8); - } - .size-9 { - width: calc(var(--spacing) * 9); - height: calc(var(--spacing) * 9); - } - .size-24 { - width: calc(var(--spacing) * 24); - height: calc(var(--spacing) * 24); - } - .size-28 { - width: calc(var(--spacing) * 28); - height: calc(var(--spacing) * 28); - } .size-32 { width: calc(var(--spacing) * 32); height: calc(var(--spacing) * 32); } - .size-64 { - width: calc(var(--spacing) * 64); - height: calc(var(--spacing) * 64); - } - .size-72 { - width: calc(var(--spacing) * 72); - height: calc(var(--spacing) * 72); - } .size-80 { width: calc(var(--spacing) * 80); height: calc(var(--spacing) * 80); @@ -364,11 +320,8 @@ .h-5 { height: calc(var(--spacing) * 5); } - .h-7 { - height: calc(var(--spacing) * 7); - } - .h-96 { - height: calc(var(--spacing) * 96); + .h-6 { + height: calc(var(--spacing) * 6); } .h-auto { height: auto; @@ -382,21 +335,6 @@ .h-screen { height: 100vh; } - .w-1 { - width: calc(var(--spacing) * 1); - } - .w-1\/4 { - width: calc(1/4 * 100%); - } - .w-1\/5 { - width: calc(1/5 * 100%); - } - .w-2 { - width: calc(var(--spacing) * 2); - } - .w-2\/5 { - width: calc(2/5 * 100%); - } .w-3 { width: calc(var(--spacing) * 3); } @@ -412,30 +350,18 @@ .w-5 { width: calc(var(--spacing) * 5); } - .w-7 { - width: calc(var(--spacing) * 7); - } .w-9 { width: calc(var(--spacing) * 9); } .w-9\/10 { width: calc(9/10 * 100%); } - .w-24 { - width: calc(var(--spacing) * 24); - } .w-32 { width: calc(var(--spacing) * 32); } - .w-40 { - width: calc(var(--spacing) * 40); - } .w-44 { width: calc(var(--spacing) * 44); } - .w-48 { - width: calc(var(--spacing) * 48); - } .w-fit { width: fit-content; } @@ -473,9 +399,6 @@ --tw-translate-y: calc(calc(1/2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-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; } @@ -485,9 +408,6 @@ .flex-col { flex-direction: column; } - .flex-nowrap { - flex-wrap: nowrap; - } .flex-wrap { flex-wrap: wrap; } @@ -500,6 +420,9 @@ .items-center { align-items: center; } + .items-end { + align-items: flex-end; + } .justify-between { justify-content: space-between; } @@ -521,24 +444,12 @@ .gap-x-4 { column-gap: calc(var(--spacing) * 4); } - .gap-y-4 { - row-gap: calc(var(--spacing) * 4); - } .overflow-hidden { overflow: hidden; } .overflow-x-auto { overflow-x: auto; } - .overflow-x-hidden { - overflow-x: hidden; - } - .overflow-y-auto { - overflow-y: auto; - } - .overflow-y-scroll { - overflow-y: scroll; - } .rounded-full { border-radius: calc(infinity * 1px); } @@ -580,9 +491,6 @@ .border-gray-300 { border-color: var(--color-gray-300); } - .border-red-500 { - border-color: var(--color-red-500); - } .border-white { border-color: var(--color-white); } @@ -598,9 +506,6 @@ .bg-gray-200 { background-color: var(--color-gray-200); } - .bg-red-500 { - background-color: var(--color-red-500); - } .bg-white { background-color: var(--color-white); } @@ -612,10 +517,6 @@ --tw-gradient-position: to right in oklab; background-image: linear-gradient(var(--tw-gradient-stops)); } - .from-blue-50 { - --tw-gradient-from: var(--color-blue-50); - --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); - } .from-blue-100 { --tw-gradient-from: var(--color-blue-100); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); @@ -624,18 +525,6 @@ --tw-gradient-from: var(--color-blue-400); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } - .from-blue-500 { - --tw-gradient-from: var(--color-blue-500); - --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); - } - .to-blue-100 { - --tw-gradient-to: var(--color-blue-100); - --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); - } - .to-blue-200 { - --tw-gradient-to: var(--color-blue-200); - --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); - } .to-blue-600 { --tw-gradient-to: var(--color-blue-600); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); @@ -644,13 +533,6 @@ --tw-gradient-to: var(--color-purple-100); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } - .to-purple-600 { - --tw-gradient-to: var(--color-purple-600); - --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); - } - .p-0 { - padding: calc(var(--spacing) * 0); - } .p-2 { padding: calc(var(--spacing) * 2); } @@ -762,6 +644,9 @@ .whitespace-nowrap { white-space: nowrap; } + .text-black { + color: var(--color-black); + } .text-blue-500 { color: var(--color-blue-500); } @@ -777,6 +662,9 @@ .text-gray-800 { color: var(--color-gray-800); } + .text-red-500 { + color: var(--color-red-500); + } .text-white { color: var(--color-white); } @@ -790,10 +678,6 @@ --tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / 0.05)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } - .shadow-lg { - --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } .shadow-md { --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); @@ -802,65 +686,24 @@ --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } - .shadow-xl { - --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - .ring-2 { - --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - .shadow-black { - --tw-shadow-color: #000; - @supports (color: color-mix(in lab, red, red)) { - --tw-shadow-color: color-mix(in oklab, var(--color-black) var(--tw-shadow-alpha), transparent); - } - } - .shadow-blue-100 { - --tw-shadow-color: oklch(93.2% 0.032 255.585); - @supports (color: color-mix(in lab, red, red)) { - --tw-shadow-color: color-mix(in oklab, var(--color-blue-100) var(--tw-shadow-alpha), transparent); - } - } .shadow-blue-300 { --tw-shadow-color: oklch(80.9% 0.105 251.813); @supports (color: color-mix(in lab, red, red)) { --tw-shadow-color: color-mix(in oklab, var(--color-blue-300) var(--tw-shadow-alpha), transparent); } } - .shadow-blue-500 { - --tw-shadow-color: oklch(62.3% 0.214 259.815); - @supports (color: color-mix(in lab, red, red)) { - --tw-shadow-color: color-mix(in oklab, var(--color-blue-500) var(--tw-shadow-alpha), transparent); - } - } - .shadow-blue-600 { - --tw-shadow-color: oklch(54.6% 0.245 262.881); - @supports (color: color-mix(in lab, red, red)) { - --tw-shadow-color: color-mix(in oklab, var(--color-blue-600) var(--tw-shadow-alpha), transparent); - } - } .shadow-blue-700 { --tw-shadow-color: oklch(48.8% 0.243 264.376); @supports (color: color-mix(in lab, red, red)) { --tw-shadow-color: color-mix(in oklab, var(--color-blue-700) var(--tw-shadow-alpha), transparent); } } - .shadow-blue-800 { - --tw-shadow-color: oklch(42.4% 0.199 265.638); - @supports (color: color-mix(in lab, red, red)) { - --tw-shadow-color: color-mix(in oklab, var(--color-blue-800) var(--tw-shadow-alpha), transparent); - } - } .shadow-gray-300 { --tw-shadow-color: oklch(87.2% 0.01 258.338); @supports (color: color-mix(in lab, red, red)) { --tw-shadow-color: color-mix(in oklab, var(--color-gray-300) var(--tw-shadow-alpha), transparent); } } - .ring-transparent { - --tw-ring-color: transparent; - } .outline { outline-style: var(--tw-outline-style); outline-width: 1px; @@ -896,19 +739,13 @@ .\[-webkit-box-orient\:vertical\] { -webkit-box-orient: vertical; } - .\[-webkit-line-clamp\:1\] { - -webkit-line-clamp: 1; - } .\[-webkit-line-clamp\:4\] { -webkit-line-clamp: 4; } - .hover\:scale-105 { + .hover\:cursor-pointer { &:hover { @media (hover: hover) { - --tw-scale-x: 105%; - --tw-scale-y: 105%; - --tw-scale-z: 105%; - scale: var(--tw-scale-x) var(--tw-scale-y); + cursor: pointer; } } } @@ -955,14 +792,6 @@ } } } - .hover\:shadow-lg { - &:hover { - @media (hover: hover) { - --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - } - } .hover\:shadow-md { &:hover { @media (hover: hover) { @@ -979,14 +808,6 @@ } } } - .hover\:shadow-xl { - &:hover { - @media (hover: hover) { - --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - } - } .hover\:shadow-blue-300 { &:hover { @media (hover: hover) { @@ -997,13 +818,6 @@ } } } - .hover\:ring-blue-300 { - &:hover { - @media (hover: hover) { - --tw-ring-color: var(--color-blue-300); - } - } - } .hover\:ring-blue-700 { &:hover { @media (hover: hover) { @@ -1083,12 +897,6 @@ display: none; } } - .md\:size-8 { - @media (width >= 48rem) { - width: calc(var(--spacing) * 8); - height: calc(var(--spacing) * 8); - } - } .md\:size-32 { @media (width >= 48rem) { width: calc(var(--spacing) * 32); @@ -1106,11 +914,6 @@ width: calc(1/2 * 100%); } } - .md\:w-1\/4 { - @media (width >= 48rem) { - width: calc(1/4 * 100%); - } - } .md\:w-2\/3 { @media (width >= 48rem) { width: calc(2/3 * 100%); @@ -1126,11 +929,6 @@ width: calc(var(--spacing) * 48); } } - .md\:w-full { - @media (width >= 48rem) { - width: 100%; - } - } .md\:px-44 { @media (width >= 48rem) { padding-inline: calc(var(--spacing) * 44); @@ -1190,26 +988,6 @@ inherits: false; initial-value: 0; } -@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; @@ -1400,32 +1178,12 @@ syntax: "*"; inherits: false; } -@property --tw-scale-x { - syntax: "*"; - inherits: false; - initial-value: 1; -} -@property --tw-scale-y { - syntax: "*"; - inherits: false; - initial-value: 1; -} -@property --tw-scale-z { - syntax: "*"; - inherits: false; - initial-value: 1; -} @layer properties { @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) { *, ::before, ::after, ::backdrop { --tw-translate-x: 0; --tw-translate-y: 0; --tw-translate-z: 0; - --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; @@ -1469,9 +1227,6 @@ --tw-drop-shadow-size: initial; --tw-duration: initial; --tw-ease: initial; - --tw-scale-x: 1; - --tw-scale-y: 1; - --tw-scale-z: 1; } } }