Add before/after comparison block plugin
- Create custom block plugin with Vue 3 + Composition API - Use kirbyup for building Vue SFC components - Block allows selecting two images with slider comparison UI - Preview shows images overlapped at 50% in the panel - Add beforeafter block to report blueprint - Update report template to use authors field - Change text block heading level from 4 to 3 Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
509eb0ddab
commit
3d182a233d
12 changed files with 313 additions and 9 deletions
35
site/plugins/beforeafter/blueprints/blocks/beforeafter.yml
Normal file
35
site/plugins/beforeafter/blueprints/blocks/beforeafter.yml
Normal file
|
|
@ -0,0 +1,35 @@
|
|||
name: Comparaison Avant/Après
|
||||
icon: images
|
||||
preview: beforeafter
|
||||
fields:
|
||||
imageBefore:
|
||||
label: Image "Avant"
|
||||
type: files
|
||||
multiple: false
|
||||
layout: cards
|
||||
query: page.images
|
||||
uploads: false
|
||||
help: Image affichée à gauche / dessous
|
||||
imageAfter:
|
||||
label: Image "Après"
|
||||
type: files
|
||||
multiple: false
|
||||
layout: cards
|
||||
query: page.images
|
||||
uploads: false
|
||||
help: Image affichée à droite / dessus
|
||||
caption:
|
||||
label: Légende
|
||||
type: text
|
||||
help: Légende commune aux deux images
|
||||
text:
|
||||
label: Texte accompagnant
|
||||
type: writer
|
||||
marks:
|
||||
- bold
|
||||
- italic
|
||||
- link
|
||||
nodes:
|
||||
- bulletList
|
||||
- orderedList
|
||||
- paragraph
|
||||
Loading…
Add table
Add a link
Reference in a new issue