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 {
|
||||
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()
|
||||
</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 }
|
||||
</script>
|
||||
|
||||
<div class="h-full w-full flex-row justify-center p-4">
|
||||
<div class="relative min-h-screen justify-center justify-items-center">
|
||||
<h1>Scan your nearby rooms</h1>
|
||||
<img src="/smerdoradar.gif" alt="radar" class="h-64 w-64" />
|
||||
<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} />
|
||||
</div>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="h-full w-full flex-row justify-center p-4"> -->
|
||||
<!-- <div class="relative min-h-screen justify-center justify-items-center"> -->
|
||||
<!-- <h1>Scan your nearby rooms</h1> -->
|
||||
<!-- <img src="/smerdoradar.gif" alt="radar" class="h-64 w-64" /> -->
|
||||
<!-- <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} /> -->
|
||||
<!-- </div> -->
|
||||
<!-- <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> -->
|
||||
<!-- </div> -->
|
||||
<!-- </div> -->
|
||||
<!-- </div> -->
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue