dusk/website
dusk/website
1
0
Fork 1
Code

fix: improve layouting

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/window.svelte
View File

@ -6,7 +6,7 @@
<div <div
class=" class="
flex flex-col 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] border-ralsei-white border-ridge border-8 border-t-[12px]
bg-ralsei-black bg-ralsei-black
" "

2
src/routes/entries/+page.svelte
View File

@ -7,7 +7,7 @@
let posts: PostData[] = data.posts as PostData[]; let posts: PostData[] = data.posts as PostData[];
</script> </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} {#each posts as post, index}
{@const x = index % 2 === 0 ? 'lg:ml-16' : 'lg:ml-36'} {@const x = index % 2 === 0 ? 'lg:ml-16' : 'lg:ml-36'}
{@const y = index % 2 === 0 ? 'lg:mt-6' : 'lg:mt-10'} {@const y = index % 2 === 0 ? 'lg:mt-6' : 'lg:mt-10'}

2
src/routes/entries/_layout.svelte
View File

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

10
src/routes/guestbook/+page.svelte
View File

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