Migrated to daisyui 5

This commit is contained in:
BOT Alex 2025-04-05 22:28:32 +02:00
parent 2fa0e4ee8e
commit 4fa68a8e7f
10 changed files with 598 additions and 1032 deletions

View file

@ -1,6 +1,7 @@
<!-- If url contains "hideOnPrint" param, then detect if start printing then hide elements -->
<script lang="ts">
import "$lib/app.css";
import { Directive } from './../../node_modules/@babel/types/lib/index-legacy.d.ts';
import "../app.css";
import { fly } from 'svelte/transition';
import MediaQuery from 'svelte-media-queries';
@ -48,7 +49,7 @@
<!-- Nav bar -->
<div class="bg-base-200 p-0">
<header class="{hideOnPrint ? 'hide-on-print' : ''}">
<div class="nav-bar pr-4 bg-base-200">
<div class="nav-bar pr-4 bg-base-300">
{#if !isMobile}
<div class="desktop">
<a href="/" class="nav-head">
@ -93,7 +94,7 @@
<slot />
<!-- About footer -->
<footer class="{hideOnPrint ? 'hide-on-print' : ''}">
<div class="{hideOnPrint ? 'hide-on-print' : ''} flex justify-center p-8 bg-base-300 mt-8">
<div class="about-container">
<div class="credits">
<span>© 2023-2024</span>
@ -128,7 +129,7 @@
</a>
</div>
</div>
</footer>
</div>
</div>

View file

@ -72,11 +72,11 @@
</div>
</div>
<div class="flex justify-center w-full px-8 py-4">
<div class="grid space-y-5" style="width: 100%; max-width: 21cm;">
<h2 class="prose main-title" style="font-size: {!mobile ? 3 : 2}rem;">
Developers
</h2>
<div class="flex flex-col justify-center items-center w-full px-8 py-4">
<h2 class="prose main-title text-center" style="font-size: {!mobile ? 3 : 2}rem;">
Developers
</h2>
<div class="grid space-y-5 p-4 rounded" style="width: 100%; max-width: 21cm;">
<Profile name="Zhen / Alex" tags={["Programmer", "3D artist", "UX Designer"]} isMobile={mobile}>
<span>
@ -166,7 +166,7 @@
<br/>
<p>This was made during <a href="https://itch.io/jam/nordic-game-jam-2024/rate/2659665" class="underline">Nordic gamejam 2024</a></p>
<div class="card-actions justify-end">
<a href="https://botalex.itch.io/corrobot-rebounce" target="_blank" class="btn btn-primary">View on itch.io</a>
<a href="https://botalex.itch.io/corrobot-rebounce" target="_blank" class="btn btn-neutral">View on itch.io</a>
</div>
</div>
</div>
@ -188,7 +188,7 @@
<br/>
<p>This was made during <a href="https://itch.io/jam/future-game-makers-jam-2024" class="underline">Future Game Makers</a>, and of course our team won the competition.</p>
<div class="card-actions justify-end">
<a href="https://botalex.itch.io/mop-of-the-dead" target="_blank" class="btn btn-primary">View on itch.io</a>
<a href="https://botalex.itch.io/mop-of-the-dead" target="_blank" class="btn btn-neutral">View on itch.io</a>
</div>
</div>
</div>
@ -210,7 +210,7 @@
<br/>
<p>This was made during <a href="https://itch.io/jam/dmspiljam-november-2021" class="underline">Denmark Masters jam</a>. This jam has youths allover Denmark to compete, and of course our team won the competition again.</p>
<div class="card-actions justify-end">
<a href="https://botalex.itch.io/one-more-time" target="_blank" class="btn btn-primary">View on itch.io</a>
<a href="https://botalex.itch.io/one-more-time" target="_blank" class="btn btn-neutral">View on itch.io</a>
</div>
</div>
</div>
@ -218,7 +218,9 @@
<div class="games card bg-base-100 w-96 shadow-xl">
<figure class="skeleton rounded-b-none" style="height: 15em;"></figure>
<figure class="rounded-b-none" style="height: 15em;">
<div class="bg-grid flex w-full h-full"></div>
</figure>
<div class="card-body">
<h2 class="card-title">What's next?</h2>
<div class="skeleton mt-1 h-4 w-28"></div>
@ -228,7 +230,7 @@
<div class="skeleton h-4 w-full"></div>
<div class="flex grow"/>
<div class="card-actions justify-end">
<a href="/" target="_blank" class="btn btn-primary">RECURSION!</a>
<a href="/" target="_blank" class="btn btn-neutral text-primary-content">RECURSION!</a>
</div>
</div>
</div>

View file

@ -42,12 +42,16 @@
<style>
.developersProfile:not(.snorre):not(.snorre-overlay){
background-image: linear-gradient(oklch(var(--p)) 33%, rgba(255,255,255,0) 0%);
background-image: linear-gradient(var(--color-neutral) 33%, rgba(255,255,255,0) 0%);
background-position: left;
background-size: 0.1rem 0.5rem;
background-repeat: repeat-y;
}
.developersProfile {
}
.snorre {
border-left: dashed transparent 0.1rem;
border-image: linear-gradient(to bottom, red, orange, yellow, green, blue, indigo, violet);
@ -55,7 +59,7 @@
}
.snorre-overlay {
background-image: linear-gradient(rgba(255,255,255,0) 0%, rgba(255,255,255,0) 40%, oklch(var(--b1)) 40%);
background-image: linear-gradient(rgba(255,255,255,0) 0%, rgba(255,255,255,0) 40%, var(--color-base-200) 40%);
background-position: left;
background-size: 0.1rem 0.5rem;
background-repeat: repeat-y;