bobbert/peworkshop
1
0 Fork 0
mirror of https://github.com/mudabbir-ahmad/peworkshop.git synced 2026-10-07 19:50:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

fixed a bunch of styling and component usage

Browse Source 
made sure almost all viewer pages use the navbar component properly instead of using their hardcoded version, started to match the styling of the design for a lot of pages
This commit is contained in:
bobbert committed 2025-03-23 14:33:53 +00:00
1 parent ffdc2279ec
commit 8d0bca1d87
16 files changed
+280 -114
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

app/(main)/clue/[clueId]/page.js
+49 -51
View File
@@ -10,6 +10,8 @@ import {
import Link from "next/link";
import dynamic from "next/dynamic";
import { use } from "react";
// Add missing import for NavBar component
import NavBar from "@/components/NavBar";
// Dynamically import the QR scanner component with no SSR
const EnhancedQRScanner = dynamic(
@@ -731,25 +733,8 @@ export default function CluePage({ params }) {
</div>
</div>
{/* Bottom Navigation */}
<div className="nav-bar">
<Link href="/map" className="nav-item">
<div className="nav-icon">🗺️</div>
<div className="nav-label">Map</div>
</Link>
<Link href="/stats" className="nav-item">
<div className="nav-icon">📊</div>
<div className="nav-label">Stats</div>
</Link>
<Link href="/team-selection" className="nav-item">
<div className="nav-icon">👥</div>
<div className="nav-label">Team</div>
</Link>
<Link href="/leaderboard" className="nav-item">
<div className="nav-icon">🏆</div>
<div className="nav-label">Leaderboard</div>
</Link>
</div>
{/* Replace hardcoded navbar with NavBar component */}
<NavBar activeLink="clue" teamData={teamData?.team} />
<style jsx>{`
.clue-container {
@@ -1070,37 +1055,6 @@ export default function CluePage({ params }) {
padding-bottom: 10px;
}
.nav-bar {
display: flex;
justify-content: space-around;
background-color: white;
border-top: 1px solid #ddd;
padding: 10px 0;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
z-index: 10;
}
.nav-item {
display: flex;
flex-direction: column;
align-items: center;
text-decoration: none;
color: #666;
flex: 1;
}
.nav-icon {
font-size: 24px;
margin-bottom: 4px;
}
.nav-label {
font-size: 12px;
}
.admin-tools {
background-color: #f8d7da;
border: 2px dashed #d9534f;
@@ -1133,7 +1087,10 @@ export default function CluePage({ params }) {
/* Map Banner Styles */
.map-banner {
background-color: #68543c;
background-image: url("/images/Bottom-Bar.svg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
color: white;
padding: 15px;
display: flex;
@@ -1206,6 +1163,47 @@ export default function CluePage({ params }) {
font-family: monospace;
font-size: 1.1em;
}
.clue-page {
display: flex;
flex-direction: column;
min-height: 100vh;
background-color: #f4f4f4;
padding-bottom: 70px; /* Space for navbar */
}
.clue-banner {
background-image: url("/images/Bottom-Bar.svg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
color: white;
padding: 20px;
position: relative;
display: flex;
align-items: center;
}
.team-info {
flex: 1;
display: flex;
justify-content: space-between;
align-items: center;
}
.team-name {
margin: 0;
font-size: 24px;
font-weight: bold;
color: white;
}
.team-code {
font-size: 24px;
font-weight: bold;
margin-left: auto;
color: white;
}
`}</style>
</div>
);
app/(main)/leaderboard/page.js
+8 -2
View File
@@ -161,7 +161,10 @@ export default function LeaderboardPage() {
{/* Only show navigation bar when the hunt hasn't ended */}
{!huntJustEnded && (
<NavBar activeLink="leaderboard" teamData={{ id: session?.user?.teamId }} />
<NavBar
activeLink="leaderboard"
teamData={{ id: session?.user?.teamId }}
/>
)}
{/* Add a "back to home" button when the hunt has ended */}
@@ -186,7 +189,10 @@ export default function LeaderboardPage() {
}
.page-header {
background-color: #68543c;
background-image: url("/images/Bottom-Bar.svg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
color: white;
padding: 15px 20px;
display: flex;
app/(main)/map/map.module.css
+16 -8
View File
@@ -9,20 +9,22 @@
}
.map-banner {
background-color: #68543c;
background-image: url("/images/Bottom-Bar.svg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
color: white;
padding: 15px;
padding: 15px 20px;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 2px solid #4a3c2a;
z-index: 10;
flex-shrink: 0; /* Prevent banner from shrinking */
align-items: center;
position: relative;
}
.team-name {
font-size: 18px;
font-size: 1.1rem;
font-weight: bold;
color: white;
flex: 1;
text-align: left;
white-space: nowrap;
@@ -32,7 +34,12 @@
}
.elapsed-time {
position: absolute;
left: 50%;
transform: translateX(-50%);
text-align: center;
color: white;
font-weight: bold;
padding: 5px 10px;
background-color: rgba(0, 0, 0, 0.2);
border-radius: 8px;
@@ -46,8 +53,9 @@
}
.team-code {
font-size: 16px;
font-size: 1.1rem;
font-weight: bold;
color: white;
flex: 1;
text-align: right;
white-space: nowrap;
app/(main)/stats/page.js
+39 -3
View File
@@ -175,9 +175,12 @@ export default function StatsPage() {
return (
<div className={styles.container}>
<div className={styles.header}>
<h1 className={styles.title}>Team Stats</h1>
<h2 className={styles.teamName}>{teamStats.team.name}</h2>
{/* Replace header with team banner that matches team page */}
<div className="team-banner">
<div className="team-info">
<h1 className="team-name">Team Name: {teamStats.team.name}</h1>
<div className="team-code">{teamStats.team.code}</div>
</div>
</div>
<div className={styles.statsCard}>
@@ -232,6 +235,39 @@ export default function StatsPage() {
<NavBar activeLink="stats" teamData={teamStats.team} />
<style jsx>{`
.team-banner {
background-image: url("/images/Bottom-Bar.svg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
color: white;
padding: 20px;
position: relative;
display: flex;
align-items: center;
}
.team-info {
flex: 1;
display: flex;
justify-content: space-between;
align-items: center;
}
.team-name {
margin: 0;
font-size: 24px;
font-weight: bold;
color: white;
}
.team-code {
font-size: 24px;
font-weight: bold;
margin-left: auto;
color: white;
}
.clues-section {
padding: 10px 15px;
}
app/(main)/stats/stats.module.css
+10 -10
View File
@@ -3,34 +3,34 @@
flex-direction: column;
min-height: 100vh;
background-color: #f4f4f4;
padding-bottom: 70px; /* Space for the navbar */
padding-bottom: 70px; /* Space for navbar */
}
/* Remove the header styles since we're using a custom banner */
/*
.header {
background-color: #68543c;
color: white;
padding: 20px;
padding: 1rem;
text-align: center;
}
.title {
margin: 0;
font-size: 1.5rem;
margin: 0 0 5px 0;
color: white;
}
.teamName {
font-size: 1.2rem;
margin: 0;
font-weight: normal;
color: white;
font-size: 1.25rem;
margin: 0.5rem 0 0;
}
*/
.statsCard {
background-color: white;
border-radius: 8px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
margin: 20px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
margin: 1rem;
overflow: hidden;
}
app/(main)/team/[teamId]/page.js
+45 -16
View File
@@ -219,23 +219,25 @@ export default function TeamPage({ params }) {
<div className="members-container">
<h2 className="members-title">Team Members</h2>
{teamMembers.length > 0 ? (
<div className="members-list">
{teamMembers.map((member) => (
<div key={member.id} className="member-card">
<div className="member-avatar">👤</div>
<div className="member-details">
<div className="member-name">
{member.username}
{member.id === session?.user?.id && " (You)"}
<div className="members-background">
{teamMembers.length > 0 ? (
<div className="members-list">
{teamMembers.map((member) => (
<div key={member.id} className="member-card">
<div className="member-avatar">👤</div>
<div className="member-details">
<div className="member-name">
{member.username}
{member.id === session?.user?.id && " (You)"}
</div>
</div>
</div>
</div>
))}
</div>
) : (
<div className="empty-state">No team members found</div>
)}
))}
</div>
) : (
<div className="empty-state">No team members found</div>
)}
</div>
</div>
<div className="team-actions">
@@ -404,7 +406,10 @@ export default function TeamPage({ params }) {
}
.team-banner {
background-color: #68543c;
background-image: url("/images/Bottom-Bar.svg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
color: white;
padding: 20px;
position: relative;
@@ -423,12 +428,14 @@ export default function TeamPage({ params }) {
margin: 0;
font-size: 24px;
font-weight: bold;
color: white;
}
.team-code {
font-size: 24px;
font-weight: bold;
margin-left: auto;
color: white;
}
.members-container {
@@ -444,10 +451,26 @@ export default function TeamPage({ params }) {
color: #333;
}
/* New background div that holds the scroll background image */
.members-background {
position: relative;
background-image: url("/images/scroll.svg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
padding: 30px 20px;
display: flex;
flex-direction: column;
align-items: center;
min-height: 300px;
}
.members-list {
display: flex;
flex-direction: column;
gap: 10px;
width: 100%;
align-items: center;
}
.member-card {
@@ -457,6 +480,8 @@ export default function TeamPage({ params }) {
display: flex;
align-items: center;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
width: 80vw;
max-width: 500px;
}
.member-avatar {
@@ -472,6 +497,10 @@ export default function TeamPage({ params }) {
text-align: center;
padding: 30px;
color: #888;
width: 80vw;
max-width: 500px;
background-color: rgba(255, 255, 255, 0.7);
border-radius: 8px;
}
.team-actions {
app/globals.css
+29
View File
@@ -150,11 +150,40 @@ p {
max-width: 25%;
}
.leaderboard-item,
.icon-container {
display: flex;
justify-content: center;
align-items: center;
}
.icon-image {
margin-top: 0; /* Remove top margin to center vertically */
display: flex;
align-items: center;
justify-content: center;
}
.leaderboard-icon {
display: flex;
justify-content: center;
align-items: center;
}
.nav-item.active {
color: #68543c;
font-weight: bold;
}
.inverted-icon {
filter: invert(100%);
}
.active-icon {
filter: invert(36%) sepia(12%) saturate(1161%) hue-rotate(355deg)
brightness(90%) contrast(89%);
}
.nav-icon {
font-size: 1.5rem;
margin-bottom: 4px;
clue_hunt.db
BIN
View File
Binary file not shown.
components/NavBar.js
+35 -7
View File
@@ -2,6 +2,7 @@
import { useState, useEffect } from "react";
import Link from "next/link";
import { useRouter } from "next/navigation";
import Image from "next/image";
import styles from "@/app/(main)/map/map.module.css";
export default function NavBar({ activeLink, teamData }) {
@@ -50,8 +51,17 @@ export default function NavBar({ activeLink, teamData }) {
className={`nav-item ${activeLink === "map" ? "active" : ""}`}
onClick={handleMapClick}
>
<div className="nav-icon">🗺️</div>
<div className="nav-label">Map</div>
<div className="nav-icon icon-container">
<Image
src="/images/home.svg"
alt="Map"
width={40}
height={40}
className={`icon-image ${
activeLink === "map" ? "inverted-icon" : ""
}`}
/>
</div>
</Link>
<Link
@@ -66,16 +76,34 @@ export default function NavBar({ activeLink, teamData }) {
href={teamData?.id ? `/${teamData.id}` : "/team-selection"}
className={`nav-item ${activeLink === "team" ? "active" : ""}`}
>
<div className="nav-icon">👥</div>
<div className="nav-label">Team</div>
<div className="nav-icon icon-container">
<Image
src="/images/profile.svg"
alt="Team"
width={40}
height={40}
className={`icon-image ${
activeLink === "team" ? "inverted-icon" : ""
}`}
/>
</div>
</Link>
<Link
href="/leaderboard"
className={`nav-item ${activeLink === "leaderboard" ? "active" : ""}`}
className={`nav-item leaderboard-item ${
activeLink === "leaderboard" ? "active" : ""
}`}
>
<div className="nav-icon">🏆</div>
<div className="nav-label">Leaderboard</div>
<div className="nav-icon leaderboard-icon">
<Image
src="/images/leaderboard.svg"
alt="Leaderboard"
width={32}
height={32}
className={activeLink === "leaderboard" ? "inverted-icon" : ""}
/>
</div>
</Link>
</nav>
);
public/images/Waves.svg
+9
View File
@@ -0,0 +1,9 @@
<svg width="402" height="217" viewBox="0 0 402 217" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<rect x="-43" width="715" height="217" fill="url(#pattern0_56_90)"/>
<defs>
<pattern id="pattern0_56_90" patternContentUnits="objectBoundingBox" width="1" height="1">
<use xlink:href="#image0_56_90" transform="matrix(0.000520833 0 0 0.00171611 0 -0.000246016)"/>
</pattern>
<image id="image0_56_90" width="1920" height="583" preserveAspectRatio="none" xlink:href="data:image/png;base64,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 truncated
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 217 KiB

public/images/barrel-crop.svg
+14
View File
@@ -0,0 +1,14 @@
<svg width="148" height="197" viewBox="0 0 148 197" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<mask id="mask0_302_130" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="148" height="197">
<rect width="148" height="197" fill="#D9D9D9"/>
</mask>
<g mask="url(#mask0_302_130)">
<rect x="-23" y="-14" width="225" height="225" fill="url(#pattern0_302_130)"/>
</g>
<defs>
<pattern id="pattern0_302_130" patternContentUnits="objectBoundingBox" width="1" height="1">
<use xlink:href="#image0_302_130" transform="scale(0.00195312)"/>
</pattern>
<image id="image0_302_130" width="512" height="512" preserveAspectRatio="none" xlink:href="data:image/png;base64,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 truncated
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 49 KiB

public/images/cannon ball.svg
+14
View File
@@ -0,0 +1,14 @@
<svg width="133" height="176" viewBox="0 0 133 176" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<mask id="mask0_302_122" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="133" height="176">
<path d="M0 0H133V176H0V0Z" fill="#D9D9D9"/>
</mask>
<g mask="url(#mask0_302_122)">
<rect x="-62" y="-9" width="195" height="195" fill="url(#pattern0_302_122)"/>
</g>
<defs>
<pattern id="pattern0_302_122" patternContentUnits="objectBoundingBox" width="1" height="1">
<use xlink:href="#image0_302_122" transform="scale(0.00195312)"/>
</pattern>
<image id="image0_302_122" width="512" height="512" preserveAspectRatio="none" xlink:href="data:image/png;base64,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 truncated
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 65 KiB

public/images/fallback-map.jpg
-1
View File
@@ -1 +0,0 @@
// This would be a new image file you need to add to your project
public/images/home.svg
+2 -8
View File
@@ -1,9 +1,3 @@
<svg width="43" height="42" viewBox="0 0 43 42" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<rect width="42.9618" height="42" fill="url(#pattern0_217_89)"/>
<defs>
<pattern id="pattern0_217_89" patternContentUnits="objectBoundingBox" width="1" height="1">
<use xlink:href="#image0_217_89" transform="matrix(0.01 0 0 0.010229 0 -0.0114504)"/>
</pattern>
<image id="image0_217_89" width="100" height="100" preserveAspectRatio="none" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAAXNSR0IArs4c6QAABbVJREFUeAHtnFvofFMUxz8uud8iRJSQEg+IkpKk3EkppVBKXj16k0flyZOkPFBKKUqRFCXlUpI8yIP7JYTc77fZf7Nyfud39l77t9eZ9TszZ52a1sxea+313d/vnj37nJkzEEcwEAxsNgOXAa8tH+l5HLvEwF7AncBfwD/Lx9/APcDeu4RptmUPA57oCCGCiH0aOHK27DgP/Czg3YIYIsqHwHnO2GZX7ibgpwoxRJRfgNtmx5LDgPcH7tuBECKI2IeBAx1wzqLECcDLBjFElNeBk2bB2AoHeRHw+QhiiChfAZeuEO/Gdp22tHcAf4wohojy54K1uyu2xhJfazdWjEOBx1cgRJ/Yp4AjCiz247XXha7W13Um8I6DGEJuqpVqDh139U46JSdnh/pY67YbgR8dxRBi09b41gxzFwNfVGLKdLF+zfsuL3cIQbtlHwD2G6DvROCVClEGUtev6Rjg+YrBeon0EnD8AI0150EDaevVdCHw2YTEENG/BC7JUHlL4UpBJmU9mm8Hfp+gGCJK2m6nK8lp+90/zgbeG8Dej1uL14cAjw0MRoiYmn0SOHyA2aOAZ3rjGAibdtNpwFu9QUxNgCE8aWt8xgC1/e9jBkKm23Qt8O0aiiEC/QDckKH3SuCbjG9yzWlLey+QvsmTwa2rTWNIY0lj6h+n9Bum+Ppo4LkNEKI/gV4Ejpsi4SVM5wIfbKAYIs6nwAUlAqbkS1va3zZYDBFFtsZT4n4LlgOAh2YghAgi9tHFZ8vBW5iYwItTgTdnKIaI8vbi/Or0CeiwB8LVy22fgJur/X5xnnX9borSPzGaqxDdccsP9fbxFiZdOnh2xktUV4Sh5y8Ax3qJck7m4toQsDm3fQycv2pR0uXnn+OdUX3V4dfljzVG1yVtaR8MIaqF6K8MjwAHjaVK+grz1RCjWQwR5w3gZKsoVwBfhxhmMUSU74DrWkSJLe3qrk7L1rj6Hhbt3gtRO6xNtKp7WGrvvQgxbGIIf8V7WK6JLe1onxVCeI1NpxGJ+23HJwMf3jU/EKspGjH/v6OGOE0nkduO1Ngl7n4g/UCs2xbP7XwkThO3XS7T0rXtuGpx+1d6l7y/uIfv5o63mxjPtxLZwodQmzhO3zwmMS6XxhrbUjRy8sLVcF6MCXLz5LZwUyS7xtlSNHLyItZwXowJcvPktnBTJLvG2VI0cvIi1nBejAly8+S2cFMku8bZUjRy8iLWcF6MCXLz5LZwUyS7xtlSNHLyItZwXowJcvPktnBTJLvG2VI0cvIi1nBejAly8+S2cFMku8bZUjRy8iLWcF6MCXLz5LZwUyS7xtlSNHLyItZwXowJcvPktnBTJLvG2VJ0jJwabJaYMTC29GHBvCe3pegYOWbgSgdjYGzpQ4Glu1uKjpGjI7NFjIGxpQ8b6t6X8S0AWnPMwJUOWnFZ8xRYutsKoDVfR2aLaMVlzbOhjnfIlp/rWMVI+eZjDBAtfZiBKx20YBojR4Glu8cA0dKHjswW0YJpjBwb6liyYsmSWWieSUoHUsfbKrB0tzdgqacjs0VIHW9rQx1LVixZMmPNM0npQOp4WwWW7vYGLPV0ZLYIqeNtbahjyYolS2aseSYpHUgdb6vA0t3egKWejswWIXW8rQ11LFmxZMmMNc8kpQOp420VWLrbG7DU05HZIqSOt7WhjiUrliyZseaZpHQgdbytAkt3ewOWejoyW4TU8bY21LFkxZIlM9Y8k5QOpI63VWDpbm/AUk9HZouQOt7WhjqWrFiyZMaaZ5LSgdTxtgos3e0NWOrpyGwRUsfb2lDHkhVLlsxY80xSOpA63laBpbu9AUs9HZktQup4WxvqWLJiyZIZa55JSgdSx9sqsHR3/78YvQagI7NFeI2jW+cjG+T/stPfjaeOuh17PB8De6kPjzF0ayQOd/TfiiXw4QsGgoFgIBgIBoKBYCAY2AkD/wIbcQPPmO8aMAAAAABJRU5ErkJggg=="/>
</defs>
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24">
<path d="M240-200h120v-240h240v240h120v-360L480-740 240-560v360Zm-80 80v-480l320-240 320 240v480H520v-240h-80v240H160Zm320-350Z" fill="#333333"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 244 B

public/images/profile.svg
+2 -8
View File
@@ -1,9 +1,3 @@
<svg width="59" height="57" viewBox="0 0 59 57" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<rect width="58.3053" height="57" fill="url(#pattern0_217_92)"/>
<defs>
<pattern id="pattern0_217_92" patternContentUnits="objectBoundingBox" width="1" height="1">
<use xlink:href="#image0_217_92" transform="matrix(0.01 0 0 0.010229 0 -0.0114504)"/>
</pattern>
<image id="image0_217_92" width="100" height="100" preserveAspectRatio="none" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAAXNSR0IArs4c6QAABA1JREFUeAHtnE3I1EYchx+tH8UqfoCCh1o/oIoV7UGxKLSgvXjpyQoKoggqCFoUvOhJL9KrICJ6kKIiSmnVQ0Gpii0UReypolhRVPw4aKUHvwrV/WmGF8Our9nNZmd3fn8I2ewm2ZnnySSZyWTAYQImYAImYAImYAImYAImYAImYAImYAImYAImYAImYAImYAImYAImYAImYAImYAImYAImYAImYAImYAImYAImYALlEBgEjM4mfXZUSGAAMB/YDvwK3ANe5qa72W/bgHmAtnGUTGA4sAm4noOfl1FvWdtsBD4qOU1J7k5H9wrgQRMi8nLu14Qud4lp/jgaCRwtQURezHFgTPPJSnPLicDVNsgIcnQam5Im2uK5/gS400YZQcptYELx5KW1hU5TVyqQEaRcBkakhbhYbo9UKCNIOVQsiemsvbgDMoKUb9LB/H45HQLc7KAQXeQHv19S01hrVQdlhFKi+o4jI3AhAiF/2MYbAp9GICOUksmWAusiErLWQuBAREJ+sBC4GJGQ8xZS/5lGOKdXPVeTTfLxb0QlRGlJPh5HJORR8jaAWxEJUWtB8nEuIiFnkrcB7I5IyC4LgaURCVliITAWeBGBlOd+1t53OB6LQMhPfcnxp4URCPnSGt4m0Mm7LfWCdOQIzAT+60BJ0fXrs1xavJgR2NIBIZtNvzGBgcCPFUpRLxd3xm7s4/UvH9Z6uJ+qQMpJYGg/afHPGQGBOtxGKeqLpZ4ujgIEdCr5DnhaopgnwPoCafCqdQioU7Qqjv+3IEbbquLnTgx1ADf71efAPqDI85N/gL01GbOa/VNv1z8BXV++qtVZtgIHgd+AP7NJn/WdflPN29eJ/nl6DRMwARMwARMwARMwgagIjMpudzdk9RFVFs9mt7s3au+za9Ltr777Oat/qFau21+9u+hokYDGLdGTxJ3A3y3U0kN31GvZvhYAHhOlgJw5wP5am9PDEiQEGfm59q3/mF0gXUmtqucgXwMn2ighLyUs/w58C3yQFPF3ZFanpb86ICIICXOlQWlJNsbXWl/1gkwrrbgBZplzldLkRnhYUxtuKabXEPJClbbVKRQVPZ5Vc3geQKzLKsHDelXMx4BeGYsVfqN0XQIm9ZqUaYCG3muU6di/1wBqM3pFSrfLCAdLT0jpFRk9IWVcRQORBVhVzTXwmfLWVaFarzqiVQWp6v853W3tYd/3sIwgf0e3FJFFEda+A8Qy52phUF6jDnW7aedoomUCLWNfGvhMld1oY1kCp6q8yJXR2gB+SVCInlBGGXqmEXODYf7ILmv5WayvNahTdFmZ7Lb9TI+xiMxNWMgXMQqZmrAQjRsZZexJUIryHHXo9WaNUq2OA708KY/Kq8METMAETMAEoiDwCl6HggQTMLsEAAAAAElFTkSuQmCC"/>
</defs>
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24">
<path d="M480-480q-66 0-113-47t-47-113q0-66 47-113t113-47q66 0 113 47t47 113q0 66-47 113t-113 47ZM160-160v-112q0-34 17.5-62.5T224-378q62-31 126-46.5T480-440q66 0 130 15.5T736-378q29 15 46.5 43.5T800-272v112H160Zm80-80h480v-32q0-11-5.5-20T700-306q-54-27-109-40.5T480-360q-56 0-111 13.5T260-306q-9 5-14.5 14t-5.5 20v32Zm240-320q33 0 56.5-23.5T560-640q0-33-23.5-56.5T480-720q-33 0-56.5 23.5T400-640q0 33 23.5 56.5T480-560Zm0-80Zm0 400Z" fill="#333333"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.0 KiB

After

Width:  |  Height:  |  Size: 549 B

public/images/scroll.svg
+8
View File
@@ -0,0 +1,8 @@
<svg width="361" height="700" viewBox="0 0 361 700" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1.5" y="41.6399" width="358" height="656.86" rx="8.5" fill="#D6BC69" stroke="black" stroke-width="3"/>
<rect x="47.7563" y="1.5" width="265.487" height="38.409" rx="8.5" fill="#D8B955" stroke="black" stroke-width="3"/>
<path d="M47.7699 22.8464C47.7699 23.3572 47.7707 23.8539 47.7715 24.3372C47.7757 26.9995 47.7793 29.2527 47.646 31.1909C47.4882 33.4854 47.1464 35.1427 46.5067 36.361C45.3576 38.5493 42.8985 39.909 36.1248 39.909C33.9384 39.909 31.6716 38.3572 29.8675 35.2237C28.0866 32.1306 26.9373 27.7578 26.9373 22.8464C26.9373 17.935 28.0866 13.5622 29.8675 10.469C31.6716 7.33554 33.9384 5.78369 36.1248 5.78369C42.3029 5.78369 44.8422 7.1153 46.1306 9.37682C46.834 10.6116 47.2634 12.2811 47.5003 14.5544C47.7366 16.8221 47.7699 19.5509 47.7699 22.8464Z" fill="#888585" stroke="black" stroke-width="3"/>
<path d="M26.9141 22.8462C26.9141 23.2564 26.9147 23.6548 26.9153 24.0419C26.9188 26.1725 26.9216 27.9615 26.8142 29.4997C26.687 31.3213 26.4131 32.5937 25.9244 33.51C25.0749 35.1029 23.2318 36.1964 17.7337 36.1964C16.0889 36.1964 14.3244 35.0456 12.8883 32.5897C11.4734 30.17 10.55 26.7285 10.55 22.8462C10.55 18.9639 11.4734 15.5225 12.8883 13.1028C14.3244 10.6469 16.0889 9.49609 17.7337 9.49609C22.7363 9.49609 24.66 10.5617 25.624 12.2278C26.164 13.1611 26.5063 14.4461 26.6968 16.2461C26.8867 18.0412 26.9141 20.208 26.9141 22.8462Z" fill="#888585" stroke="black" stroke-width="3"/>
<path d="M313.23 21.4184C313.23 21.9292 313.229 22.426 313.229 22.9093C313.224 25.5716 313.221 27.8248 313.354 29.763C313.512 32.0575 313.854 33.7148 314.493 34.9331C315.642 37.1214 318.102 38.4811 324.875 38.4811C327.062 38.4811 329.328 36.9293 331.132 33.7958C332.913 30.7026 334.063 26.3298 334.063 21.4184C334.063 16.5071 332.913 12.1342 331.132 9.0411C329.328 5.90763 327.062 4.35577 324.875 4.35577C318.697 4.35577 316.158 5.68738 314.869 7.9489C314.166 9.18372 313.737 10.8532 313.5 13.1264C313.263 15.3942 313.23 18.1229 313.23 21.4184Z" fill="#888585" stroke="black" stroke-width="3"/>
<path d="M334.086 21.4184C334.086 21.8286 334.085 22.2269 334.085 22.614C334.081 24.7447 334.078 26.5336 334.186 28.0718C334.313 29.8935 334.587 31.1659 335.075 32.0821C335.925 33.6751 337.768 34.7685 343.266 34.7685C344.911 34.7685 346.675 33.6177 348.112 31.1618C349.527 28.7421 350.45 25.3007 350.45 21.4184C350.45 17.5361 349.527 14.0946 348.112 11.6749C346.675 9.21903 344.911 8.06824 343.266 8.06824C338.264 8.06824 336.34 9.1338 335.376 10.7999C334.836 11.7332 334.494 13.0182 334.303 14.8183C334.113 16.6134 334.086 18.7802 334.086 21.4184Z" fill="#888585" stroke="black" stroke-width="3"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.7 KiB