@coderbyheart/underline
Version:
Bootstrap v4 website template
89 lines (84 loc) • 2.48 kB
HTML
<html lang="<%= config.lang %>">
<head>
<%= include('meta') %>
<title><%= config.appName %></title>
<%= include('head-socialmedia-index') %>
<%= include('critical-styles') %>
</head>
<body class="critical">
<%= include('header') %>
<aside id="hero">
<% if (collections.hero[0].hero) { %>
<div class="bg responsive-bg-image" style="background-image: url('<%= collections.hero[0].hero.file.url %>?w=120')">
</div>
<% } %>
<div class="container">
<article class="slider">
<section class="slide">
<div>
<h1>
<% if (collections.hero[0].subtitle) { %>
<small><%= collections.hero[0].subtitle %></small>
<br><% } %>
<%= collections.hero[0].title %>
</h1>
<a href="./<%= collections.hero[0].slug %>/" class="btn btn-outline-primary">
<%= t('Read') %>
</a>
</div>
</section>
<nav>
<% collections.hero.map(({slug, title, subtitle}) => { %>
<a href="./<%= slug %>/">
<% if (subtitle) { %>
<small><%= subtitle %></small>
<br><% } %>
<%= title %>
</a>
<% }) %>
</nav>
</article>
</div>
</aside>
<main>
<div>
<% content.posts.sort((a,b) => a.content.publicationDate > b.content.publicationDate ? -1 : 1).slice(0, 2).map(({content,
page}) => { %>
<article class="preview">
<header>
<img
src="<%= content.hero.file.url %>?w=30&h=20&fit=thumb"
width="300" height="200"
class="responsive"
alt="<%= content.subtitle %>: <%= content.title %>">
<div>
<h1>
<% if (content.subtitle) { %>
<small><%= content.subtitle %></small>
<br><% } %>
<%= content.title %>
</h1>
<p>
<small>
<time datetime="<%= content.publicationDate %>"><%= shortDate(content.publicationDate) %></time>
<%= t('by') %> <a href="./<%= content.author.slug %>/"><%= content.author.name %></a>
</small>
</p>
</div>
</header>
<section>
<%= content.abstract %>
</section>
<footer>
<a href="<%= page.url %>"><%= t('Read the whole story') %> »</a>
</footer>
</article>
<% }) %>
<%= include('aside') %>
</div>
</main>
<%= include('footer') %>
<%= include('script') %>
</body>
</html>