diff --git a/src/lib/assets/images/hackClubLogo.svg b/src/lib/assets/images/hackClubLogo.svg deleted file mode 100644 index 38c2a68..0000000 --- a/src/lib/assets/images/hackClubLogo.svg +++ /dev/null @@ -1,66 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/src/lib/components/Navbar.svelte b/src/lib/components/Navbar.svelte index 7bbe622..20898f2 100644 --- a/src/lib/components/Navbar.svelte +++ b/src/lib/components/Navbar.svelte @@ -1,5 +1,5 @@ @@ -21,72 +25,74 @@
-

USER is looking for a sticker that you own! Are you open to trade?

- - {#snippet topContent()} -
Trade
- {/snippet} - {#snippet backContent()} -
- {/snippet} - {#snippet bottomContent()} -
- {/snippet} - -
+

+ USER is looking for a sticker that own! Are you open to trade? +

+ + {#snippet topContent()} +
Trade
+ {/snippet} + {#snippet backContent()} +
+ {/snippet} + {#snippet bottomContent()} +
+ {/snippet} + +
-
-

STICKER is X% cheaper this week

- - {#snippet topContent()} -
Shop
- {/snippet} - {#snippet backContent()} -
- {/snippet} - {#snippet bottomContent()} -
- {/snippet} - -
+
+

STICKER is X% cheaper this week

+ + {#snippet topContent()} +
Shop
+ {/snippet} + {#snippet backContent()} +
+ {/snippet} + {#snippet bottomContent()} +
+ {/snippet} + +
-
-

New sticker drop! Vote on the best option now!

- - {#snippet topContent()} -
Vote
- {/snippet} - {#snippet backContent()} -
- {/snippet} - {#snippet bottomContent()} -
- {/snippet} - +
+

New sticker drop! Vote on the best option now!

+ + {#snippet topContent()} +
Vote
+ {/snippet} + {#snippet backContent()} +
+ {/snippet} + {#snippet bottomContent()} +
+ {/snippet} +
@@ -97,13 +103,13 @@

Your collection

- +
- No stickers placed!
X stickers owned. + No stickers placed!
X stickers owned.
@@ -115,18 +121,28 @@ gap: 2rem; height: calc(100vh - 120px); overflow: hidden; + width: 100%; + box-sizing: border-box; } .left-column { - flex: 0 0 500px; - min-width: 500px; - overflow-y: auto; + flex: 0 0 350px; + overflow: hidden; padding-bottom: 2rem; + display: flex; + flex-direction: column; } .cards { display: flex; flex-direction: column; + overflow-x: hidden; + overflow-y: auto; + flex: 1; + padding: 1rem; + border: 2px solid #333; + border-radius: 0.5rem; + background: rgba(255, 255, 255, 0.3); } .divider { @@ -137,11 +153,12 @@ } .right-column { - flex: 1; + flex: 1 1 auto; display: flex; flex-direction: column; min-width: 0; padding-bottom: 2rem; + overflow: hidden; } .canvas { @@ -200,37 +217,41 @@ p { font-size: 1.5rem; margin: 0 0 1rem 0; + font-family: 'Departure Mono', monospace; } :global(.btn-sticker) { width: 180px; height: 50px; cursor: pointer; + font-family: 'Departure Mono', monospace; + } .sticker-btn { width: 100%; height: 100%; - background: #444444; + background:#8bb1e3; border-radius: 0.5rem; display: flex; align-items: center; justify-content: center; color: white; font-size: 1rem; + font-size: 1.4rem; } .sticker-back { width: 100%; height: 100%; - background: #d9c9b6; + background: #729abd; border-radius: 0.5rem; } .sticker-surface { width: 100%; height: 100%; - background: #d1a874; + background: #d9c9b6; border-radius: 0.5rem; } @@ -239,7 +260,7 @@ padding: 0 0.2rem; } - @media (max-width: 900px) { + @media (max-width: 1400px) { .layout { flex-direction: column; height: auto; @@ -250,11 +271,13 @@ flex: 0 0 auto; min-width: 0; max-width: 100%; - overflow-y: visible; + overflow: visible; } .right-column { padding-bottom: 2rem; + max-width: 100%; + min-width: 0; } .divider { diff --git a/src/routes/designs/+layout.svelte b/src/routes/designs/+layout.svelte index 6217731..8043972 100644 --- a/src/routes/designs/+layout.svelte +++ b/src/routes/designs/+layout.svelte @@ -18,10 +18,20 @@
{@render children()}
+ diff --git a/src/routes/earn/+layout.svelte b/src/routes/earn/+layout.svelte index cf844ad..a38516c 100644 --- a/src/routes/earn/+layout.svelte +++ b/src/routes/earn/+layout.svelte @@ -18,10 +18,20 @@
{@render children()}
+ diff --git a/src/routes/leaderboard/+layout.svelte b/src/routes/leaderboard/+layout.svelte index 64968a3..6e7d8fe 100644 --- a/src/routes/leaderboard/+layout.svelte +++ b/src/routes/leaderboard/+layout.svelte @@ -18,10 +18,20 @@
{@render children()}
+ diff --git a/src/routes/leaderboard/+page.svelte b/src/routes/leaderboard/+page.svelte index 98af8dd..ab5b8b1 100644 --- a/src/routes/leaderboard/+page.svelte +++ b/src/routes/leaderboard/+page.svelte @@ -7,11 +7,7 @@ { rank: 3, username: 'LFD', totalStickers: 28, uniques: 18, rares: 3 }, { rank: 4, username: 'Nora', totalStickers: 19, uniques: 15, rares: 3 }, { rank: 5, username: 'Euan', totalStickers: 17, uniques: 16, rares: 3 }, - { rank: 6, username: 'KittyCat', totalStickers: 15, uniques: 10, rares: 3 }, - { rank: 7, username: 'AVD', totalStickers: 14, uniques: 14, rares: 2 }, - { rank: 8, username: 'Neon', totalStickers: 12, uniques: 6, rares: 0 }, - { rank: 9, username: 'Kartikey', totalStickers: 11, uniques: 10, rares: 0 }, - { rank: 10, username: 'Jmeow', totalStickers: 9, uniques: 9, rares: 1 }, + { rank: 1192, username: 'You', totalStickers: 2, uniques: 2, rares: 0 } ]; @@ -104,7 +100,7 @@ .content-row { display: flex; gap: 1.5rem; - flex-wrap: nowrap; + flex-wrap: wrap; align-items: stretch; } @@ -116,11 +112,12 @@ } .info-card { - flex: 1; + flex: 1 1 300px; } .filter-card { display: flex; + flex-direction: row; align-items: center; gap: 0.75rem; flex: 0 0 auto; @@ -144,7 +141,12 @@ p { font-size: 1.5rem; margin: 0; - white-space: nowrap; + } + + @media (max-width: 768px) { + .content-row { + flex-direction: column; + } } mark { diff --git a/src/routes/my-designs/+layout.svelte b/src/routes/my-designs/+layout.svelte index cb72f87..299e93a 100644 --- a/src/routes/my-designs/+layout.svelte +++ b/src/routes/my-designs/+layout.svelte @@ -18,10 +18,20 @@
{@render children()}
+ diff --git a/src/routes/stickers/+layout.svelte b/src/routes/stickers/+layout.svelte index 082a6c3..4fadf71 100644 --- a/src/routes/stickers/+layout.svelte +++ b/src/routes/stickers/+layout.svelte @@ -21,7 +21,13 @@ diff --git a/src/routes/trade/+layout.svelte b/src/routes/trade/+layout.svelte index 9fc25bb..01c9873 100644 --- a/src/routes/trade/+layout.svelte +++ b/src/routes/trade/+layout.svelte @@ -18,10 +18,22 @@
{@render children()}
+ diff --git a/src/routes/trade/+page.svelte b/src/routes/trade/+page.svelte index 47ad120..f354449 100644 --- a/src/routes/trade/+page.svelte +++ b/src/routes/trade/+page.svelte @@ -20,78 +20,31 @@ function openMakeDeal() { showModal = true; + showModal() } function closeModal() { showModal = false; } + +if (showModal) { + document.body.style.overflow = 'hidden'; + alert('test'); + +} else { + document.body.style.overflow = 'auto'; +}

Trade

- +

Incoming Trades

- {#each mockTrades as trade} -
-
-
- {trade.give.name} -
×{trade.give.quantity}
-
-
- {trade.get.name} -
×{trade.get.quantity}
-
-
-
-
- {trade.from} -
-

{trade.message}

- -
-
- {/each}
-{#if showModal} -
-
e.stopPropagation()}> -

Propose a Trade

-
-
- - - -
-
⇄
-
- - - -
-
-
- - -
-
-
-{/if} - diff --git a/src/routes/vote/+layout.svelte b/src/routes/vote/+layout.svelte index 49b1ae8..63de921 100644 --- a/src/routes/vote/+layout.svelte +++ b/src/routes/vote/+layout.svelte @@ -18,10 +18,20 @@
{@render children()}
+