OTSSigns/OTSSigns-Website
1
0
Fork 0
Code Issues Pull Requests 6 Actions Packages Projects Releases Wiki Activity

Add photo and video camera components to platform row with animations and styling

Browse Source
This commit is contained in:
Matt Batchelder
2026-02-21 10:12:23 -05:00
parent ab6f4212bd
commit a9697dd714
3 changed files with 476 additions and 340 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
theme/blocks/editor.js
View File

@@ -1225,34 +1225,59 @@ reg('oribi/platform-row', {
a.cameraAnim
? el('div', { className: 'platform-visual has-camera' },
el('div', { className: 'cam-stage', 'aria-hidden': 'true' },
el('div', { className: 'cam-scene' },
el('div', { className: 'cam-subject cam-subject--1' }),
el('div', { className: 'cam-flash-overlay' })
),
el('div', { className: 'cam-body' },
el('div', { className: 'cam-top' },
el('div', { className: 'cam-hump' }, el('div', { className: 'cam-dial' })),
el('div', { className: 'cam-shutter-btn' }, el('div', { className: 'cam-shutter-inner' }))
),
el('div', { className: 'cam-front' },
el('div', { className: 'cam-grip-ridge' }),
el('div', { className: 'cam-lens-assembly' },
el('div', { className: 'cam-lens-barrel' },
el('div', { className: 'cam-lens-glass' },
el('div', { className: 'cam-reflection' })
)
)
// Photo camera (left)
el('div', { className: 'pc-wrap' },
el('div', { className: 'pc-body' },
el('div', { className: 'pc-flash-unit' }),
el('div', { className: 'pc-top' },
el('div', { className: 'pc-shutter-btn' }),
el('div', { className: 'pc-viewfinder' })
),
el('div', { className: 'cam-controls' },
el('div', { className: 'cam-led' }),
el('div', { className: 'cam-btn' }),
el('div', { className: 'cam-btn' })
el('div', { className: 'pc-front' },
el('div', { className: 'pc-lens-ring' },
el('div', { className: 'pc-lens-glass' },
el('div', { className: 'pc-lens-reflex' })
)
),
el('div', { className: 'pc-grip' })
)
),
el('div', { className: 'pc-prints' },
el('div', { className: 'pc-print pc-print--1', style: { opacity: '1', transform: 'rotate(-12deg) translateY(0)' } },
el('div', { className: 'pc-print__img' })
)
)
),
el('div', { className: 'cam-prints' },
el('div', { className: 'cam-print cam-print--1', style: { opacity: '1', transform: 'rotate(-14deg) translateY(0)' } },
el('div', { className: 'cam-print__img' })
// Centre scene
el('div', { className: 'cam-scene' },
el('div', { className: 'cam-subject cam-subject--1' }),
el('div', { className: 'cam-flash-overlay' }),
el('div', { className: 'cam-vid-overlay' })
),
// Video camera on tripod (right)
el('div', { className: 'vc-wrap' },
el('div', { className: 'vc-camera' },
el('div', { className: 'vc-handle' }),
el('div', { className: 'vc-body' },
el('div', { className: 'vc-lens-barrel' },
el('div', { className: 'vc-lens-tip' },
el('div', { className: 'vc-lens-glass' },
el('div', { className: 'vc-lens-reflex' })
)
)
),
el('div', { className: 'vc-top-rail' }),
el('div', { className: 'vc-rec-light' }),
el('div', { className: 'vc-eyepiece' })
)
),
el('div', { className: 'vc-tripod' },
el('div', { className: 'vc-stem' }),
el('div', { className: 'vc-legs' },
el('div', { className: 'vc-leg vc-leg--l' }),
el('div', { className: 'vc-leg vc-leg--c' }),
el('div', { className: 'vc-leg vc-leg--r' })
)
)
)
)