1
0

Basic styles

This commit is contained in:
Emil Miler 2021-12-02 11:09:43 +01:00
parent d492db96ca
commit 21f1f15e42
2 changed files with 61 additions and 0 deletions

View File

@ -0,0 +1,52 @@
body {
font-size: 12pt;
line-height: 1.5;
max-width: 60em;
margin: 0 auto;
padding: 1em;
display: grid;
grid-template-columns: 10em auto;
grid-column-gap: 2em;
}
header {
grid-column: 1/-1;
padding: 2rem 0;
font-weight: bold;
font-size: 1.5em;
a { color: inherit }
}
aside {
span.title {
display: block;
margin: 2em 0 1em 0;
font-weight: bold;
}
ul {
list-style-type: none;
padding: 0;
li a {
color: #000;
display: block;
padding: 0 .5em;
&:hover {
color: #fff;
background-color: #000;
text-decoration: none;
}
}
}
}
a {
text-decoration: none;
color: #E1140A;
&:hover { text-decoration: underline }
}

View File

@ -3,6 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>{% block title %}{{ config.title }}{% endblock %}</title> <title>{% block title %}{{ config.title }}{% endblock %}</title>
<link rel="stylesheet" href="style.css">
</head> </head>
<body> <body>
<header> <header>
@ -14,9 +15,17 @@
<li><a href="">anchor</a></li> <li><a href="">anchor</a></li>
<li><a href="">anchor</a></li> <li><a href="">anchor</a></li>
</ul> </ul>
<span class="title">Title</span>
<ul>
<li><a href="">anchor</a></li>
<li><a href="">anchor</a></li>
<li><a href="">anchor</a></li>
</ul>
</aside> </aside>
<main> <main>
{% block content %} {% block content %}
<h1>Title</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam condimentum ipsum eros. Etiam aliquet ipsum lacus, vel congue est lobortis eu. Vestibulum laoreet leo vitae tincidunt euismod. Quisque urna lacus, eleifend vehicula eros sed, faucibus semper ipsum. Sed bibendum tortor blandit dolor finibus, a congue lacus lobortis. Aenean convallis quis risus at interdum.</p>
{% endblock %} {% endblock %}
</main> </main>
</body> </body>