Add basic base layout

zola-base
Thom Dickson 8 months ago
parent bf4d599ccd
commit 488e853ec2
Signed by untrusted user: boots
GPG Key ID: 40BE2AF8EBF8D2BB
  1. 4
      config.toml
  2. 30
      sass/main.scss
  3. 10
      templates/base.html
  4. 14
      templates/sidebar.html

@ -14,3 +14,7 @@ highlight_code = true
[extra]
# Put all your custom variables here
toolbar_pages = [
["About Us", "about"],
["Contact", "contact"],
]

@ -0,0 +1,30 @@
$sidebar_width: 20%;
body {
margin: 0;
nav {
height: 100%;
position: fixed;
width: $sidebar_width;
background: rgba(255, 0, 0, .1);
padding-top: 32px;
img {
width: 100%;
}
div {
padding: 0 16px 0 16px;
}
}
main {
height: 100%;
margin-left: $sidebar_width;
background: rgba(0, 255, 0, .1);
padding-top: 50px;
article {
margin: auto;
border: 1px solid blue;
padding: 16px;
max-width: 1000px;
}
}
}

@ -7,10 +7,16 @@
Mountain Linux Club
{% endif %}
</title>
<link rel="stylesheet" href="{{ get_url(path='main.css') }}">
</head>
<body>
{% block content %}
{% endblock %}
{% include "sidebar.html" %}
<main>
<article>
{% block content %}
{% endblock %}
</article>
</main>
</body>
</html>

@ -0,0 +1,14 @@
<nav>
<div>
<img src="{{ get_url(path='logo.png') }}">
</div>
<div>
<ul>
{% for page in config.extra.toolbar_pages %}
<li>
<a href="{{ get_url(path=page[1]) }}">{{ page[0] }}</a>
</li>
{% endfor %}
</ul>
</div>
</nav>
Loading…
Cancel
Save