<% // Post list item — MOBILE-FIRST. // // <768px (default): // Vertical stack — full-bleed 16:9 cover on top, content below. // Whole card is tappable (one big wrapping everything). // Active state: scale(0.985) + opacity dim. // // ≥768px (desktop): // v9 pattern — 120px square cover left, content right. // Hover state on cover. Tap-target stays large. const _base = (typeof siteUrlBase !== 'undefined' && siteUrlBase) ? siteUrlBase : ''; const _href = _base + '/' + post.slug; const _hasCover = !!post.cover_image_url; const _typeLabel = (post.type && post.type !== 'overig' && post.type !== 'post') ? post.type : ''; const _isPinned = !!post.pinned; const _isDraft = post.status && post.status !== 'published'; function _ddmmyyyy(iso) { if (!iso) return ''; const d = new Date(iso); if (isNaN(d.getTime())) return ''; const pad = n => String(n).padStart(2, '0'); return pad(d.getDate()) + '-' + pad(d.getMonth() + 1) + '-' + d.getFullYear(); } let _tags = []; if (post.tags) { if (Array.isArray(post.tags)) _tags = post.tags; else if (typeof post.tags === 'string') { try { const parsed = JSON.parse(post.tags); _tags = Array.isArray(parsed) ? parsed : post.tags.split(',').map(t => t.trim()).filter(Boolean); } catch (e) { _tags = post.tags.split(',').map(t => t.trim()).filter(Boolean); } } } %>
  • <% if (_hasCover) { %> <% } %>
    <% if (_isPinned) { %><% } %> <% if (_typeLabel) { %> · <%= _typeLabel.charAt(0).toUpperCase() + _typeLabel.slice(1) %> <% } %> <% if (_isDraft) { %> · concept <% } %>

    <%= post.title || '(zonder titel)' %>

    <% if (post.excerpt) { %>

    <%= post.excerpt %>

    <% } %> <% if (_tags.length) { %>
    <% _tags.forEach(function(t) { %> #<%= t %> <% }); %>
    <% } %>