fix: improve layouting

This commit is contained in:
dusk 2024-08-23 19:15:25 +03:00
parent c951c74fde
commit d4136e8394
Signed by: dusk
SSH Key Fingerprint: SHA256:Abmvag+juovVufZTxyWY8KcVgrznxvBjQpJesv071Aw
4 changed files with 53 additions and 51 deletions

View File

@ -6,7 +6,7 @@
<div
class="
flex flex-col
max-w-screen-md xl:max-w-screen-lg 2xl:max-w-screen-xl min-w-[30ch] lg:min-w-[40ch] w-fit h-fit
max-w-screen-md xl:max-w-screen-lg 2xl:max-w-screen-xl min-w-[30ch] lg:min-w-[40ch] w-full md:w-fit h-fit
border-ralsei-white border-ridge border-8 border-t-[12px]
bg-ralsei-black
"

View File

@ -7,7 +7,7 @@
let posts: PostData[] = data.posts as PostData[];
</script>
<div class="flex flex-wrap gap-y-4 lg:mx-3 lg:my-4">
<div class="flex flex-col lg:flex-row gap-y-4 lg:mx-3 lg:my-4">
{#each posts as post, index}
{@const x = index % 2 === 0 ? 'lg:ml-16' : 'lg:ml-36'}
{@const y = index % 2 === 0 ? 'lg:mt-6' : 'lg:mt-10'}

View File

@ -11,7 +11,7 @@
<meta property="og:type" content="article" />
</svelte:head>
<div class="lg:mb-[8vh]">
<div class="mb-[8vh]">
<Window {title} iconUri='/icons/entry.png'>
<div class="prose prose-ralsei max-w-[80ch]">
<slot/>

View File

@ -6,10 +6,10 @@
const hasNextPage = data.hasNext;
</script>
<div class="flex flex-row flex-wrap">
<div class="fixed">
<div class="flex flex-col md:flex-row gap-2 md:gap-4">
<div>
<Window title="guestbook">
<div class="flex flex-col gap-4 w-[60ch]">
<div class="flex flex-col gap-4 2xl:w-[60ch]">
<p>hia, here is the guestbook if you wanna post anything :)</p>
<p>just be a good human bean pretty please</p>
<form method="post">
@ -56,8 +56,9 @@
</Window>
</div>
<div class="grow" />
<div class="mb-[7vh] 2xl:mb-0">
<Window title="entries">
<div class="flex flex-col gap-4 w-[60ch] max-w-[60ch]">
<div class="flex flex-col gap-2 md:gap-4 2xl:w-[60ch]">
{#if data.getRatelimited}
<p class="text-error">
woops, looks like you are being ratelimited, try again in like half a minute :3
@ -103,6 +104,7 @@
</div>
</Window>
</div>
</div>
<style lang="postcss">
.entry {