kuba/strona-czynna
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Make item lists clickable

Browse Source
This commit is contained in:
Kuba Orlik 2025-03-03 21:35:30 +01:00
parent b1ff4a62c8
commit bb64b20312
2 changed files with 5 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/back/jdd-components/items-list/items-list.css
View File

@ -8,6 +8,7 @@
}
.items-list__item {
text-decoration: none;
background-color: var(--color-brand-text-bg);
color: var(--color-brand-text-fg);
padding: 16px;

7
src/back/jdd-components/items-list/items-list.jdd.tsx
View File

@ -10,6 +10,7 @@ const component_arguments = {
"description",
]),
count: new ComponentArguments.ShortText().setExampleValues(["3", "5"]),
url: new ComponentArguments.ShortText().setExampleValues(["/items/:id/"]),
} as const;
interface OptimisticCollectionItem {
@ -22,7 +23,7 @@ export class ItemsList extends Component<typeof component_arguments> {
}
async toHTML({
args: { mode, collection, title_field, text_content_field },
args: { mode, collection, title_field, text_content_field, url },
classes,
jdd_context: { render_markdown, language, ctx },
}: ComponentToHTMLArgs<typeof component_arguments>): Promise<string> {
@ -34,7 +35,7 @@ export class ItemsList extends Component<typeof component_arguments> {
return (
<div class={["items-list", ...classes]}>
{items.map((item) => (
<div class="items-list__item">
<a class="items-list__item" href={url.replaceAll(":id", item.id)}>
<span class="items-list__item__title">
{(item as OptimisticCollectionItem).get(title_field)}
</span>
@ -44,7 +45,7 @@ export class ItemsList extends Component<typeof component_arguments> {
(item as OptimisticCollectionItem).get(text_content_field)
)}
</div>
</div>
</a>
))}
</div>
);