em/em.0x45.cz
1
0
Fork 0
Code Actions

Basic styles

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
sass/style.scss
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 }
}

9
templates/index.html
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>