refactor: style on windows
All checks were successful
create archive with lfs / tag (push) Successful in 9s

This commit is contained in:
dusk 2024-11-16 15:17:25 +03:00
parent 67cfeac6c3
commit e812557794
Signed by: dusk
SSH Key Fingerprint: SHA256:Abmvag+juovVufZTxyWY8KcVgrznxvBjQpJesv071Aw
4 changed files with 77 additions and 80 deletions

View File

@ -9,6 +9,8 @@
export let entry: boolean = false; export let entry: boolean = false;
export let removePadding: boolean = false; export let removePadding: boolean = false;
export let center: boolean = false; export let center: boolean = false;
export let layered: boolean = false;
export let style: string = "";
const scaleKeyframes = [ const scaleKeyframes = [
"window-open", "window-open",
@ -43,10 +45,11 @@
}} }}
on:click={(data) => {focusWindow(data.currentTarget)}} on:click={(data) => {focusWindow(data.currentTarget)}}
class=" class="
relative flex flex-col {sticky ? 'md:sticky md:-top-9' : ''} {center ? "mx-auto" : ""} relative {layered ? "col-[1] row-[1]" : ""} flex flex-col {sticky ? 'md:sticky md:-top-9' : ''} {center ? "mx-auto" : ""}
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 [height:fit-content] 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 [height:fit-content]
bg-ralsei-black border-ralsei-white border-ridge border-8 border-t-[12px] bg-ralsei-black border-ralsei-white border-ridge border-8 border-t-[12px]
animate-{chosenKeyframe} animate-{chosenKeyframe} drop-shadow-[35px_35px_35px_rgba(1,1,1,0.5)]
{style}
" "
{id} {id}
> >

View File

@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { browser } from '$app/environment';
import getTitle from '$lib/getTitle'; import getTitle from '$lib/getTitle';
import NavButton from '../components/navButton.svelte'; import NavButton from '../components/navButton.svelte';
import '../styles/app.css'; import '../styles/app.css';
@ -133,10 +134,10 @@
<slot /> <slot />
</div> </div>
<nav class="w-full min-h-[5vh] max-h-[6vh] fixed bottom-0 z-10 bg-ralsei-black overflow-hidden"> <nav class="w-full min-h-[5vh] max-h-[6vh] fixed bottom-0 z-[999] bg-ralsei-black overflow-hidden">
<div <div
class=" class="
max-w-full max-h-fit p-1 max-w-full max-h-fit p-1 z-[999]
border-ralsei-white border-8 border-ralsei-white border-8
bg-gradient-to-r to-ralsei-pink-neon/30 from-ralsei-pink-regular/20 from-30% bg-gradient-to-r to-ralsei-pink-neon/30 from-ralsei-pink-regular/20 from-30%
" "

View File

