nathanwoodburn/det0x
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #1 from namebasehq/font-style
Some checks failed
Deploy static content to Pages / deploy (push) Failing after 6m54s
Details

Browse Source 
Font & style
This commit is contained in:
Aaron Oxborrow 2024-04-25 06:32:10 -07:00 committed by GitHub
commit b5e241d017
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 27 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/App.jsx
View File

@ -17,15 +17,15 @@ function App() {
const { address } = useAccount(); const { address } = useAccount();
return ( return (
<div className="bg-neutral-50 h-screen flex"> <div className="h-screen flex">
<div className="flex-col justify-between items-center flex max-w-7xl mx-auto gap-10 w-full pt-3"> <div className="flex-col justify-between items-center flex max-w-7xl mx-auto gap-10 w-full pt-3">
<nav className="w-full flex justify-between gap-2 px-4 py-2 items-center"> <nav className="w-full flex justify-between gap-2 px-4 sm:px-8 py-2 items-center">
<img className="w-36" src={brandLogo} /> <img className="w-36" src={brandLogo} />
<div className="flex items-center gap-4"> <div className="flex items-center gap-8">
{address && ( {address && (
<a <a
href={`https://hns.id/account/${address}`} href={`https://hns.id/account/${address}`}
className="text-neutral-700 text-sm font-semibold uppercase hidden md:block hover:text-neutral-500" className="text-neutral-500 text-sm font-semibold uppercase tracking-wide hidden md:block hover:text-neutral-600"
> >
My Domains My Domains
</a> </a>
@ -33,52 +33,57 @@ function App() {
<ConnectButton /> <ConnectButton />
</div> </div>
</nav> </nav>
<section className="flex-grow w-full flex flex-col items-center p-4 gap-6 text-center"> <section className="flex-grow w-full flex flex-col items-center p-4 gap-4 text-center">
<div className="text-neutral-950 text-4xl lg:text-5xl font-bold leading-none"> <div className="text-neutral-950 text-4xl lg:text-5xl font-extrabold leading-none tracking-tight mt-2">
{HERO_TEXT} {HERO_TEXT}
</div> </div>
<div className="text-neutral-500 text-lg lg:text-2xl font-bold leading-normal"> <div className="text-neutral-500 text-xl lg:text-2xl font-medium leading-normal tracking-tight">
{SUB_TEXT} {SUB_TEXT}
</div> </div>
<div className="w-full flex-1 pt-6 max-w-xl text-left"> <div className="w-full flex-1 pt-10 max-w-xl text-left">
<Search /> <Search />
</div> </div>
</section> </section>
<footer className="w-full border-t px-4 py-6 flex flex-col lg:flex-row lg:justify-between gap-4"> <footer className="w-full mx-auto px-4 sm:px-8 mb-4">
<ul className="flex gap-8 text-neutral-700 text-sm font-medium uppercase"> <div className="border-t w-full px-3 border-neutral-300 flex flex-col sm:flex-row sm:justify-between gap-4 pt-5 pb-6">
<ul className="flex items-center gap-8 text-neutral-500 text-[13px] font-medium uppercase">
<li> <li>
<a <a
className="hover:text-neutral-500" className="hover:text-neutral-700"
href={`https://twitter.com/${TWITTER_HANDLE}`} href={`https://twitter.com/${TWITTER_HANDLE}`}
target="_blank"
> >
Twitter Twitter
</a> </a>
</li> </li>
<li> <li>
<a <a
className="hover:text-neutral-500" className="hover:text-neutral-700"
href="https://github.com/namebasehq/wallet-id" href="https://github.com/namebasehq/wallet-id"
target="_blank"
> >
GitHub GitHub
</a> </a>
</li> </li>
<li> <li>
<a <a
className="hover:text-neutral-500" className="hover:text-neutral-700"
href={`https://opensea.io/collection/handshake-slds?search[stringTraits][0][name]=TLD&search[stringTraits][0][values][0]=${TLD}`} href={`https://opensea.io/collection/handshake-slds?search[stringTraits][0][name]=TLD&search[stringTraits][0][values][0]=${TLD}`}
target="_blank"
> >
OpenSea OpenSea
</a> </a>
</li> </li>
</ul> </ul>
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<div className="text-neutral-400 text-xs font-normal uppercase"> <div className="text-neutral-500 text-[11px] font-semibold opacity-50 uppercase">
powered by powered by
</div> </div>
<a href="https://hns.id"> <a href="https://hns.id" target="_blank">
<img src={hnsLogo} className="w-24" /> <img src={hnsLogo} className="w-24" />
</a> </a>
</div> </div>
</div>
</footer> </footer>
</div> </div>
</div> </div>

4
src/components/Debug.jsx
View File

@ -6,14 +6,14 @@ export const Debug = ({ error, data }) => {
return ( return (
<div className="flex flex-col gap-2 mt-10 text-left"> <div className="flex flex-col gap-2 mt-10 text-left">
<span className="text-red-600 font-semibold bg-yellow-300 px-4 py-2 rounded-md"> <span className="text-black font-semibold bg-yellow-300 px-4 py-2 rounded-md">
TESTNET TESTNET
</span> </span>
{error && ( {error && (
<div className="p-2 text-red-600 bg-red-100 rounded-md">{error}</div> <div className="p-2 text-red-600 bg-red-100 rounded-md">{error}</div>
)} )}
{data && ( {data && (
<pre className="p-2 text-gray-500 bg-gray-100 border border-gray-500 rounded-lg overflow-scroll"> <pre className="p-2 text-gray-500 bg-gray-100 ring-1 ring-gray-400 rounded-md overflow-y-auto">
{JSON.stringify(data, null, 2)} {JSON.stringify(data, null, 2)}
</pre> </pre>
)} )}

11
src/components/search/Search.jsx
View File

@ -31,15 +31,12 @@ export const Search = () => {
return ( return (
<> <>
<div className="flex-1 bg-white rounded-2xl border border-zinc-300 shadow"> <div className="flex-1 bg-white rounded-2xl border border-zinc-300 shadow focus-within:border-zinc-400/80 hover:border-zinc-400/80">
<SearchInput expand={show} onChange={onChange} /> <SearchInput expand={show} onChange={onChange} />
{show && ( {show && (
<div className="w-full p-3 bg-white rounded-b-2xl inline-flex flex-col lg:flex-row gap-2 flex-1 lg:overflow-scroll"> <div className="w-full py-3 px-4 bg-white rounded-b-2xl inline-flex flex-col sm:flex-row gap-2 flex-1">
<div className="flex-1 lg:w-full lg:overflow-scroll items-center gap-2 flex"> <div className="flex-1 lg:w-full items-center overflow-hidden gap-2 flex">
<div <div className="text-xl font-medium leading-loose lg:w-fit">
className="text-xl font-medium leading-loose lg:w-fit overflow-scroll"
style={{ scrollbarWidth: 'none' }}
>
<span className="text-neutral-950">{label}</span> <span className="text-neutral-950">{label}</span>
<span className="text-neutral-400">.{TLD}</span> <span className="text-neutral-400">.{TLD}</span>
</div> </div>

2
src/components/search/SearchInput.jsx
View File

@ -15,7 +15,7 @@ export const SearchInput = ({ expand, onChange }) => {
> >
<input <input
className={cn( className={cn(
'grow shrink basis-0 rounded-t-2xl text-neutral-400 text-base font-medium leading-tight tracking-tight p-5 border-zinc-300 focus:outline-none', 'grow shrink basis-0 rounded-t-2xl text-neutral-600 text-base font-medium leading-tight tracking-tight p-4 border-zinc-300 focus:outline-none',
expand ? 'rounded-t-2xl border-b' : 'rounded-2xl' expand ? 'rounded-t-2xl border-b' : 'rounded-2xl'
)} )}
onChange={handleChange} onChange={handleChange}