m038andClaude Opus 5
e81c73a9ba
Scrolly-section text never rendered: the inline Scrollama block ran before the main.js bundle published window.scrollama, so it always hit its guard and the panel text stayed display:none, leaving a blank column beside the pinned image. Defer to DOMContentLoaded, and build the step panels before the scrollama check so a missing bundle costs the animation, not the text. Also fixes an invalid calc(-(...)) that dropped the mobile scrolly offset, and drops the duplicate inline back-to-top in favour of main.js's version (which pushes a history entry). Blueprint changes carried over from an earlier session: story.yaml and trip.yaml now extend the default page form so both can upload media. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
178 lines
7.9 KiB
YAML
178 lines
7.9 KiB
YAML
title: 'Story'
|
|
|
|
# Inherits Grav's default page form — this is what supplies the page-media
|
|
# uploader, plus the standard Options and Advanced tabs. Without it the form is
|
|
# standalone and has no way to upload images (see entry.yaml, same pattern).
|
|
'@extends':
|
|
type: default
|
|
context: blueprints://pages
|
|
|
|
form:
|
|
fields:
|
|
tabs:
|
|
type: tabs
|
|
active: 1
|
|
fields:
|
|
|
|
content:
|
|
ordering@: 0
|
|
type: tab
|
|
title: Content
|
|
fields:
|
|
header.title:
|
|
type: text
|
|
label: Title
|
|
validate:
|
|
required: true
|
|
|
|
header.date:
|
|
type: datetime
|
|
label: Start Date
|
|
format: 'Y-m-d'
|
|
validate:
|
|
required: true
|
|
|
|
header.end_date:
|
|
type: datetime
|
|
label: End Date
|
|
format: 'Y-m-d'
|
|
help: 'Optional — leave blank for a single-day story'
|
|
|
|
header.hero_image:
|
|
type: text
|
|
label: Hero Image
|
|
placeholder: 'hero.jpg'
|
|
help: 'Filename of an image uploaded in the Images field below'
|
|
|
|
header.hero_alt:
|
|
type: text
|
|
label: Hero Image Alt Text
|
|
placeholder: 'Description of the hero image'
|
|
|
|
content:
|
|
type: markdown
|
|
label: Content
|
|
help: 'Prose renders as a normal reading column. For layout blocks (scrolly sections, galleries, pull quotes) use the shortcodes listed on the Blocks tab.'
|
|
validate:
|
|
required: true
|
|
|
|
header.media_order:
|
|
type: pagemedia
|
|
label: Images
|
|
help: 'Upload every image the story needs here first — shortcodes refer to them by bare filename (photo-1.jpg), never by path.'
|
|
|
|
blocks:
|
|
ordering@: 1
|
|
type: tab
|
|
title: Blocks
|
|
fields:
|
|
blocks_intro:
|
|
type: spacer
|
|
text: "<p>Paste these into the <strong>Content</strong> field. Image parameters take a <strong>bare filename</strong> of an image uploaded in the <strong>Images</strong> field on the Content tab. The hero image is not a block \u2014 it has its own field on the Content tab.</p>"
|
|
|
|
blocks_scrolly:
|
|
type: spacer
|
|
text: "<p style=\"margin:1.4em 0 0.4em\"><strong>Scrolly section \u2014 text panels scroll over a pinned image</strong></p><pre style=\"white-space:pre-wrap;word-break:break-word;padding:0.6em 0.8em;border-radius:6px;background:rgba(127,127,127,0.12)\">[scrolly-section image=\"hero.jpg\" alt=\"What the image shows\" caption=\"Optional caption\"]\nFirst panel.\n\n---\n\nSecond panel. A --- starts a new panel.\n[/scrolly-section]</pre>"
|
|
|
|
blocks_pullquote:
|
|
type: spacer
|
|
text: "<p style=\"margin:1.4em 0 0.4em\"><strong>Pull quote \u2014 large extracted quote, image optional</strong></p><pre style=\"white-space:pre-wrap;word-break:break-word;padding:0.6em 0.8em;border-radius:6px;background:rgba(127,127,127,0.12)\">[pull-quote image=\"photo-1.jpg\" alt=\"What the image shows\"]\nThe quote itself. Markdown works in here.\n[/pull-quote]</pre><p>Drop <em>image</em> and <em>alt</em> for the plain no-image variant.</p>"
|
|
|
|
blocks_chapter:
|
|
type: spacer
|
|
text: "<p style=\"margin:1.4em 0 0.4em\"><strong>Chapter break \u2014 section transition over a background image</strong></p><pre style=\"white-space:pre-wrap;word-break:break-word;padding:0.6em 0.8em;border-radius:6px;background:rgba(127,127,127,0.12)\">[chapter-break image=\"photo-1.jpg\" title=\"After Dark\" number=\"II\" alt=\"What the image shows\" /]</pre><p><em>number</em> is optional.</p>"
|
|
|
|
blocks_gallery:
|
|
type: spacer
|
|
text: "<p style=\"margin:1.4em 0 0.4em\"><strong>Snap gallery \u2014 swipeable carousel</strong></p><pre style=\"white-space:pre-wrap;word-break:break-word;padding:0.6em 0.8em;border-radius:6px;background:rgba(127,127,127,0.12)\">[snap-gallery images=\"hero.jpg,photo-1.jpg\" captions=\"First caption,Second caption\" alts=\"First alt,Second alt\" /]</pre><p><strong>No commas inside captions.</strong> The three lists are split on commas and zipped by position, so one comma in a caption shifts every caption after it. Use em dashes or semicolons.</p>"
|
|
|
|
blocks_fullbleed:
|
|
type: spacer
|
|
text: "<p style=\"margin:1.4em 0 0.4em\"><strong>Full bleed \u2014 single edge-to-edge image as a visual pause</strong></p><pre style=\"white-space:pre-wrap;word-break:break-word;padding:0.6em 0.8em;border-radius:6px;background:rgba(127,127,127,0.12)\">[full-bleed image=\"photo-2.jpg\" alt=\"What the image shows\" caption=\"Optional\" credit=\"Optional\" /]</pre>"
|
|
|
|
blocks_imagecaption:
|
|
type: spacer
|
|
text: "<p style=\"margin:1.4em 0 0.4em\"><strong>Image with caption \u2014 photo at a chosen width</strong></p><pre style=\"white-space:pre-wrap;word-break:break-word;padding:0.6em 0.8em;border-radius:6px;background:rgba(127,127,127,0.12)\">[image-caption image=\"photo-2.jpg\" alt=\"What the image shows\" caption=\"Optional\" credit=\"Optional\" width=\"column\" /]</pre><p><em>width</em>: column (default), full, or bleed.</p>"
|
|
|
|
blocks_gotchas:
|
|
type: spacer
|
|
text: "<p style=\"margin:1.4em 0 0.4em\"><strong>Two things that bite</strong></p><p>Self-closing tags need the space before <code>/]</code>. And a mistyped shortcode fails silently \u2014 it renders as literal text or vanishes, with no warning. Preview the page after adding each block.</p>"
|
|
location:
|
|
ordering@: 2
|
|
type: tab
|
|
title: Location
|
|
fields:
|
|
header.location_name:
|
|
type: text
|
|
label: Location Name
|
|
placeholder: 'e.g. Val d''Orcia'
|
|
|
|
header.location_country:
|
|
type: text
|
|
label: Country
|
|
placeholder: 'e.g. Italy'
|
|
|
|
header.lat:
|
|
type: text
|
|
label: Latitude
|
|
placeholder: '43.0780'
|
|
help: 'GPS latitude (decimal degrees)'
|
|
|
|
header.lng:
|
|
type: text
|
|
label: Longitude
|
|
placeholder: '11.6760'
|
|
help: 'GPS longitude (decimal degrees)'
|
|
|
|
header.transport_mode:
|
|
type: select
|
|
label: How I arrived here
|
|
default: ''
|
|
options:
|
|
'': '— not specified —'
|
|
'walking': 'Walking'
|
|
'bicycle': 'Bicycle'
|
|
'bus': 'Bus'
|
|
'train': 'Train'
|
|
'car': 'Car'
|
|
|
|
header.force_connect:
|
|
type: toggle
|
|
label: Force connector line
|
|
help: 'When GPX tracks are present, always draw a connector from the previous marker to this one'
|
|
highlight: 1
|
|
default: 0
|
|
options:
|
|
1: 'Yes'
|
|
0: 'No'
|
|
validate:
|
|
type: bool
|
|
|
|
# Published now comes from the inherited Options tab — defining it here
|
|
# too would render two toggles bound to the same header key.
|
|
publishing:
|
|
ordering@: 3
|
|
type: tab
|
|
title: Publishing
|
|
fields:
|
|
header.featured:
|
|
type: toggle
|
|
label: Featured highlight
|
|
help: 'Show as a homepage highlight when not travelling'
|
|
highlight: 1
|
|
default: 0
|
|
options:
|
|
1: 'Yes'
|
|
0: 'No'
|
|
validate:
|
|
type: bool
|
|
|
|
# Drop the inherited Date field — Story defines its own required
|
|
# "Start Date" on the Content tab, and both bind to header.date.
|
|
options:
|
|
fields:
|
|
publishing:
|
|
fields:
|
|
header.date:
|
|
unset@: true
|