Compare commits
2 Commits
main
...
75b7f03f12
| Author | SHA1 | Date | |
|---|---|---|---|
| 75b7f03f12 | |||
| 020bbeb078 |
9
web/src/components/BaseHead.astro
Normal file
9
web/src/components/BaseHead.astro
Normal file
@@ -0,0 +1,9 @@
|
||||
---
|
||||
import "../styles/global.css"
|
||||
---
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>Astro</title>
|
||||
@@ -1,19 +1,12 @@
|
||||
---
|
||||
import BaseHead from '@component/BaseHead'
|
||||
import Header from '@component/Header'
|
||||
import "../styles/global.css";
|
||||
|
||||
const {
|
||||
title
|
||||
} = Astro.props
|
||||
---
|
||||
|
||||
<html lang=en>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>{title ? title : "Recipie"}</title>
|
||||
<BaseHead title="Recipie" />
|
||||
</head>
|
||||
<body>
|
||||
<main id="main" class="flex-1">
|
||||
|
||||
@@ -53,7 +53,7 @@ const recipeId = id as string
|
||||
});
|
||||
</script>
|
||||
|
||||
<Base title="Edit Recipe">
|
||||
<Base>
|
||||
<div class="flex flex-col md:flex-row mx-auto justify-center w-full lg:max-w-3/4 xl:max-w-2/3 2xl:max-w-1/2">
|
||||
<div class="flex md:flex-1/3 flex-col sticky">
|
||||
|
||||
|
||||
@@ -20,7 +20,7 @@ const images = await Promise.all(
|
||||
)
|
||||
---
|
||||
|
||||
<Base title=`${recipeData.metadata.title}: Recipie` >
|
||||
<Base>
|
||||
<div class="flex flex-col md:flex-row mx-auto justify-center w-full lg:max-w-3/4 xl:max-w-2/3 2xl:max-w-1/2">
|
||||
<div class="flex md:flex-1/3 flex-col mt-2 md:mt-4 sticky">
|
||||
<ImageCarousel class="w-full" images={images} />
|
||||
|
||||
@@ -57,7 +57,7 @@ tags:
|
||||
});
|
||||
</script>
|
||||
|
||||
<Base title="New Recipe">
|
||||
<Base>
|
||||
<div class="flex flex-col md:flex-row mx-auto justify-center w-full lg:max-w-3/4 xl:max-w-2/3 2xl:max-w-1/2">
|
||||
<div class="flex md:flex-1/3 flex-col sticky">
|
||||
|
||||
|
||||
@@ -30,7 +30,7 @@ if (query) {
|
||||
}
|
||||
---
|
||||
|
||||
<Base title=`Search${ query != "" ? ": " + query : "" }`>
|
||||
<Base>
|
||||
<div class="mb-6">
|
||||
<!-- <h1 class="text-3xl font-bold mb-4">Search Recipes</h1> -->
|
||||
|
||||
@@ -60,7 +60,7 @@ if (query) {
|
||||
)}
|
||||
</div>
|
||||
|
||||
{query && recipes.length > 0 && (
|
||||
{query && recipes.length > 0 ? (
|
||||
<div class="grid gap-3 grid-cols-1 py-3 md:grid-cols-2 lg:grid-cols-4 xl:grid-cols-6">
|
||||
{
|
||||
recipes.map((r, i) => (
|
||||
@@ -74,5 +74,15 @@ if (query) {
|
||||
))
|
||||
}
|
||||
</div>
|
||||
) : query ? (
|
||||
<div class="text-center py-12 text-gray-400">
|
||||
<p class="text-xl">No recipes found</p>
|
||||
<p class="mt-2">Try a different search term</p>
|
||||
</div>
|
||||
) : (
|
||||
<div class="text-center py-12 text-gray-400">
|
||||
<p class="text-xl">Start searching for recipes</p>
|
||||
<p class="mt-2">Enter a search term above to find your favorite recipes</p>
|
||||
</div>
|
||||
)}
|
||||
</Base>
|
||||
Reference in New Issue
Block a user