Skip to content

Commit 9c44f3f

Browse files
cb341cb341
committed
Improve responsiveness
1 parent a84b3b5 commit 9c44f3f

1 file changed

Lines changed: 51 additions & 44 deletions

File tree

‎_layouts/base.html‎

Lines changed: 51 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
<html lang="en">
1616
<head>
1717
<meta charset="utf-8">
18-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
18+
<meta name="viewport" content="width=device-width, initial-scale=1">
1919
<title>{{ page_title }}</title>
2020
<meta name="title" content="{{ page_title }}">
2121
<meta name="description" content="{{ page_description }}">
@@ -61,10 +61,13 @@
6161
</script>
6262
<style>
6363
body {
64+
overflow-y: scroll;
65+
}
66+
67+
.wrapper {
6468
max-width: 80ch;
6569
margin-left: auto;
6670
margin-right: auto;
67-
overflow-y: scroll;
6871
}
6972

7073
p img {
@@ -78,52 +81,56 @@
7881
</style>
7982
</head>
8083
<body>
81-
<center>
82-
<header role="banner">
83-
<h1>{% include navlink.html href="/" label="CB341.DEV" %}</h1>
84-
<nav role="navigation" aria-label="Main navigation">
85-
{% include navlink.html href="/" label="Home" %}
86-
| {% include navlink.html href="/about" label="About" %}
87-
| {% include navlink.html href="/uses" label="Uses" %}
88-
| {% include navlink.html href="/til" label="TIL" %}
89-
| {% include navlink.html href="/blog" label="Blog" %}
90-
| {% include navlink.html href="/projects" label="Projects" %}
91-
| {% include navlink.html href="/gallery" label="Gallery" %}
84+
<div class="wrapper">
85+
<center>
86+
<header role="banner">
87+
<h1>{% include navlink.html href="/" label="CB341.DEV" %}</h1>
88+
<nav role="navigation" aria-label="Main navigation">
89+
{% include navlink.html href="/" label="Home" %}
90+
| {% include navlink.html href="/about" label="About" %}
91+
| {% include navlink.html href="/uses" label="Uses" %}
92+
| {% include navlink.html href="/til" label="TIL" %}
93+
| {% include navlink.html href="/blog" label="Blog" %}
94+
| {% include navlink.html href="/projects" label="Projects" %}
95+
| {% include navlink.html href="/gallery" label="Gallery" %}
96+
</nav>
97+
<nav role="navigation" aria-label="Social media links">
98+
<a href="https://github.com/cb341" target="_blank" rel="noopener noreferrer">GitHub</a>
99+
|
100+
<a href="https://www.codewars.com/users/cb341" target="_blank" rel="noopener noreferrer">Codewars</a>
101+
|
102+
<a href="https://mastodon.social/deck/@cb341" target="_blank" rel="noopener noreferrer">Mastodon</a>
103+
|
104+
<a href="https://www.linkedin.com/in/daniel-bengl" target="_blank" rel="noopener noreferrer">LinkedIn</a>
105+
</nav>
106+
</header>
107+
</center>
108+
109+
<main id="main-content" role="main">
110+
{{ content }}
111+
<nav role="navigation" aria-label="Post navigation">
112+
<hr>
113+
<a href="https://github.com/cb341/cb341.github.io/blob/main/{{ page.path }}" target="_blank" rel="noopener noreferrer">GitHub</a>
114+
{%- if page.collection == 'posts' %}{% include post_nav.html %}{%- endif -%}
115+
{%- if page.collection == 'projects' %}{% include project_nav.html %}{%- endif -%}
116+
{%- if page.layout == 'gallery' %}{% include gallery_nav.html %}{%- endif -%}
92117
</nav>
93-
<nav role="navigation" aria-label="Social media links">
94-
<a href="https://github.com/cb341" target="_blank" rel="noopener noreferrer">GitHub</a>
95-
|
96-
<a href="https://www.codewars.com/users/cb341" target="_blank" rel="noopener noreferrer">Codewars</a>
118+
</main>
119+
120+
<center>
121+
<footer role="contentinfo">
122+
<hr>
123+
<p><small>(c) {{ "now" | date: "%Y" }} cb341. Licensed under <a href="https://creativecommons.org/licenses/by/4.0/" target="_blank" rel="noopener noreferrer">CC BY 4.0</a>.</small></p>
124+
<a href="https://discord.com/users/456151064484249612" target="_blank" rel="noopener noreferrer">Discord</a>
97125
|
98126
<a href="https://mastodon.social/deck/@cb341" target="_blank" rel="noopener noreferrer">Mastodon</a>
99127
|
100128
<a href="https://www.linkedin.com/in/daniel-bengl" target="_blank" rel="noopener noreferrer">LinkedIn</a>
101-
</nav>
102-
</header>
103-
</center>
104-
105-
<main id="main-content" role="main">
106-
{{ content }}
107-
<nav role="navigation" aria-label="Post navigation">
108-
<hr>
109-
<a href="https://github.com/cb341/cb341.github.io/blob/main/{{ page.path }}" target="_blank" rel="noopener noreferrer">GitHub</a>
110-
{%- if page.collection == 'posts' %}{% include post_nav.html %}{%- endif -%}
111-
{%- if page.collection == 'projects' %}{% include project_nav.html %}{%- endif -%}
112-
{%- if page.layout == 'gallery' %}{% include gallery_nav.html %}{%- endif -%}
113-
</nav>
114-
</main>
115-
116-
<footer role="contentinfo">
117-
<hr>
118-
<p><small>(c) {{ "now" | date: "%Y" }} cb341. Licensed under <a href="https://creativecommons.org/licenses/by/4.0/" target="_blank" rel="noopener noreferrer">CC BY 4.0</a>.</small></p>
119-
<a href="https://discord.com/users/456151064484249612" target="_blank" rel="noopener noreferrer">Discord</a>
120-
|
121-
<a href="https://mastodon.social/deck/@cb341" target="_blank" rel="noopener noreferrer">Mastodon</a>
122-
|
123-
<a href="https://www.linkedin.com/in/daniel-bengl" target="_blank" rel="noopener noreferrer">LinkedIn</a>
124-
|
125-
<a href="/rss.xml" target="_blank" rel="noopener noreferrer">RSS Feed</a>
126-
</footer>
127-
<script>document.addEventListener('keydown',e=>{const as=[...document.querySelectorAll('[aria-label="Post navigation"] a')];if(e.key==='ArrowLeft'){const a=as.find(a=>a.textContent.includes('<'));if(a)location.href=a.href;}if(e.key==='ArrowRight'){const a=as.find(a=>a.textContent.includes('>'));if(a)location.href=a.href;}});</script>
129+
|
130+
<a href="/rss.xml" target="_blank" rel="noopener noreferrer">RSS Feed</a>
131+
</footer>
132+
</center>
133+
</div>
134+
<script>document.addEventListener('keydown',e=>{const as=[...document.querySelectorAll('[aria-label="Post navigation"] a')];if(e.key==='ArrowLeft'){const a=as.find(a=>a.textContent.includes('<'));if(a)location.href=a.href;}if(e.key==='ArrowRight'){const a=as.find(a=>a.textContent.includes('>'));if(a)location.href=a.href;}});</script>
128135
</body>
129136
</html>

0 commit comments

Comments
 (0)
⚡