Merge pull request #699 from craftcms/releases/craft-5.7

Craft 5.7

Author: AugustMiller

docs/.vuepress/components/Block.vue

@@ -1,24 +1,19 @@
+<template>
+  <div class="custom-block">
+    <div v-if="label" class="banner">
+      <span class="label">{{ label }}</span>
+    </div>
+    <div class="content">
+      <slot />
+    </div>
+  </div>
+</template>
+
 <script>
 export default {
-  functional: true,
   props: {
     label: String,
   },
-  render(h, { props, slots }) {
-    const content = [h('div', { class: 'content' }, slots().default)];
-
-    if (props.label) {
-        content.unshift(h(
-            'div',
-            {
-                class: 'banner',
-            },
-            [h('span', { class: 'label' }, props.label)]
-        ));
-    }
-
-    return h('div', { class: 'custom-block' }, content);
-  },
 };
 </script>
 

docs/.vuepress/components/Placeholder.vue

@@ -0,0 +1,24 @@
+<template>
+    <span class="placeholder" :title="help"><slot /></span>
+</template>
+
+<script>
+export default {
+    props: {
+        help: {
+            type: String,
+            required: false,
+        },
+    },
+};
+</script>
+
+
+<style lang="postcss" scoped>
+    .placeholder {
+        @apply border border-dashed px-1;
+
+        font-size: 0.95em;
+        cursor: help;
+    }
+</style>

docs/.vuepress/components/StatusLabel.vue

@@ -0,0 +1,73 @@
+<template>
+    <div :class="['status-label', getSlug()]">
+        <div class="status-label-pip" :style="{ backgroundColor: getColor() }"></div>
+        <div class="status-label-text">
+            {{ label }}
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        props: {
+            label: {
+                type: String,
+                default: 'live',
+            },
+            color: {
+                type: String,
+                default: null,
+            },
+        },
+        methods: {
+            getSlug() {
+                return this.label.toLowerCase().replace(/[^a-z]/, '-');
+            },
+            getColor() {
+                if (!this.color) {
+                    return null;
+                }
+
+                if (this.color.indexOf('#') !== 0) {
+                    return null;
+                }
+
+                return this.color;
+            },
+        },
+    };
+</script>
+
+<style lang="postcss" scoped>
+    .status-label {
+        align-items: center;
+        border-radius: 1em;
+        display: inline-flex;
+        height: 20px;
+        padding: 0 10px 0 5px;
+
+        &.live {
+            background-color: theme('colors.craft.green');
+        }
+
+        &.pending {
+            background-color: theme('colors.craft.orange');
+        }
+    }
+
+    .status-label-pip {
+        background-color: white;
+        border-radius: 100%;
+        height: 12px;
+        margin-right: 5px;
+        width: 12px;
+    }
+
+    .status-label-text {
+        color: white;
+        font-size: 0.7em;
+        font-weight: 600;
+        letter-spacing: 0.05em;
+        text-transform: uppercase;
+    }
+</style>

docs/.vuepress/sets/craft-cms.js

@@ -44,6 +44,7 @@ module.exports = {
           children: [
             "field-types/addresses",
             "field-types/assets",
+            "field-types/button-group",
             "field-types/categories",
             "field-types/checkboxes",
             "field-types/color",
@@ -52,6 +53,7 @@ module.exports = {
             "field-types/dropdown",
             "field-types/email",
             "field-types/entries",
+            "field-types/json",
             "field-types/icon",
             "field-types/lightswitch",
             "field-types/link",

docs/5.x/extend/element-types.md

@@ -4,7 +4,7 @@ description: Add native-feeling content types to empower content authors and adm
 
 # Element Types
 
-[Elements](../system/elements.md) underpin Craft’s flexible and extensible content modeling features. You can supplement Craft’s eight [built-in element types](../system/elements.md#element-types) with your own, from a plugin or module.
+[Elements](../system/elements.md) underpin Craft’s flexible and extensible content modeling features. You can supplement Craft’s seven [built-in element types](../system/elements.md#element-types) with your own, from a plugin or module.
 
 As you implement common element features like [titles](#titles), [sources](#sources), or [statuses](#statuses), the built-in element classes will be an invaluable resource—both as templates for basic functionality and evidence of the flexibility of elements.
 

docs/5.x/extend/field-types.md

@@ -52,8 +52,6 @@ class Plugin extends \craft\base\Plugin
 
 If you used the generator to scaffold the field type, it ought to have inserted this, automatically. You may register as many field types as you wish, from one `EVENT_REGISTER_FIELD_TYPES` event handler.
 
-### 
-
 ### Missing Fields
 
 If your field class ever goes missing (say, because a developer uninstalls your plugin or removes the package), Craft will use an instance of <craft5:craft\fields\MissingField>, and display a message in any field layouts it was present in. This ensures the control panel doesn’t become inoperable, but doesn’t prevent front-end templates from breaking.