feat: updated styles and content structure

package.json

@@ -18,10 +18,11 @@
     "postcss": "latest",
     "postcss-plugin": "^1.0.0",
     "postcss-pxtorem": "^6.0.0",
+    "sass": "^1.62.0",
     "tailwindcss": "^3.3.0",
     "typescript": "^4.9.3",
     "vite": "^4.2.0",
-    "vite-plugin-kirby": "^0.1.4",
+    "vite-plugin-kirby": "0.2.0",
     "vite-plugin-live-reload": "^3.0.2"
   },
   "packageManager": "yarn@3.5.0",

public/assets/dist/manifest.json

@@ -1,13 +1,13 @@
 {
   "main.css": {
-    "file": "assets/main-f3ee5932.css",
+    "file": "assets/main-77fd9dd5.css",
     "src": "main.css"
   },
   "main.ts": {
     "css": [
-      "assets/main-f3ee5932.css"
+      "assets/main-77fd9dd5.css"
     ],
-    "file": "assets/main-68a19774.js",
+    "file": "assets/main-b24b3c1d.js",
     "isEntry": true,
     "src": "main.ts"
   }

site/blueprints/blocks/images.yml

@@ -0,0 +1,9 @@
+name: Images
+icon: image
+preview: fields
+fields:
+  images:
+    extends: fields/image
+    label: Images
+    multiple: true
+    max: 2

site/blueprints/fields/blocks.yml

@@ -5,7 +5,7 @@ fieldsets:
   accordion: blocks/accordion
   contact: blocks/contact
   gallery: blocks/gallery
-  image: blocks/image
+  images: blocks/images
   imageText: blocks/image-text
   richtext: blocks/richtext
   table: blocks/table

site/blueprints/pages/articles.yml

@@ -3,7 +3,6 @@ title: Articles
 icon: grid
 
 options:
-  preview: false
   create: false
   delete: false
   duplicate: false

site/blueprints/sections/content.yml

@@ -9,11 +9,8 @@ columns:
       cover:
         extends: fields/image
         required: false
-      subline:
-        label: Subline
-        type: text
-        maxlength: 80
-      intro:
-        label: Intro
+      excerpt:
+        label: Excerpt
+        help: The excerpt is used in the teaser
         type: text
         maxlength: 200

site/blueprints/sections/globals.yml

@@ -17,19 +17,29 @@ fields:
     label: Footer Navigation
     type: navigation
     levels: 1
+    width: 1/2
+  metaNavigation:
+    label: Meta Navigation
+    type: navigation
+    levels: 1
+    width: 1/2
+  footerText:
+    extends: fields/writer/default
+    label: Text
+    width: 1/2
   socialMedia:
     label: Social Media
     type: structure
+    width: 1/2
     fields:
       service:
         type: select
-        default: facebook
+        default: instagram
         required: true
         options:
-          facebook: Facebook
           instagram: Instagram
           linkedin: LinkedIn
-          tiktok: TikTok
+          youtube: YouTube
           twitter: Twitter
       url:
         label: URL

site/snippets/blocks.php

@@ -1,7 +1,7 @@
 <?php foreach ($page->blocks()->toBlocks() as $block): ?>
-<div id="<?= $block->id() ?>" class="block block-type-<?= $block->type() ?>">
-  <?php snippet('blocks/' . $block->type(), [
-    'block' => $block
-  ]) ?>
+
+<div id="<?= $block->id() ?>" class="block block--<?= $block->type() ?>">
+  <?php snippet('blocks/' . $block->type(), ['block' => $block]) ?>
 </div>
+
 <?php endforeach ?>

site/snippets/blocks/gallery.php

@@ -1,10 +1,15 @@
 <?php
 /** @var \Kirby\Cms\Block $block */
+
+use Kirby\Cms\Html;
+
 $caption = $block->caption();
 $crop    = $block->crop()->isTrue();
 $ratio   = $block->ratio()->or('auto');
+
+$attr = Html::attr(['data-ratio' => $ratio, 'data-crop' => $crop]);
 ?>
-<figure<?= Html::attr(['data-ratio' => $ratio, 'data-crop' => $crop], null, ' ') ?>>
+<figure<?= $attr ?>>
   <ul>
     <?php foreach ($block->images()->toFiles() as $image): ?>
     <li>