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

More HTML5-compliant semantic layout

Browse Source
This commit is contained in:
Emil Miler 2022-11-28 15:11:08 +01:00
parent d2d59b6491
commit 6a0b7f5afd
2 changed files with 12 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
sass/style.scss
View File

@ -41,7 +41,7 @@
/* Do not let wide blocks, such as pre, expand the column and overflow */ /* Do not let wide blocks, such as pre, expand the column and overflow */
&>*{ min-width: 0 } &>*{ min-width: 0 }
& aside>*:first-child, & nav>*:first-child,
& main>*:first-child, & main>*:first-child,
& main>article:first-child h2 & main>article:first-child h2
{ padding-top: 0; margin-top: 0; } { padding-top: 0; margin-top: 0; }
@ -73,10 +73,10 @@ header {
.title { font-size: 1.5em; } .title { font-size: 1.5em; }
.title:hover { text-decoration: none } .title:hover { text-decoration: none }
nav { font-size: 1rem } .links { font-size: 1rem }
} }
aside { nav {
margin-bottom: 4rem; margin-bottom: 4rem;
span.title { span.title {
@ -200,9 +200,9 @@ a {
.grid { grid-template-columns: auto } .grid { grid-template-columns: auto }
aside { nav {
ul { display: none } ul { display: none }
ul.nav { ul.main {
display: flex; display: flex;
justify-content: center; justify-content: center;
flex-wrap: wrap; flex-wrap: wrap;
@ -211,7 +211,7 @@ a {
span.title { display: none } span.title { display: none }
} }
header, aside { margin-bottom: 3rem } header, nav { margin-bottom: 3rem }
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
@ -225,7 +225,7 @@ a {
color: inherit; color: inherit;
} }
aside ul li a { nav ul li a {
color: inherit; color: inherit;
&:hover { &:hover {

10
templates/index.html
View File

@ -12,18 +12,18 @@
<header> <header>
<div class="wrap"> <div class="wrap">
<a href="{{ config.base_url }}" class="title">{{ config.title }}</a> <a href="{{ config.base_url }}" class="title">{{ config.title }}</a>
<nav> <div class="links">
{% if config.extra.repository_url %} {% if config.extra.repository_url %}
<a href="{{ config.extra.repository_url }}">Source</a>, <a href="{{ config.extra.repository_url }}">Source</a>,
{% endif %} {% endif %}
<a href="{{ get_url(path="/posts/atom.xml", trailing_slash=false) }}">RSS/Atom</a> <a href="{{ get_url(path="/posts/atom.xml", trailing_slash=false) }}">RSS/Atom</a>
</nav> </div>
</div> </div>
</header> </header>
<div class="wrap grid"> <div class="wrap grid">
<aside> <nav>
<span class="title">Navigation</span> <span class="title">Navigation</span>
<ul class="nav"> <ul class="main">
{% for item in config.extra.nav %} {% for item in config.extra.nav %}
<li <li
{% if item.mobile_only %} {% if item.mobile_only %}
@ -34,7 +34,7 @@
</ul> </ul>
<span class="title">Categories</span> <span class="title">Categories</span>
{{ macros::list_taxonomy(kind="categories") }} {{ macros::list_taxonomy(kind="categories") }}
</aside> </nav>
<main> <main>
{% block content %} {% block content %}
{{ macros::list_posts(section="posts", count=config.extra.latest_posts_count) }} {{ macros::list_posts(section="posts", count=config.extra.latest_posts_count) }}