Migrated to daisyui 5
This commit is contained in:
BOT Alex
parent
2fa0e4ee8e
commit
4fa68a8e7f
1516
package-lock.json
generated
1516
package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
|
@ -16,19 +16,19 @@
|
|||
"@sveltejs/vite-plugin-svelte": "^3.0.0",
|
||||
"@tailwindcss/typography": "^0.5.15",
|
||||
"autoprefixer": "^10.4.20",
|
||||
"daisyui": "^4.12.12",
|
||||
"postcss": "^8.4.47",
|
||||
"daisyui": "^5.0.12",
|
||||
"sass": "^1.77.4",
|
||||
"svelte": "^5.25.7",
|
||||
"svelte-check": "^3.6.0",
|
||||
"svelte-highlight": "^7.6.0",
|
||||
"tailwindcss": "^3.4.13",
|
||||
"tailwindcss": "^4.1.3",
|
||||
"typescript": "^5.0.0",
|
||||
"vite": "^5.0.3",
|
||||
"vite-plugin-svgr": "^4.2.0"
|
||||
},
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"@tailwindcss/vite": "^4.1.3",
|
||||
"lucide-svelte": "^0.475.0",
|
||||
"svelte-katex": "^0.1.2",
|
||||
"svelte-media-queries": "^1.6.2",
|
||||
|
|
|
|||
|
|
@ -1,6 +0,0 @@
|
|||
export default {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
}
|
||||
55
src/app.css
Normal file
55
src/app.css
Normal file
|
|
@ -0,0 +1,55 @@
|
|||
@import "tailwindcss";
|
||||
@plugin "daisyui";
|
||||
|
||||
@plugin "daisyui/theme" {
|
||||
name: "DeprivedTheme";
|
||||
default: false;
|
||||
prefersdark: false;
|
||||
color-scheme: "dark";
|
||||
--color-base-100: oklch(27% 0.072 132.109);
|
||||
--color-base-200: oklch(40% 0.101 131.063);
|
||||
--color-base-300: oklch(45% 0.124 130.933);
|
||||
--color-base-content: oklch(96% 0.067 122.328);
|
||||
--color-primary: oklch(85% 0.199 91.936);
|
||||
--color-primary-content: oklch(28% 0.066 53.813);
|
||||
--color-secondary: oklch(70% 0.183 293.541);
|
||||
--color-secondary-content: oklch(28% 0.141 291.089);
|
||||
--color-accent: oklch(82% 0.189 84.429);
|
||||
--color-accent-content: oklch(27% 0.077 45.635);
|
||||
--color-neutral: oklch(64% 0.2 131.684);
|
||||
--color-neutral-content: oklch(98% 0.031 120.757);
|
||||
--color-info: oklch(68% 0.169 237.323);
|
||||
--color-info-content: oklch(97% 0.013 236.62);
|
||||
--color-success: oklch(72% 0.219 149.579);
|
||||
--color-success-content: oklch(98% 0.018 155.826);
|
||||
--color-warning: oklch(79% 0.184 86.047);
|
||||
--color-warning-content: oklch(98% 0.026 102.212);
|
||||
--color-error: oklch(64% 0.246 16.439);
|
||||
--color-error-content: oklch(96% 0.015 12.422);
|
||||
--radius-selector: 0.25rem;
|
||||
--radius-field: 2rem;
|
||||
--radius-box: 0.5rem;
|
||||
--size-selector: 0.25rem;
|
||||
--size-field: 0.25rem;
|
||||
--border: 1px;
|
||||
--depth: 1;
|
||||
--noise: 1;
|
||||
}
|
||||
|
||||
|
||||
.bg-grid {
|
||||
background:
|
||||
linear-gradient(-90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px),
|
||||
linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
|
||||
#f2f2f2;
|
||||
background-size:
|
||||
4px 4px,
|
||||
4px 4px,
|
||||
80px 80px,
|
||||
80px 80px,
|
||||
80px 80px,
|
||||
80px 80px,
|
||||
80px 80px,
|
||||
80px 80px;
|
||||
background-color: var(--color-base-100);
|
||||
}
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
<!doctype html>
|
||||
<html lang="en" data-theme="Synthwave" style="overflow-x: hidden;">
|
||||
<html lang="en" data-theme="DeprivedTheme" style="overflow-x: hidden;">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="description" content="
|
||||
|
|
|
|||
|
|
@ -1,3 +0,0 @@
|
|||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
|
@ -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>
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import tailwindcss from "@tailwindcss/vite";
|
||||
import { sveltekit } from '@sveltejs/kit/vite';
|
||||
import { defineConfig } from 'vite';
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [sveltekit()],
|
||||
plugins: [tailwindcss(), sveltekit()],
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in a new issue