add standard rosepines
This commit is contained in:
parent
7170c7b663
commit
b8b4ae2480
3 changed files with 60 additions and 21 deletions
|
@ -13,3 +13,39 @@
|
||||||
.spin-slower {
|
.spin-slower {
|
||||||
animation: spin-slower 15s linear infinite;
|
animation: spin-slower 15s linear infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@theme {
|
||||||
|
--color-dark-pine-base: hsl(249deg, 22%, 12%);
|
||||||
|
--color-dark-pine-surface: hsl(247deg, 23%, 15%);
|
||||||
|
--color-dark-pine-overlay: hsl(248deg, 25%, 18%);
|
||||||
|
--color-dark-pine-muted: hsl(249deg, 12%, 47%);
|
||||||
|
--color-dark-pine-subtle: hsl(248deg, 15%, 61%);
|
||||||
|
--color-dark-pine-text: hsl(245deg, 50%, 91%);
|
||||||
|
--color-dark-pine-red: hsl(343deg, 76%, 68%);
|
||||||
|
--color-dark-pine-yellow: hsl(35deg, 88%, 72%);
|
||||||
|
--color-dark-pine-pink: hsl(2deg, 55%, 83%);
|
||||||
|
--color-dark-pine-blue: hsl(197deg, 49%, 38%);
|
||||||
|
--color-dark-pine-green: hsl(189deg, 43%, 73%);
|
||||||
|
--color-dark-pine-purple: hsl(267deg, 57%, 78%);
|
||||||
|
--color-dark-pine-highlight-low: hsl(244deg, 18%, 15%);
|
||||||
|
--color-dark-pine-highlight-med: hsl(249deg, 15%, 28%);
|
||||||
|
--color-dark-pine-highlight-high: hsl(248deg, 13%, 36%);
|
||||||
|
}
|
||||||
|
|
||||||
|
@theme {
|
||||||
|
--color-light-pine-base: hsl(32deg, 57%, 95%);
|
||||||
|
--color-light-pine-surface: hsl(35deg, 100%, 98%);
|
||||||
|
--color-light-pine-overlay: hsl(33deg, 43%, 91%);
|
||||||
|
--color-light-pine-muted: hsl(257deg, 9%, 61%);
|
||||||
|
--color-light-pine-subtle: hsl(248deg, 12%, 52%);
|
||||||
|
--color-light-pine-text: hsl(248deg, 19%, 40%);
|
||||||
|
--color-light-pine-red: hsl(343deg, 35%, 55%);
|
||||||
|
--color-light-pine-yellow: hsl(35deg, 81%, 56%);
|
||||||
|
--color-light-pine-pink: hsl(3deg, 53%, 67%);
|
||||||
|
--color-light-pine-blue: hsl(197deg, 53%, 34%);
|
||||||
|
--color-light-pine-green: hsl(189deg, 30%, 48%);
|
||||||
|
--color-light-pine-purple: hsl(268deg, 21%, 57%);
|
||||||
|
--color-light-pine-highlight-low: hsl(25deg, 35%, 93%);
|
||||||
|
--color-light-pine-highlight-med: hsl(10deg, 9%, 86%);
|
||||||
|
--color-light-pine-highlight-high: hsl(315deg, 4%, 80%);
|
||||||
|
}
|
||||||
|
|
|
@ -4,4 +4,7 @@
|
||||||
let { children } = $props()
|
let { children } = $props()
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
{@render children()}
|
<div class="min-h-screen w-full bg-light-pine-base px-6 text-light-pine-text sm:px-20 md:px-40 lg:px-80 dark:bg-dark-pine-base dark:text-dark-pine-text">
|
||||||
|
iweojoijf
|
||||||
|
{@render children()}
|
||||||
|
</div>
|
||||||
|
|
|
@ -5,23 +5,23 @@
|
||||||
let room: Room = { id: "asd", coords: [0.123, 0.456], name: "scatolame party", private: true, range: 124 }
|
let room: Room = { id: "asd", coords: [0.123, 0.456], name: "scatolame party", private: true, range: 124 }
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="h-full w-full flex-row justify-center p-4">
|
<!-- <div class="h-full w-full flex-row justify-center p-4"> -->
|
||||||
<div class="relative min-h-screen justify-center justify-items-center">
|
<!-- <div class="relative min-h-screen justify-center justify-items-center"> -->
|
||||||
<h1>Scan your nearby rooms</h1>
|
<!-- <h1>Scan your nearby rooms</h1> -->
|
||||||
<img src="/smerdoradar.gif" alt="radar" class="h-64 w-64" />
|
<!-- <img src="/smerdoradar.gif" alt="radar" class="h-64 w-64" /> -->
|
||||||
<div class="max-h-50 w-full overflow-y-auto">
|
<!-- <div class="max-h-50 w-full overflow-y-auto"> -->
|
||||||
<RoomComponent {room} />
|
<!-- <RoomComponent {room} /> -->
|
||||||
<RoomComponent {room} />
|
<!-- <RoomComponent {room} /> -->
|
||||||
<RoomComponent {room} />
|
<!-- <RoomComponent {room} /> -->
|
||||||
<RoomComponent {room} />
|
<!-- <RoomComponent {room} /> -->
|
||||||
<RoomComponent {room} />
|
<!-- <RoomComponent {room} /> -->
|
||||||
<RoomComponent {room} />
|
<!-- <RoomComponent {room} /> -->
|
||||||
<RoomComponent {room} />
|
<!-- <RoomComponent {room} /> -->
|
||||||
<RoomComponent {room} />
|
<!-- <RoomComponent {room} /> -->
|
||||||
<RoomComponent {room} />
|
<!-- <RoomComponent {room} /> -->
|
||||||
</div>
|
<!-- </div> -->
|
||||||
<div class="fixed right-0 bottom-0">
|
<!-- <div class="fixed right-0 bottom-0"> -->
|
||||||
<button class="mt-4 justify-end rounded bg-blue-500 px-6 py-2 text-white transition-colors hover:bg-blue-600 active:bg-blue-700"> + </button>
|
<!-- <button class="mt-4 justify-end rounded bg-blue-500 px-6 py-2 text-white transition-colors hover:bg-blue-600 active:bg-blue-700"> + </button> -->
|
||||||
</div>
|
<!-- </div> -->
|
||||||
</div>
|
<!-- </div> -->
|
||||||
</div>
|
<!-- </div> -->
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue