saibotk-de/saiblog
1
0
Fork 0
Code Packages 1 Activity

fix(mobile): Layout

Browse source
This commit is contained in:
Saibotk 2023-10-06 00:52:37 +02:00
parent 14c9d0d631
commit 473870821d
Signed by: saibotk
GPG key ID: 67585F0065E261D5
2 changed files with 9 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/components/Header.astro
View file

@ -8,15 +8,17 @@ import { SITE_TITLE } from '../config'
<header class="mt-8">
<nav class="gap-2 flex items-center">
<nav class="gap-4 lg:gap-2 flex lg:flex-row flex-col items-center">
<h2 class="text-3xl text-white font-semibold mr-4">
{SITE_TITLE}
</h2>
<div>
<HeaderLink href="/">Home</HeaderLink>
<HeaderLink href="/posts">Posts</HeaderLink>
</div>
<div class="ml-auto space-x-2">
<div class="lg:ml-auto space-x-4 mt-2 lg:mt-0">
<a
class="inline-block hover:scale-105 transition duration-150 active:scale-95 active:text-pink-300"
href="https://flausch.social/@saibotk"

6
src/pages/posts.astro
View file

@ -14,10 +14,10 @@ const posts = rawPosts
<ul class="space-y-6">
{
posts.map((post) => (
<li class="flex items-baseline gap-8">
<li class="flex items-baseline gap-2 lg:gap-8">
<time
datetime={post.frontmatter.pubDate}
class="w-32 italic text-zinc-200 underline underline-offset-3"
class="w-32 flex-none italic text-zinc-200 underline underline-offset-3"
>
{new Date(post.frontmatter.pubDate).toLocaleDateString('en-us', {
year: 'numeric',
@ -25,7 +25,7 @@ const posts = rawPosts
day: 'numeric',
})}
</time>
<a class="hover:scale-[1.02] transition duration-150 active:scale-[0.98] active:text-pink-300 text-2xl" href={post.url}>
<a class="hover:scale-[1.02] transition duration-150 active:scale-[0.98] active:text-pink-300 text-xl lg:text-2xl" href={post.url}>
{post.frontmatter.title}
</a>
</li>