63 lines
2.3 KiB
Plaintext
63 lines
2.3 KiB
Plaintext
---
|
|
import client from "@/data/pocketbase";
|
|
import SiteLayout from "@/layouts/base";
|
|
import ImageCarousel from "@/components/Detail/ImageCarousel";
|
|
import IngredientTableView from "@/components/Detail/IngredientTableView";
|
|
import StepView from "@/components/Detail/StepView";
|
|
import InfoView from "@/components/Detail/InfoView";
|
|
|
|
const { recipeid } = Astro.params;
|
|
|
|
---
|
|
|
|
<script>
|
|
|
|
</script>
|
|
|
|
<SiteLayout>
|
|
<div class="flex flex-col md:flex-row">
|
|
<div class="flex flex-1/3 flex-col mt-2 md:mt-4 sticky">
|
|
<div class="w-full bg-green-600 h-50">
|
|
Image Upload
|
|
</div>
|
|
<!-- <ImageCarousel class="w-full" recipe={re} /> -->
|
|
<!-- <p class=" md:hidden text-[28pt] font-bold leading-none mt-2">{re.name}</p> -->
|
|
|
|
<!-- Details -->
|
|
<!-- <InfoView re={re} /> -->
|
|
|
|
<p class="text-[22pt] font-bold 'md:mt-4'">Ingredients</p>
|
|
<table class={`table-auto text-left bg-[#2a2b2c] md:w-80 px-4 rounded-lg w-full`}>
|
|
<thead>
|
|
<tr>
|
|
<th class="px-4 py-2">Quantity</th>
|
|
<th class="px-4 py-2">Unit</th>
|
|
<th class="px-4 py-2">Ingredient</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="ingredient-table" class="border-t px-4 py-2 border-gray-600">
|
|
<tr id="ingredient-input" class="">
|
|
<td class="px-4 py-1">˚
|
|
<input class="w-3/4 bg-white/20 rounded-lg px-2" type="text">
|
|
</td>
|
|
<td class="px-4 py-1">
|
|
<input class="w-3/4 bg-white/20 rounded-lg px-2" type="text">
|
|
</td>
|
|
<td class="px-4 py-1">
|
|
<!-- <input class="w-3/4 text-wrap bg-white/20 rounded-lg px-2" type="text"> -->
|
|
<textarea class="block bg-white/20 rounded-lg px-2"></textarea>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div class="flex w-full flex-col">
|
|
<!-- <p class="hidden md:block text-[28pt] font-bold pl-5">{re.name}</p> -->
|
|
|
|
<!-- Steps -->
|
|
<!-- <StepView steps={steps} /> -->
|
|
</div>
|
|
|
|
</div>
|
|
</SiteLayout> |