_includes/layouts/home.11ty.js

/**
* @file Defines the chained template for the homepage
* @author Reuben L. Lillie <reubenlillie@gmail.com>
* @see {@link https://www.11ty.dev/docs/layouts/#layout-chaining Layout chaining in 11ty}
*/


/**
* Require modules for Cloudinary image management
* @see {@link https://cloudinary.com/documentation/node_integration Cloudinary Documentation}
*/

require('dotenv').config()
var cloudinary = require('cloudinary').v2

cloudinary.config({
cloud_name: process.env.CLOUDINARY_NAME,
api_key: process.env.CLOUDINARY_API_KEY,
api_secret: process.env.CLOUDINARY_API_SECRET
})

/**
* Acts as front matter in JavaScript templates
*/

exports.data = {
layout: 'layouts/base',
image: {
src: 'headshot.jpg',
alt: 'Reuben’s headshot'
}
}

/**
* The content of the template
* @method
* @name render()
* @param {Object} data 11ty’s data object
* @return {String} HTML template literal
* @see {@link https://www.11ty.dev/docs/shortcodes/ Shortcodes in 11ty}
*/

exports.render = async function (data) {
var headshot = await this.headshot(data.image.src, data.image.alt)
return `<header id="main_header" class="grid justify-center text-center">
<h1 class="no-margin">
${data.title}</h1>
${headshot}
<p>
${data.site.tagline}</p>
</header>
<div class="x-large">
${this.gridNav(data.collections.activities, data.page)}
</div>
${data.content}`

}