categories configuration

This commit is contained in:
Denys Konovalov 2024-01-13 18:32:12 +01:00
parent 5668eb241b
commit 168a308c54
Signed by: Denys Konovalov
GPG Key ID: 0037E1B0E33BD2C9
9 changed files with 184 additions and 7 deletions

@ -0,0 +1,8 @@
---
title: Berichte
description: null
image: ""
style:
background: "#e2ae4e"
color: "#252424"
---

@ -0,0 +1,8 @@
---
title: Buchrezension
description:
image:
style:
background: "#2a9d8f"
color: "#fff"
---

@ -0,0 +1,8 @@
---
title: Gedicht
description: null
image: null
style:
background: "#3947bb"
color: "#fff"
---

@ -0,0 +1,8 @@
---
title: Horoskope
description: null
image: /media/img_2148.jpeg
style:
background: "#ba55d2"
color: "#fff"
---

@ -0,0 +1,8 @@
---
title: Umweltschutz
description: Klimanews, Tipps & co.
image: null
style:
background: "#98cba9"
color: "#000000"
---

@ -0,0 +1,8 @@
---
title: zum Knobeln
description: null
image: null
style:
background: "#e06163"
color: "#fff"
---

@ -37,9 +37,8 @@
textAlign: "center", textAlign: "center",
textDecoration: "none", textDecoration: "none",
display: "inline-block", display: "inline-block",
cursor: "pointer",
borderRadius: "4px", borderRadius: "4px",
fontSize: "14px", alignSelf: "center",
}, },
}, },
value ? "Entwurf" : "Veröffentlicht" value ? "Entwurf" : "Veröffentlicht"
@ -59,15 +58,35 @@
textAlign: "center", textAlign: "center",
textDecoration: "none", textDecoration: "none",
display: "inline-block", display: "inline-block",
cursor: "pointer",
borderRadius: "4px", borderRadius: "4px",
fontSize: "14px", alignSelf: "center",
}, },
}, },
value ? "Entwurf" : "Veröffentlicht" value ? "Entwurf" : "Veröffentlicht"
) )
); );
CMS.registerFieldPreview("categories", "style", ({ value }) =>
h(
"div",
{
style: {
backgroundColor: value.background,
color: value.color,
border: "none",
padding: "2px 6px",
textAlign: "center",
textDecoration: "none",
display: "inline-block",
borderRadius: "4px",
alignSelf: "center",
},
},
"Test"
)
);
CMS.registerPreviewTemplate( CMS.registerPreviewTemplate(
"post", "post",
({ widgetFor, entry, fields, collection }) => { ({ widgetFor, entry, fields, collection }) => {
@ -165,6 +184,51 @@
} }
); );
CMS.registerPreviewTemplate(
"categories",
({ widgetFor, entry }) => {
return h(
"main",
{ className: "article-page full-width" },
h("article", { className: "main-article", style: {margin: "16px"} },
h("header", { className: "article-header" },
h("div", { className: "article-details" },
h("header", { className: "article-category" },
h("a", { style: { "background-color": entry.data.style.background, "color": entry.data.style.color } }, entry.data.title)
),
h("div", { className: "article-title-wrapper" },
h("h2", { className: "article-title" },
h("a", {}, entry.data.title)
),
h("h3", { className: "article-subtitle" },
entry.data.description
)
),
h("footer", { className: "article-time" },
h("div", {},
h("time", { className: "article-time--published" }, ((entry.data.date != null && entry.data.date != "") ? new Intl.DateTimeFormat("de-DE", {dateStyle: "long"}).format(new Date(entry.data.date)) : ""))
)
)
)
),
),
);
}
);
CMS.registerEventListener({
name: "change",
collection: "categories",
// file: 'global', // You can specify a file if in a file collection
field: 'image',
handler: ({ data, collection, field }) => {
return {
...data,
image: data.image.replace("static", ""),
}
},
});
{{ $sass := resources.Get "scss/style.scss" }} {{ $sass := resources.Get "scss/style.scss" }}
{{ $style := $sass | resources.ToCSS | minify | resources.Fingerprint "sha256" }} {{ $style := $sass | resources.ToCSS | minify | resources.Fingerprint "sha256" }}
CMS.registerPreviewStyle("{{ $style.RelPermalink }}") CMS.registerPreviewStyle("{{ $style.RelPermalink }}")

@ -183,4 +183,68 @@ const PagesCollection = {
], ],
}; };
export { PostCollection, PagesCollection }; const CategoriesCollection = {
name: "categories",
label: "Kategorien",
description: "Hier könnt ihr Kategorien erstellen oder bearbeiten.",
icon: "color",
folder: "content/categories",
path: "{{slug}}/_index",
slug: "{{title}}",
create: true,
editor: {
preview: true,
frame: true,
size: "half",
},
filter: {
field: "title",
pattern: "^(?!Kategorien)"
},
summary_fields: ["title", "description", "style"],
media_folder: "/static/media",
public_folder: "/media",
fields: [
{
name: "title",
label: "Titel",
widget: "string",
required: true,
},
{
name: "description",
label: "Beschreibung",
widget: "text",
required: false,
},
{
name: "image",
label: "Titelbild",
widget: "image",
required: false,
},
{
name: "style",
label: "Aussehen",
widget: "object",
required: true,
collapsed: false,
fields: [
{
name: "background",
label: "Hintergrundfarbe",
widget: "color",
required: true,
},
{
name: "color",
label: "Schriftfarbe",
widget: "color",
required: true,
}
]
}
]
};
export { PostCollection, PagesCollection, CategoriesCollection };

@ -1,4 +1,4 @@
import { PagesCollection, PostCollection } from "./collections.js"; import { PagesCollection, PostCollection, CategoriesCollection } from "./collections.js";
const config = { const config = {
backend: { backend: {
@ -32,7 +32,8 @@ const config = {
}, },
collections: [ collections: [
PostCollection, PostCollection,
PagesCollection PagesCollection,
CategoriesCollection,
], ],
}; };