fix styles, icons

static/admin/config/collections/author.js

@@ -6,7 +6,7 @@ const AuthorCollection = {
   label: "Autoren",
   label_singular: "Autor",
   description:
-    "Autoren können einem Blogartikel zugewiesen werden. Wir unterscheiden in aktive und inaktive sowie vereinfachte Autoren, welche nur mit dem Namen angezeigt werden, und erweiterte Autoren, für die eine Übersichtsseite angelegt wird.Autoren können einem Blogartikel zugewiesen werden.",
+    "Autoren können einem Blogartikel zugewiesen werden. Wir unterscheiden in aktive und inaktive sowie vereinfachte Autoren, welche nur mit dem Namen angezeigt werden, und erweiterte Autoren, für die eine Übersichtsseite angelegt wird.",
   icon: "user",
   folder: "content/author",
   create: true,

static/admin/config/collections/blog.js

@@ -1,5 +1,10 @@
 import { DateFormat, MarkdownProps } from "../props.js";
-import { DescriptionText, DraftBoolean, Title } from "./widgets.js";
+import {
+  AuthorRelation,
+  DescriptionText,
+  DraftBoolean,
+  Title,
+} from "./widgets.js";
 
 const BlogCollection = {
   name: "blog",
@@ -52,19 +57,7 @@ const BlogCollection = {
       required: true,
       default: "/media/image.webp",
     },
-    {
+    AuthorRelation,
-      name: "author",
-      label: "Autor(en)",
-      hint: "Verwaltet im Autoren-Bereich. Mehrere Autoren werden in alphabetischer Reihenfolge aufgelistet.",
-      widget: "relation",
-      collection: "author",
-      value_field: "{{slug}}",
-      search_fields: ["title"],
-      display_fields: ["{{title}}"],
-      multiple: true,
-      required: true,
-      options_length: 10000,
-    },
     {
       name: "categories",
       label: "Kategorien",
@@ -98,7 +91,7 @@ const BlogCollection = {
       label: "Tags",
       widget: "list",
       delimiter: ",",
-      required: false
+      required: false,
     },
     {
       name: "type",

static/admin/config/collections/settings-collection.js

@@ -12,6 +12,7 @@ import {
   PreviewNumber,
   DescriptionText,
   DisableBoolean,
+  AuthorRelation,
 } from "./widgets.js";
 
 const SettingsCollection = {
@@ -355,18 +356,7 @@ const SettingsCollection = {
       fields: [
         EnableBoolean,
         Title(false),
-        {
+        AuthorRelation,
-          name: "author",
-          label: "Autor",
-          hint: "Verwaltet im Autoren-Bereich",
-          widget: "relation",
-          collection: "author",
-          value_field: "{{slug}}",
-          search_fields: ["{{title}}"],
-          display_fields: ["{{title}}"],
-          multiple: true,
-          required: true,
-        },
         {
           name: "image",
           label: "Titelbild",
@@ -664,7 +654,7 @@ const SettingsCollection = {
                   name: "name",
                   label: "Bezeichnung",
                   widget: "string",
-                  required: true
+                  required: true,
                 },
                 {
                   name: "weight",

static/admin/config/collections/widgets.js

@@ -76,6 +76,20 @@ const ButtonObject = {
   ],
 };
 
+const AuthorRelation = {
+  name: "author",
+  label: "Autor(en)",
+  hint: "Verwaltet im Autoren-Bereich. Mehrere Autoren werden in alphabetischer Reihenfolge aufgelistet.",
+  widget: "relation",
+  collection: "author",
+  value_field: "{{slug}}",
+  search_fields: ["title"],
+  display_fields: ["{{title}}"],
+  multiple: true,
+  required: true,
+  options_length: 10000,
+};
+
 export {
   EnableBoolean,
   DisableBoolean,
@@ -85,4 +99,5 @@ export {
   IconList,
   PreviewNumber,
   ButtonObject,
+  AuthorRelation,
 };

static/admin/icons.js

@@ -25,11 +25,7 @@ for (let [name, icon] of Object.entries(IconNames)) {
   Icons.push({
     name,
     icon: () =>
-      h(
+      h("i", { className: "CMS_Icon_root cms-icon " + icon, style: { fontSize: "1.5rem" } })
-        "div",
-        { className: "flex items-center" },
-        h("i", { className: icon, style: { fontSize: "1.5rem" } })
-      ),
   });
 }
 

static/admin/previews/field-previews/boolean-preview.js

@@ -1,6 +1,7 @@
 const BooleanPreview = ({ value }) =>
   h("i", {
     className: value ? "mdi mdi-check" : "mdi mdi-close",
+    style: { color: value ? "#00ff99" : "#ff0000", "font-size": "1.5rem" },
   });
 
 export default BooleanPreview;

static/admin/previews/field-previews/draft-preview.js

@@ -6,7 +6,7 @@ const DraftPreview = ({ value }) =>
         backgroundColor: value === true ? "rgb(37 99 235)" : "rgb(22 163 74)",
         color: "white",
         border: "none",
-        padding: "2px 6px",
+        padding: "0 5px",
         textAlign: "center",
         textDecoration: "none",
         display: "inline-block",