style adaptions, some style fixes

main
Norman Köhring 1 year ago
parent 78c676bbda
commit ea3d1d2f11

@ -68,10 +68,10 @@ body{
}
.content {
max-width: var(--max-layout-width);
margin: 0 auto;
margin: 3rem auto 1rem;
padding: 0 24px;
word-wrap: break-word;
min-height: 80vh;
min-height: calc(100vh - 10rem - 1px);
}
@media only screen and (max-width:1000px) {
.content{

@ -1,19 +1,8 @@
footer {
background-color: var(--navbar-color);
border-top: 1px solid var(--light-border-color);
padding: 3rem 0;
font-family: var(--post-font-family);
margin-top: 1rem;
}
footer section {
display: flex;
flex-direction: column;
align-items: center;
gap: 1.25rem;
}
footer nav {
display: flex;
gap: 0.25rem;
margin: 0 1rem;
}
height: 3rem;
border-top: 1px solid var(--light-border-color);
background-color: var(--navbar-color);
font-family: var(--post-font-family);
text-align: center;
line-height: 3;
}

@ -1,8 +1,8 @@
.page-header {
margin: 4rem 0px 1rem 0px;
font-size: 3em;
line-height: 100%;
font-family: var(--header-font);
margin: 4rem 0px 1rem 0px;
}
.centered-header {
@ -16,8 +16,9 @@
font-size: 1em;
}
header {
body > header {
width: 100%;
height: 3rem;
background-color: var(--navbar-color);
}
.navbar{
@ -27,7 +28,7 @@ header {
flex-wrap: wrap;
justify-content: space-between;
padding: 1em 0;
margin:0 auto;
margin: 0 auto;
}
@media only screen and (max-width:1000px) {
.navbar{
@ -53,13 +54,14 @@ header {
.nav-links{
text-decoration: none;
color: var(--text-color);
padding:5px;
border-radius:5px;
transition:100ms;
padding: 5px;
border-radius: 5px;
transition: transform .2s ease-out, background .3s ease, color .3s ease;
}
.nav-links:hover {
color: var(--links);
background-color:var(--secondary-color);
background-color: var(--secondary-color);
transform: translateY(.5em);
}
header .main {
display: flex;
@ -73,13 +75,15 @@ header .main {
/* Otherwise header and menu is too close on small screens*/
margin-bottom: 10px;
}
.nav-navs img{
.nav-navs img {
border: none;
}
.home-title{
.home-title {
display: inline-block;
padding: .25em 1em;
font-size: 1.6em;
color: var(--links);
background-color:var(--secondary-color);
background-color: var(--secondary-color);
}
.socials {
/* flex-child */
@ -91,6 +95,7 @@ header .main {
justify-content: flex-start;
align-items: flex-end;
gap: 6px;
height: 2em;
}
.social {
@ -111,8 +116,6 @@ header .main {
letter-spacing: -0.5px;
}
@media (prefers-color-scheme: dark) {
.social>img {
filter: invert(1);
}
[data-theme="dark"] .social > img {
filter: invert(1);
}

@ -39,10 +39,10 @@ blockquote {
padding-left: 1em;
}
a{
color:var(--text-color);
a {
color: var(--text-color);
text-decoration-color: var(--links);
font-weight:1000;
font-weight: 600;
}
a:hover {
@ -55,4 +55,4 @@ a:hover {
margin: 0;
padding: 0;
}
}
}

@ -1,8 +1,8 @@
{% extends "page.html" %}
{% block main_content %}
<main class="centered-header">
{{ post_macros::page_header(title="404")}}
<span>You have reached somewhere I do not know, or I knew and I have hidden it to preserve my sanity</span>
</main>
{% endblock main_content %}
<main class="centered-header">
<h2>404</h2>
<span>You have reached somewhere I do not know, or I knew and I have hidden it to preserve my sanity</span>
</main>
{% endblock main_content %}

@ -5,7 +5,7 @@
{% set section = get_section(path=section.extra.section_path) %}
{% endif -%}
{{ post_macros::page_header(title=section.title) }}
<h2>{{ section.title }}</h2>
<main>
{%- if paginator %}
@ -32,4 +32,4 @@
{% endif %}
</ul>
{% endif %}
{% endblock main_content %}
{% endblock main_content %}

@ -56,13 +56,6 @@
{% endif -%}
{% endmacro tags %}
{% macro page_header(title) %}
<h2>
{{ title }}
</h2>
{% endmacro content %}
{% macro page_desc(desc) %}
<div id="banner-container-home">
<div id="home-banner-text">
@ -79,78 +72,75 @@
{% macro content(page) %}
<main>
<article>
<div class="title">
{#<h1 class="title">{{ page.title }}</h1>#}
{{ post_macros::page_header(title=page.title) }}
<div class="meta">
{% if page.date %}
Posted on <time>{{ page.date | date(format="%Y-%m-%d") }}</time>
{% endif %}
{% if page.draft %}
<span class="draft-label">DRAFT</span>
{% endif %}
{% if page.taxonomies and page.taxonomies.tags %}
<div class="post-tags">
<nav class="nav tags">
{% for tag in page.taxonomies.tags %}
🏷: <a href={{ get_taxonomy_url(kind='tags' , name=tag) | safe }}>{{ tag }}</a>
{% endfor %}
</nav>
</div>
{% endif %}
||<span> {{ page.reading_time }} minute read</span>
</div>
</div>
{% if page.extra.tldr %}
<div class="tldr">
<strong>tl;dr:</strong>
{{ page.extra.tldr }}
<article>
<header class="title">
<h1>{{ page.title }}</h1>
<div class="meta">
{% if page.taxonomies and page.taxonomies.tags %}
<div class="post-tags">
<nav class="nav tags">
{% for tag in page.taxonomies.tags %}
🏷: <a href={{ get_taxonomy_url(kind='tags' , name=tag) | safe }}>{{ tag }}</a>
{% endfor %}
</nav>
</div>
{% endif %}
{# Optional table of contents #}
{% if config.extra.toc | default(value=false) %}
{% if page.toc %}
<h1>Table of Contents</h1>
<span>
{% if page.draft %}
<span class="draft-label">DRAFT</span>
{% endif %}
{{ page.word_count }} words ({{ page.reading_time }} minute read)
{% if page.date %}posted on <time>{{ page.date | date(format="%Y-%m-%d") }}</time>{% endif %}
</span>
</div>
</header>
{% if page.extra.tldr %}
<div class="tldr">
<strong>tl;dr:</strong>
{{ page.extra.tldr }}
</div>
{% endif %}
{# Optional table of contents #}
{% if config.extra.toc | default(value=false) %}
{% if page.toc %}
<h1>Table of Contents</h1>
<ul>
{% for h1 in page.toc %}
<li>
<a href="{{ h1.permalink | safe }}">{{ h1.title }}</a>
{% if h1.children %}
<ul>
{% for h1 in page.toc %}
{% for h2 in h1.children %}
<li>
<a href="{{ h2.permalink | safe }}">{{ h2.title }}</a>
</li>
{% if h2.children %}
<ul>
{% for h3 in h2.children %}
<li>
<a href="{{ h1.permalink | safe }}">{{ h1.title }}</a>
{% if h1.children %}
<ul>
{% for h2 in h1.children %}
<li>
<a href="{{ h2.permalink | safe }}">{{ h2.title }}</a>
</li>
{% if h2.children %}
<ul>
{% for h3 in h2.children %}
<li>
<a href="{{ h3.permalink | safe }}">{{ h3.title }}</a>
</li>
{% endfor %}
</ul>
{% endif %}
{% endfor %}
</ul>
{% endif %}
<a href="{{ h3.permalink | safe }}">{{ h3.title }}</a>
</li>
{% endfor %}
</ul>
{% endif %}
{% endfor %}
</ul>
{% endif %}
{% endif %}
<section class="body">
{{ page.content | safe }}
</section>
</li>
{% endfor %}
</ul>
{% endif %}
{% endif %}
<section class="body">
{{ page.content | safe }}
</section>
</article>
</article>
</main>
{% endmacro content %}
@ -211,4 +201,4 @@
</li>
{% endfor %}
</ul>
{% endmacro list_title %}
{% endmacro list_title %}

@ -1,10 +1,5 @@
<footer>
<section>
<nav>
<span className="desktop-only">Made by
<a href = "https://syedzayyan.com/" rel="noopener noreferrer" target="_blank">SZM</a> and powered by
<a href = "https://getzola.org/" rel="noopener noreferrer" target="_blank">Zola</a></span>
</nav>
</section>
<script src="{{ get_url(path='js/main.js', trailing_slash=false) | safe }}"/></script>
</footer>
©2023 Dan Tiskifer | Powered by
<a href = "https://getzola.org/" rel="noopener noreferrer" target="_blank">Zola</a>
<script src="{{ get_url(path='js/main.js', trailing_slash=false) | safe }}"/></script>
</footer>

@ -9,7 +9,7 @@
{{ post_macros::page_desc(desc=section.extra.desc) }}
{% endif -%}
{{ post_macros::page_header(title=section.title) }}
<h2>{{ section.title }}</h2>
<main class="list">
{%- if paginator %}
@ -37,4 +37,4 @@
{% endif %}
</ul>
{% endif %}
{% endblock main_content %}
{% endblock main_content %}

Loading…
Cancel
Save