89 lines
3.8 KiB
Plaintext
89 lines
3.8 KiB
Plaintext
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>{{ renderData.title or title or metadata.title }}</title>
|
||
<meta name="Description" content="{{ renderData.description or description or metadata.description }}">
|
||
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
|
||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat">
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||
<link rel="alternate" href="{{ metadata.feed.path | url }}" type="application/atom+xml" title="{{ metadata.title }}">
|
||
</head>
|
||
<style>
|
||
body, h1,h2,h3,h4,h5,h6 {font-family: "Montserrat", sans-serif}
|
||
.w3-row-padding img {margin-bottom: 12px}
|
||
/* Set the width of the sidebar to 120px */
|
||
.w3-sidebar {width: 120px;background: #222;}
|
||
/* Add a left margin to the "page content" that matches the width of the sidebar (120px) */
|
||
#main {margin-left: 120px}
|
||
/* Remove margins from "page content" on small screens TODO add back in*/
|
||
{% raw %}
|
||
|
||
@media only screen and (max-width:600px) {#main { margin-left:0}}
|
||
|
||
{% endraw %}
|
||
|
||
|
||
</style>
|
||
<body class="w3-black">
|
||
|
||
|
||
|
||
|
||
|
||
<!-- Icon Bar (Sidebar - hidden on small screens) -->
|
||
<nav class="w3-sidebar w3-bar-block w3-small w3-hide-small w3-center">
|
||
<!-- Avatar image in top left corner -->
|
||
<img src="{{ '/img/w3images/avatar_smoke.jpg' | url }}" style="width:100%">
|
||
|
||
{#- Read more about `eleventy-navigation` at https://www.11ty.dev/docs/plugins/navigation/ #}
|
||
{%- for entry in collections.all | eleventyNavigation %}
|
||
|
||
<a href="{{ entry.url | url }}" class="w3-bar-item w3-button w3-padding-large {% if entry.url == page.url %} w3-black {% else %} w3-hover-black {% endif %}">
|
||
<i class="fa {{ navFA[entry.title]}} w3-xxlarge"></i>
|
||
<p>{{ entry.title }}</p>
|
||
</a>
|
||
|
||
{%- endfor %}
|
||
</nav>
|
||
|
||
<!-- Navbar on small screens (Hidden on medium and large screens) -->
|
||
<div class="w3-top w3-hide-large w3-hide-medium" id="myNavbar">
|
||
<div class="w3-bar w3-black w3-opacity w3-hover-opacity-off w3-center w3-small">
|
||
{%- for entry in collections.all | eleventyNavigation %}
|
||
<a href="{{ entry.url | url }}" class="w3-bar-item w3-button" style="width:20% !important">{{ entry.title}}</a>
|
||
{%- endfor %}
|
||
</div>
|
||
</div>
|
||
<div class="w3-padding-large" id="main">
|
||
|
||
|
||
<main {% if templateClass %} class="{{ templateClass }}"{% endif %}>
|
||
<div class="warning">
|
||
<ol>
|
||
<li>Edit the <code>_data/metadata.json</code> with your blog’s information.</li>
|
||
<li>(Optional) Edit <code>.eleventy.js</code> with your <a href="https://www.11ty.dev/docs/config/">configuration preferences</a>.</li>
|
||
<li>Delete this message from <code>_includes/layouts/base.njk</code>.</li>
|
||
</ol>
|
||
<p><em>This is an <a href="https://www.11ty.io/">Eleventy project</a> created from the <a href="https://github.com/11ty/eleventy-base-blog"><code>eleventy-base-blog</code> repo</a>.</em></p>
|
||
</div>
|
||
|
||
{{ content | safe }}
|
||
</main>
|
||
|
||
<!-- Footer -->
|
||
<footer class="w3-content w3-padding-64 w3-text-grey w3-xlarge">
|
||
<i class="fa fa-facebook-official w3-hover-opacity"></i>
|
||
<i class="fa fa-instagram w3-hover-opacity"></i>
|
||
<i class="fa fa-snapchat w3-hover-opacity"></i>
|
||
<i class="fa fa-pinterest-p w3-hover-opacity"></i>
|
||
<i class="fa fa-twitter w3-hover-opacity"></i>
|
||
<i class="fa fa-linkedin w3-hover-opacity"></i>
|
||
<p class="w3-medium">Powered by <a href="https://www.w3schools.com/w3css/default.asp" target="_blank" class="w3-hover-text-green">w3.css</a></p>
|
||
<!-- End footer -->
|
||
</footer>
|
||
|
||
<!-- Current page: {{ page.url | url }} -->
|
||
</body>
|
||
</html> |