36 lines
945 B
TypeScript
36 lines
945 B
TypeScript
import { PageLayout } from "../comp/page_layout.ts";
|
|
import { AnyNode, E } from "ren/node.ts";
|
|
import { classNames } from "ren/attrs.ts";
|
|
import { Context } from "../context.ts";
|
|
import { H3 } from "../uikit/typo.ts";
|
|
import { Ingredient } from "../domain/ingredient/types.ts";
|
|
|
|
interface IngredientsPageData {
|
|
ingredients: Ingredient[];
|
|
}
|
|
|
|
export function IngredientsPage(
|
|
ctx: Context,
|
|
data: IngredientsPageData,
|
|
): AnyNode {
|
|
return PageLayout(ctx, [
|
|
E("div", classNames("content-width gap-v-1x5"), [
|
|
H3(ctx.tr.Ingredients),
|
|
IngredientList(data.ingredients),
|
|
]),
|
|
]);
|
|
}
|
|
|
|
export function IngredientList(ingrs: Ingredient[]): AnyNode {
|
|
return E("div", classNames("responsive-typography"), [
|
|
E("ul", [], ingrs.map(IngredientItem)),
|
|
]);
|
|
}
|
|
|
|
export function IngredientItem(ingr: Ingredient): AnyNode {
|
|
return E("li", [], [
|
|
ingr.name,
|
|
// E("a", { href: `/ingredients/${ingr.key}` }, ingr.name),
|
|
]);
|
|
}
|