Skip to content

Commit

Permalink
leaderboards
Browse files Browse the repository at this point in the history
  • Loading branch information
@devsisingh
devsisingh committed Jun 17, 2024
1 parent 452d45e commit 4ddf891
Show file tree
Hide file tree
Showing 10 changed files with 446 additions and 34 deletions.
3 changes: 2 additions & 1 deletion next.config.mjs
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
/** @type {import('next').NextConfig} */
const nextConfig = {};
const nextConfig = {
};

export default nextConfig;
Binary file added public/bronze.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/f41.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/f43.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/gold.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/silver.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 10 additions & 0 deletions src/app/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@ import Image from "next/image";
import MostLoved from "../components/mostLoved";
import MostRecently from "../components/mostRecently";
import LeaderBoard from "../components/leaderboard";
import HotNFTs from "../components/hotNFTs";
import Brand from "../components/brand";

export default function Home() {
const exploreButtonStyle = {
Expand Down Expand Up @@ -230,6 +232,14 @@ export default function Home() {
<LeaderBoard />
</div>

<div className="pt-40 bg-white px-10">
<HotNFTs />
</div>

<div className="pt-40 bg-white px-10">
<Brand />
</div>

</div>
);
}
192 changes: 192 additions & 0 deletions src/components/brand.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,192 @@
import React from "react";

const brand = () => {
return (
<div>
<div className="font-bold text-black text-6xl px-10">
Brand Champions{" "}
</div>
<div
className="flex justify-between text-2xl px-10"
style={{ justifyContent: "space-between" }}
>
<div className="mt-4">
Pushing the Boundaries of Innovation.
</div>
<button className="border py-3 px-10">View All</button>
</div>

<div className="flex px-10" style={{justifyContent: 'center', marginTop:'200px', marginBottom:'200px'}}>
<div className="flex flex-col justify-center items-center">
<img
src="/image 7.png"
style={{
width: "60%",
display: "block",
marginLeft: "auto",
marginRight: "auto",
}}
/>
<div style={{ position: 'relative' }}>
<img
src="/silver.png"
style={{
width: "60%",
display: "block",
marginLeft: "auto",
marginRight: "auto",
}}
/>
<div style={{
position: 'absolute', // Positioning the text absolutely within its container
top: '35%', // Aligning text to the center vertically
left: '50%', // Aligning text to the center horizontally
transform: 'translate(-50%, -50%)', // Centering the text precisely
textAlign: 'center', // Centering text within its container
fontSize: '24px', // Font size
fontWeight: 'bold', // Font weight
}}>
SILVER
</div>
</div>
<div
style={{
display: "flex",
justifyContent: "center",
marginTop: "10px",
marginBottom: "20px",
}}
>
No. tokens
</div>

<button
className="text-2xl text-center"
style={{
border: "2px solid black", // Adds a solid black border
padding: "0.5rem 2.5rem", // Vertical padding: 8px, Horizontal padding: 40px
borderRadius: "17px", // Fully rounded corners
cursor: "pointer", // Pointer cursor on hover
marginLeft: "auto", // Auto margin left
marginRight: "auto", // Auto margin right
}}
>
WebXR
</button>
</div>



<div className="flex flex-col justify-center items-center" style={{marginTop:'-200px'}}>
<img
src="/f41.png"
style={{
width: "60%",
display: "block",
marginLeft: "auto",
marginRight: "auto",
}}
/>
<div style={{ position: 'relative' }}>
<img
src="/gold.png"
style={{
width: "60%",
display: "block",
marginLeft: "auto",
marginRight: "auto",
}}
/>
<div style={{
position: 'absolute', // Positioning the text absolutely within its container
top: '35%', // Aligning text to the center vertically
left: '50%', // Aligning text to the center horizontally
transform: 'translate(-50%, -50%)', // Centering the text precisely
textAlign: 'center', // Centering text within its container
fontSize: '24px', // Font size
fontWeight: 'bold', // Font weight
}}>
GOLD
</div>
</div>
<div
style={{
display: "flex",
justifyContent: "center",
marginTop: "10px",
marginBottom: "20px",
}}
>
No. tokens
</div>

<button
className="text-2xl text-center"
style={{
border: "2px solid black", // Adds a solid black border
padding: "0.5rem 2.5rem", // Vertical padding: 8px, Horizontal padding: 40px
borderRadius: "17px", // Fully rounded corners
cursor: "pointer", // Pointer cursor on hover
marginLeft: "auto", // Auto margin left
marginRight: "auto", // Auto margin right
}}
>
WebXR
</button>
</div>




<div className="flex flex-col justify-center items-center">
<img
src="/f43.png"
style={{
width: "60%",
display: "block",
marginLeft: "auto",
marginRight: "auto",
}}
/>
<img
src="/bronze.png"
style={{
width: "60%",
display: "block",
marginLeft: "auto",
marginRight: "auto",
}}
/>
<div
style={{
display: "flex",
justifyContent: "center",
marginTop: "10px",
marginBottom: "20px",
}}
>
No. tokens
</div>

<button
className="text-2xl text-center"
style={{
border: "2px solid black", // Adds a solid black border
padding: "0.5rem 2.5rem", // Vertical padding: 8px, Horizontal padding: 40px
borderRadius: "17px", // Fully rounded corners
cursor: "pointer", // Pointer cursor on hover
marginLeft: "auto", // Auto margin left
marginRight: "auto", // Auto margin right
}}
>
WebXR
</button>
</div>


</div>
</div>
);
};

export default brand;
38 changes: 38 additions & 0 deletions src/components/hotNFTs.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
import React from "react";
import MostRecentlyCard from "./mostRecentlyCard";

const hotNFTs = () => {
return (
<div>
<div className="font-semibold" style={{ color: "#DF1FDD" }}>
Most Loved NFTs Now
</div>
<div className="font-bold text-black text-6xl mt-10">
Hot NFTs
</div>
<div className="flex justify-between text-2xl" style={{justifyContent: 'space-between'}}>
<div className="mt-4">
Trending Treasures: Get in on the Action with These NFTs Making Waves and Potentially Shaping the Future.
</div>
<button className="border py-3 px-10">View All</button>
</div>

<div className="mt-10 flex" style={{gap:'40px'}}>
<MostRecentlyCard />
<MostRecentlyCard />
<MostRecentlyCard />
<MostRecentlyCard />
</div>

<div className="mt-10 flex" style={{gap:'40px'}}>
<MostRecentlyCard />
<MostRecentlyCard />
<MostRecentlyCard />
<MostRecentlyCard />
</div>

</div>
);
};

export default hotNFTs;
Loading

0 comments on commit 4ddf891

Please sign in to comment.