Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Front end #2

Open
wants to merge 28 commits into
base: main
Choose a base branch
from
Open

Front end #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
28 commits
Select commit Hold shift + click to select a range
e8fa52b
added asserts
vijaymurugann Jan 4, 2023
3f58e92
added header part
vijaymurugann Jan 4, 2023
f4354c1
added collection section
vijaymurugann Jan 4, 2023
0a4bc41
home page added
vijaymurugann Jan 4, 2023
8464e7e
changed
vijaymurugann Jan 6, 2023
1a718b9
Added colection page
vijaymurugann Jan 7, 2023
5bbec1b
user part 78% completed
vijaymurugann Jan 7, 2023
a582dc0
Updated NavBar
vijaymurugann Jan 9, 2023
5c09e15
Mint page updated
vijaymurugann Jan 9, 2023
fe30d12
Updated List Page
vijaymurugann Jan 9, 2023
398c7ee
Enanched code
vijaymurugann Jan 9, 2023
054028b
UPDATE : List/Collection Part
vijaymurugann Jan 9, 2023
77253bd
Added Mint function
vijaymurugann Jan 9, 2023
ad4972a
ADDED : Create Collection
vijaymurugann Jan 9, 2023
b318126
updated code
vijaymurugann Jan 9, 2023
5b8f874
deploy commit
vijaymurugann Jan 9, 2023
e5c98c6
removed eslint
vijaymurugann Jan 9, 2023
a0a01d4
modified code
vijaymurugann Jan 9, 2023
e0b6f97
modifed for vercel
vijaymurugann Jan 9, 2023
88f2265
Changed Card name
vijaymurugann Jan 9, 2023
9ba6129
Changed location
vijaymurugann Jan 9, 2023
adf94c1
modified
vijaymurugann Jan 9, 2023
e102273
Fixed bug
vijaymurugann Jan 9, 2023
6aabf53
modified code
vijaymurugann Jan 9, 2023
ac10aa7
Fixed style
vijaymurugann Jan 14, 2023
b5c11ed
Merge pull request #1 from VijayAlpha/mintbase.2.0
vijaymurugann Jan 14, 2023
4a6bdc2
Merge branch 'main' into front-end
vijaymurugann Jan 17, 2023
4456640
removed log
vijaymurugann Feb 16, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion .env
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,4 +2,5 @@ NEXT_PUBLIC_NEAR_NETWORK=testnet
NEXT_PUBLIC_MINTBASE_API=511a3b51-2ed5-4a27-b165-a27a01eebe0a
NEXT_PUBLIC_CONTRACT_ID=unlockableteststore.mintspace2.testnet
NEXT_PUBLIC_OWNER=valpha.testnet
NEXT_PUBLIC_BACKEND_URL=http://localhost:8000
NEXT_PUBLIC_BACKEND_URL=https://alliemarketplace-test.vercel.app
NEXT_PUBLIC_REFERRAL_ID=
220 changes: 206 additions & 14 deletions components/Buy.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/* eslint-disable @next/next/no-img-element */
// eslint-disable-next-line @next/next/no-img-element
import Image from "next/image";
import { useEffect, useState } from "react";
import { Wallet, Chain, Network } from "mintbase";

Expand Down Expand Up @@ -71,9 +71,191 @@ export const Buy = ({ meta }) => {
});
};

