human-anatomy-3d/src/_includes/layouts/base.ejs

187 lines
5.4 KiB
Text
Raw Normal View History

2020-06-20 18:16:50 +00:00
<!DOCTYPE html>
<html lang="{{ locale }}" dir="{{ dir }}">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
<link rel="icon" href="/favicon.ico" />
<!-- Required Core Stylesheet -->
<!-- <link rel="stylesheet" href="/node_modules/@glidejs/glide/dist/css/glide.core.css"> -->
<!-- Optional Theme Stylesheet -->
<!-- <link rel="stylesheet" href="/node_modules/@glidejs/glide/dist/css/glide.theme.css"> -->
<title>
<%= site.title %>
</title>
<meta name="description" content="<%= (!!locals.description) ? description : site.description %>" />
<meta name="author" content="<%= site.author %>" />
<meta property="og:title" content="<%= site.title %>" />
<meta property="og:description" content="<%= (!!locals.description) ? description : site.description %>" />
<meta property="og:locale" content="<%= site.locale %>" />
<meta property="og:site_name" content="<%= site.site_name %>" />
<% if (locals.tags=="posts" ) { %>
<meta property="og:type" content="article" />
<meta property="article:published_time" content="<%= date.toISOString() %>" />
<script type="application/ld+json">
2020-06-20 18:16:50 +00:00
{
"description": "<%= (!!locals.description) ? description : site.description %>",
"author": { "@type": "Person", "name": "<%= site.author %>" },
"@type": "BlogPosting",
"url": "<%= `${site.url}${page.url}` %>",
"publisher": {
"@type": "Organization",
"logo": {
"@type": "ImageObject",
"url": "<%= `${site.url}/assets/images/logo.png` %>"
},
"name": "<%= site.author %>"
},
"headline": "<%= site.title %>",
2020-06-20 18:16:50 +00:00
"datePublished": "<%= date.toISOString() %>",
"mainEntityOfPage": {
"@type": "WebPage",
"@id": "<%= `${site.url}${page.url}` %>"
},
"@context": "http://schema.org"
}
</script>
<% } %>
<%- include('webpack.ejs') %>
<% if (page.url=="/" ) { %>
<script src="https://identity.netlify.com/v1/netlify-identity-widget.js"></script>
<script>
if (window.netlifyIdentity) {
window.netlifyIdentity.on('init', (user) => {
if (!user) {
window.netlifyIdentity.on('login', () => {
document.location.href = '/admin/';
});
}
});
}
</script>
<% } %>
</head>
<body class="">
<div id="page" class="max-w-screen-lg mx-auto">
<header class="site-header ">
<img class="site-logo" src="<%= `./assets/images/logo.png` %>" alt="">
<h1 class="site-title font-semibold text-3xl text-gray-800">
<%= site.title %>
</h1>
<!-- <div class="text-xl"><%= site.description %></div> -->
</header>
<!-- <div class="">
header was here
<nav>
<ul class="flex flex-wrap text-xl">
<li class="mr-6">
<a class="text-gray-700 border-none hover:no-underline hover:text-gray-800" href="/"
>Home</a
>
</li>
<li class="mr-6">
<a
class="text-gray-700 border-none hover:no-underline hover:text-gray-800"
href="https://github.com/ixartz/Eleventy-Starter-Boilerplate"
>
GitHub
</a>
</li>
</ul>
</nav>
</div> -->
<main class="page-content">
<%- content %>
</main>
<% include /footer %>
</div>
<script>
window.onload = setScrollbarVariable;
window.onresize = setScrollbarVariable;
function setScrollbarVariable() {
const scrollbarWidth = window.innerWidth - document.body.clientWidth;
document.documentElement.style.setProperty("--scrollbarWidth", `${scrollbarWidth}px`);
}
</script>
<!-- <script src="https://unpkg.com/@glidejs/glide@3.3.0/dist/glide.js"></script> -->
<script src="/node_modules/@glidejs/glide/dist/glide.min.js"></script>
<!-- <script src="/node_modules/@glidejs/glide/dist/glide.modular.esm.js"></script> -->
<!-- <script src="/js/eleventy.js" type="module" async></script> -->
<script>
// new Glide('.glide').mount({
// type: 'carousel',
// startAt: 0,
// perView: 1,
// autoplay: 1000,
// bound: true,
// rewind: false
// })
// new Glide('.glide').mount()
</script>
</body>
</html>
<style>
.site-logo {
height: 5rem;
transform: rotateZ(4deg) translateY(0.4rem);
transition: 0.2s all;
border: 3px solid var(--c-1);
border-radius: 1rem;
}
.site-logo:hover {
transform: rotateZ(0deg) translateY(0.4rem);
}
.site-header {
display: flex;
justify-content: center;
align-items: baseline;
gap: 1rem;
}
.site-title {
font-family: Bebas Neue;
font-style: normal;
font-weight: normal;
font-size: 3rem;
line-height: 1;
letter-spacing: 0.24em;
text-transform: uppercase;
width: auto;
margin: 3rem 0 0 0;
}
#page {
display: flex;
flex-direction: column;
align-items: center;
}
.page-content {
display: flex;
flex-direction: column;
align-items: center;
}
</style>