@ -3,7 +3,7 @@
import Window from '../components/window.svelte'; import Window from '../components/window.svelte';
</script> </script>
<div class="flex flex-col md:flex-row gap-y-4 lg:gap-y-0 md:h-full h-card"> <div class="flex flex-col md:flex-row gap-y-2 lg:gap-y-0 md:h-full h-card">
<div class="flex flex-col gap-y-2 lg:gap-y-0"> <div class="flex flex-col gap-y-2 lg:gap-y-0">
<Window title="readme?" iconUri="/icons/question.png"> <Window title="readme?" iconUri="/icons/question.png">
<div class="flex flex-col prose prose-ralsei prose-img:m-0 leading-none"> <div class="flex flex-col prose prose-ralsei prose-img:m-0 leading-none">
@ -58,83 +58,75 @@
</div> </div>
</div> </div>
</Window> </Window>
<div class="mt-auto"> <Window title="latest stuff" style="mt-auto">
<Window title="latest stuff"> <div class="prose prose-ralsei prose-img:m-0 leading-6">
<div class="prose prose-ralsei prose-img:m-0 leading-6"> <p>
<p> worked on a game for a jam!! check it out at <a href="https://manonox.itch.io/fish-well"
worked on a game for a jam!! check it out at <a href="https://manonox.itch.io/fish-well" >it's itch.io page</a
>it's itch.io page</a >!
>! </p>
</p> <img
<img class="md:max-w-[35rem]"
class="md:max-w-[35rem]" src="https://img.itch.zone/aW1hZ2UvMjkxNjQzOC8xNzQ2MDY2Mi5wbmc=/original/%2BIb5Vf.png"
src="https://img.itch.zone/aW1hZ2UvMjkxNjQzOC8xNzQ2MDY2Mi5wbmc=/original/%2BIb5Vf.png" alt="fish well gameplay screenshot"
alt="fish well gameplay screenshot" />
/> </div>
</div> </Window>
</Window>
</div>
</div> </div>
<div class="hidden md:block md:grow" /> <div class="hidden md:block md:grow" />
<div class="flex flex-col gap-y-2 lg:gap-y-0"> <div class="flex flex-col gap-y-2 lg:gap-y-0">
<div class="md:ml-auto"> <Window title="links!" iconUri="/icons/contact.png" style="md:ml-auto">
<Window title="links!" iconUri="/icons/contact.png"> <div class="prose prose-ralsei prose-ul:leading-[1.4rem] prose-headings:leading-none">
<div class="prose prose-ralsei prose-ul:leading-[1.4rem] prose-headings:leading-none"> <ul>
<ul> <li>discord: yusdacra</li>
<li>discord: yusdacra</li> <li>
<li> e-mail:
e-mail: <a class="u-email" href="mailto:y.bera003.06@pm.me" rel="me">y.bera003.06@pm.me</a>
<a class="u-email" href="mailto:y.bera003.06@pm.me" rel="me">y.bera003.06@pm.me</a> </li>
</li> <li>
<li> bluesky:
bluesky: <a class="u-url" href="https://bsky.app/profile/gaze.systems" rel="me">@gaze.systems</a>
<a class="u-url" href="https://bsky.app/profile/gaze.systems" rel="me" </li>
>@gaze.systems</a </ul>
> <h3>development</h3>
</li> <ul>
</ul> <li>
<h3>development</h3> github:
<ul> <a class="u-url" href="https://github.com/yusdacra" rel="me">@yusdacra</a>
<li> </li>
github: <li>
<a class="u-url" href="https://github.com/yusdacra" rel="me">@yusdacra</a> my gitea:
</li> <a class="u-url" href="https://git.gaze.systems/dusk" rel="me">@dusk</a>
<li> (<a href="https://git.gaze.systems/gazesys/website">website repo</a>)
my gitea: </li>
<a class="u-url" href="https://git.gaze.systems/dusk" rel="me">@dusk</a> <li>
(<a href="https://git.gaze.systems/gazesys/website">website repo</a>) gitlab:
</li> <a class="u-url" href="https://gitlab.com/yusdacra" rel="me">@yusdacra</a>
<li> </li>
gitlab: <li>
<a class="u-url" href="https://gitlab.com/yusdacra" rel="me">@yusdacra</a> itch.io:
</li> <a class="u-url" href="https://yusdacra.itch.io" rel="me">@yusdacra</a>
<li> </li>
itch.io: </ul>
<a class="u-url" href="https://yusdacra.itch.io" rel="me">@yusdacra</a> <h3>services</h3>
</li> <ul>
</ul> <li>
<h3>services</h3> <a href="https://limbus.gaze.systems">random project moon art</a>
<ul> </li>
<li> <li>
<a href="https://limbus.gaze.systems">random project moon art</a> <a href="https://git.gaze.systems">gitea</a>
</li> <span class="text-sm">(if i like you ask me for an acc ;3)</span>
<li> </li>
<a href="https://git.gaze.systems">gitea</a> </ul>
<span class="text-sm">(if i like you ask me for an acc ;3)</span> </div>
</li> </Window>
</ul> <Window title="current" iconUri="/icons/entry.png" style="mt-auto">
</div> <div class="prose prose-ralsei leading-6">
</Window> <ul>
</div> <li>playing wynncraft, helldivers 2, warframe</li>
<div class="mt-auto"> <li>idk bother me to do stuff</li>
<Window title="current" iconUri="/icons/entry.png"> </ul>
<div class="prose prose-ralsei leading-6"> </div>
<ul> </Window>
<li>playing wynncraft, helldivers 2, warframe</li>
<li>idk bother me to do stuff</li>
</ul>
</div>
</Window>
</div>
</div> </div>
</div> </div>

View File

@ -1,4 +1,5 @@
const colors = require('tailwindcss/colors') const colors = require('tailwindcss/colors')
const plugin = require('tailwindcss/plugin')
/** @type {import('tailwindcss').Config} */ /** @type {import('tailwindcss').Config} */
export default { export default {