const ele = nftData ? (
<>
<section className="section section-buy-nft">
const Loading = (
<section className="page-header-section style-1 vh-100">
<div className="container">
<div className="page-header-content">
<div className="page-header-inner">
<div className="page-title">
<h2>Checking Access </h2>
</div>
<ol className="breadcrumb">
<li>
<a href="index.html">Please</a>
</li>
<li className="active">wait</li>
</ol>
</div>
</div>
</div>
</section>
);

const NftDetails =
nftData ? (
<>
<section className="page-header-section style-1">
<div className="container">
<div className="page-header-content">
<div className="page-header-inner">
<div className="page-title">
<h2> NFT Details</h2>
</div>
<ol className="breadcrumb">
<li>Buy this NFT to unloack the collection</li>
</ol>
</div>
</div>
</div>
</section>
<div className="item-details-section padding-top padding-bottom">
<div className="container">
<div className="item-details-wrapper">
<div className="row g-5">
<div className="col-lg-6">
<div className="item-desc-part">
<div className="item-desc-inner">
<div className="item-desc-thumb">
<img src={nftData.media} alt="item-img" />
</div>
<div className="item-desc-content">
<div className="tab-content" id="nav-tabContent">
<div
className="details-tab tab-pane fade show active"
id="nav-details"
role="tabpanel"
aria-labelledby="nav-details-tab"
>
<p>{nftData.description}</p>
<ul className="other-info-list">
<li className="item-other-info">
<div className="item-info-title">
<h6>Contact Address</h6>
</div>
<div className="item-info-details">
<div id="cryptoCode" className="crypto-page">
<input
id="cryptoLink"
value={nftData.nft_contract_id}
readOnly
/>
<div
id="cryptoCopy"
data-bs-toggle="tooltip"
data-bs-placement="top"
title="Copy Address"
>
<span className="copy-icon">
<i
className="icofont-ui-copy"
aria-hidden="true"
data-copytarget="#cryptoLink"
></i>
</span>
</div>
</div>
</div>
</li>
<li className="item-other-info">
<div className="item-info-title">
<h6>Token ID</h6>
</div>
<div className="item-info-details">
<p>{nftData.token_id}</p>
</div>
</li>
<li className="item-other-info">
<div className="item-info-title">
<h6>Market</h6>
</div>
<div className="item-info-details">
<p>{nftData.market_id}</p>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div className="col-lg-6">
<div className="item-buy-part">
<div className="nft-item-title">
<h3>Name: {nftData.title}</h3>
<div className="share-btn">
<div className=" dropstart">
<a
className=" dropdown-toggle"
href="#"
role="button"
data-bs-toggle="dropdown"
aria-expanded="false"
data-bs-offset="25,0"
>
<i className="icofont-share-alt"></i>
</a>

<ul className="dropdown-menu">
<li>
<a className="dropdown-item" href="#">
<span>
<i className="icofont-twitter"></i>
</span>{" "}
Twitter{" "}
</a>
</li>
<li>
<a className="dropdown-item" href="#">
<span>
<i className="icofont-telegram"></i>
</span>{" "}
Telegram
</a>
</li>
<li>
<a className="dropdown-item" href="#">
<span>
<i className="icofont-envelope"></i>
</span>{" "}
Email
</a>
</li>
</ul>
</div>
</div>
</div>

<div className="item-price">
<h4>Price</h4>
<p>
<span>
<i className="icofont-coins"></i>
{Math.round(
nftData.price.toLocaleString("fullwide", {
useGrouping: false,
}) *
10 ** -24
)}{" "}
NEAR
</span>
</p>
</div>
<div
className="buying-btns d-flex flex-wrap pointer"
onClick={() => onclkBtn()}
>
<div className="default-btn move-right">
<span>Buy Now</span>{" "}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{/* <section className="section section-buy-nft">
<div className="collection">
<div className="collection__left">
<div className="right">
Expand Down Expand Up @@ -111,16 +293,26 @@ export const Buy = ({ meta }) => {
</div>
</div>
</div>
</section> */}
</>
) : (
<section className="page-header-section style-1 vh-100">
<div className="container">
<div className="page-header-content">
<div className="page-header-inner">
<div className="page-title">
<h2> Sorry! This NFT is Sold Out.</h2>
</div>
<ol className="breadcrumb">
<li>
<a href="index.html">Please Check Other Collections.</a>
</li>
</ol>
</div>
</div>
</div>
</section>
</>
) : (
<section className="section section-buy-nft">
<h1 className="text--h1">
Sorry! This NFT is Sold Out. <br />
Please Check Other Collections.
</h1>
</section>
);
);

return ele;
return nftData ? NftDetails : Loading;
};
70 changes: 70 additions & 0 deletions components/CollectionCard.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
import Link from "next/link";
import Image from "next/image";

export const CollectionCard = ({ post }) => {
return (
<Link
href={`/collection/${post.metadata_id}`}
className="col-xl-4 col-lg-4 col-sm-6"
>
<div className="nft-item home-4">
<div className="nft-inner">
{/* <!-- nft top part --> */}
<div className="nft-item-top d-flex justify-content-between align-items-center">
<div className="author-part">
<ul className="author-list d-flex">
<li className="single-author d-flex align-items-center">
<Link href="/author" className="veryfied">
<Image
loading="lazy"
src="/assets/images/seller/author.jpg"
alt="author-img"
width={100}
height={100}
/>
</Link>
<h6>
<Link href="#">Allie eve knox</Link>
</h6>
</li>
</ul>
</div>
</div>
{/* <!-- nft-bottom part --> */}
<div className="nft-item-bottom">
<div className="nft-thumb" style={{ width: "100%", height: "260px" }}>
<Image
loading="lazy"
src={post.nftImage}
alt="nft-img"
fill
/>
</div>
<div className="nft-content">
<h4>
<Link href="item-details.html">{post.name}</Link>
</h4>
<div className="price-like d-flex justify-content-between align-items-center">
<p className="nft-price">
Price:{" "}
<span className="yellow-color">
{Math.round(
post.price.toLocaleString("fullwide", {
useGrouping: false,
}) *
10 ** -24
)}{" "}
NEAR
</span>
</p>
{/* <a href="#" className="nft-like">
<i className="icofont-heart"></i> 230
</a> */}
</div>
</div>
</div>
</div>
</div>
</Link>
);
};
Loading