Streamer272/svitan.dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

📱 Adds responsive resizing of main element

Browse Source
This commit is contained in:
Daniel Svitan 2025-05-01 13:33:21 +02:00
parent 4906b8f633
commit d4fbfa1a7a
1 changed files with 18 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/pages/index.astro
View File

@ -47,10 +47,10 @@ if (now.getMonth() > 7 || (now.getMonth() === 7 && now.getDate() >= 23)) {
</style> </style>
<Layout> <Layout>
<div class="w-screen h-full flex items-center justify-start flex-col"> <div class="w-screen h-full flex items-center justify-start flex-col overflow-x-scroll">
<div class="w-1 h-10 shrink-0"/> <div class="w-1 h-10 shrink-0"/>
<main class="w-[50vw] border-solid border-black border-1 p-1 shrink-0"> <main class="w-[90vw] sm:w-[80vw] md:w-[70vw] lg:w-[60vw] xl:w-[50vw] border-solid border-black border-1 p-1 shrink-0 overflow-auto">
<p>Note: this page has been kept simple in favor of accessibility</p> <p>Note: this page has been kept simple in favor of accessibility</p>
<div class="h-4"/> <div class="h-4"/>
@ -72,8 +72,8 @@ if (now.getMonth() > 7 || (now.getMonth() === 7 && now.getDate() >= 23)) {
<h2 class="text-lg">Experience:</h2> <h2 class="text-lg">Experience:</h2>
<table class="w-full"> <table class="w-full">
<tr> <tr>
<th class="w-44">When</th> <th class="max-w-44"><p class="px-1">When</p></th>
<th>Occupation and details</th> <th><p class="px-1">Occupation and details</p></th>
</tr> </tr>
<tr> <tr>
@ -104,10 +104,10 @@ if (now.getMonth() > 7 || (now.getMonth() === 7 && now.getDate() >= 23)) {
<h2 class="text-lg">Some of my projects:</h2> <h2 class="text-lg">Some of my projects:</h2>
<table class="w-full"> <table class="w-full">
<tr> <tr>
<th class="w-60">Name</th> <th class="max-w-60"><p class="px-1">Name</p></th>
<th class="w-24">Reference</th> <th class="max-w-24"><p class="px-1">Reference</p></th>
<th>Description</th> <th><p class="px-1">Description</p></th>
<th class="w-32">Tags</th> <th class="max-w-32"><p class="px-1">Tags</p></th>
</tr> </tr>
<tr> <tr>
@ -119,7 +119,7 @@ if (now.getMonth() > 7 || (now.getMonth() === 7 && now.getDate() >= 23)) {
<td>Research paper entitled "Faktory ovplyvňujúce študijné výsledky a identifikácia rizikových <td>Research paper entitled "Faktory ovplyvňujúce študijné výsledky a identifikácia rizikových
skupín" skupín"
</td> </td>
<td class="flex gap-x-1 text-sm"> <td class="flex gap-1 flex-wrap text-sm">
<span class="hashtag">#statistics</span> <span class="hashtag">#statistics</span>
<span class="hashtag">#research</span> <span class="hashtag">#research</span>
</td> </td>
@ -132,7 +132,7 @@ if (now.getMonth() > 7 || (now.getMonth() === 7 && now.getDate() >= 23)) {
<Link link="https://zelena.svr.sk/"/> <Link link="https://zelena.svr.sk/"/>
</td> </td>
<td>A website for a school club of environmentalists</td> <td>A website for a school club of environmentalists</td>
<td class="flex gap-x-1 text-sm"> <td class="flex gap-1 flex-wrap text-sm">
<span class="hashtag">#web-dev</span> <span class="hashtag">#web-dev</span>
<span class="hashtag">#nuxt</span> <span class="hashtag">#nuxt</span>
</td> </td>
@ -144,7 +144,7 @@ if (now.getMonth() > 7 || (now.getMonth() === 7 && now.getDate() >= 23)) {
<Link link="https://gitea.svitan.dev/Streamer272/door-alarm"/> <Link link="https://gitea.svitan.dev/Streamer272/door-alarm"/>
</td> </td>
<td>A home-made door alarm based on ultrasound sensor distance measurements (in development)</td> <td>A home-made door alarm based on ultrasound sensor distance measurements (in development)</td>
<td class="flex gap-x-1 text-sm"> <td class="flex gap-1 flex-wrap text-sm">
<span class="hashtag">#electronics</span> <span class="hashtag">#electronics</span>
<span class="hashtag">#rust</span> <span class="hashtag">#rust</span>
</td> </td>
@ -156,7 +156,7 @@ if (now.getMonth() > 7 || (now.getMonth() === 7 && now.getDate() >= 23)) {
<Link link="https://github.com/Streamer272/automod"/> <Link link="https://github.com/Streamer272/automod"/>
</td> </td>
<td>A discord bot for my local community</td> <td>A discord bot for my local community</td>
<td class="flex gap-x-1 text-sm"> <td class="flex gap-1 flex-wrap text-sm">
<span class="hashtag">#discord</span> <span class="hashtag">#discord</span>
<span class="hashtag">#kotlin</span> <span class="hashtag">#kotlin</span>
</td> </td>
@ -169,7 +169,7 @@ if (now.getMonth() > 7 || (now.getMonth() === 7 && now.getDate() >= 23)) {
<Link link="https://github.com/7274-dev"/> <Link link="https://github.com/7274-dev"/>
</td> </td>
<td>An interactive game-like app for kids with an advent theme</td> <td>An interactive game-like app for kids with an advent theme</td>
<td class="flex gap-x-1 text-sm"> <td class="flex gap-1 flex-wrap text-sm">
<span class="hashtag">#web-dev</span> <span class="hashtag">#web-dev</span>
<span class="hashtag">#react</span> <span class="hashtag">#react</span>
</td> </td>
@ -181,7 +181,7 @@ if (now.getMonth() > 7 || (now.getMonth() === 7 && now.getDate() >= 23)) {
<Link link="https://gitea.svitan.dev/Streamer272/free-fall-sim"/> <Link link="https://gitea.svitan.dev/Streamer272/free-fall-sim"/>
</td> </td>
<td>A very, very simple free fall simulation</td> <td>A very, very simple free fall simulation</td>
<td class="flex gap-x-1 text-sm"> <td class="flex gap-1 flex-wrap text-sm">
<span class="hashtag">#rust</span> <span class="hashtag">#rust</span>
<span class="hashtag">#physics</span> <span class="hashtag">#physics</span>
</td> </td>
@ -194,7 +194,7 @@ if (now.getMonth() > 7 || (now.getMonth() === 7 && now.getDate() >= 23)) {
<Link link="https://github.com/Streamer272/whats-my-acronym-asm"/> <Link link="https://github.com/Streamer272/whats-my-acronym-asm"/>
</td> </td>
<td>What's my acronym written in x64 Assembly, compiled with NASM</td> <td>What's my acronym written in x64 Assembly, compiled with NASM</td>
<td class="flex gap-x-1 text-sm"> <td class="flex gap-1 flex-wrap text-sm">
<span class="hashtag">#assembly</span> <span class="hashtag">#assembly</span>
<span class="hashtag">#nasm</span> <span class="hashtag">#nasm</span>
</td> </td>
@ -206,7 +206,7 @@ if (now.getMonth() > 7 || (now.getMonth() === 7 && now.getDate() >= 23)) {
<Link link="https://github.com/Streamer272/rat"/> <Link link="https://github.com/Streamer272/rat"/>
</td> </td>
<td>The cat clone on meth, inspired by bat (not finished)</td> <td>The cat clone on meth, inspired by bat (not finished)</td>
<td class="flex gap-x-1 text-sm"> <td class="flex gap-1 flex-wrap text-sm">
<span class="hashtag">#c</span> <span class="hashtag">#c</span>
</td> </td>
</tr> </tr>
@ -243,7 +243,8 @@ if (now.getMonth() > 7 || (now.getMonth() === 7 && now.getDate() >= 23)) {
<div class="h-6"/> <div class="h-6"/>
<p>Note: the source code of this website is available <a <p>Note: the source code of this website is available <a
href="https://gitea.svitan.dev/Streamer272/svitan.dev" target="_blank" class="underline">here</a></p> href="https://gitea.svitan.dev/Streamer272/svitan.dev" target="_blank" class="underline">here</a>
</p>
</main> </main>
<div class="w-1 h-10 shrink-0"/> <div class="w-1 h-10 shrink-0"/>