Skip to content

Commit

Permalink
chore: fix first pass
Browse files Browse the repository at this point in the history
  • Loading branch information
DjordjeVujatovic committed Aug 9, 2023
1 parent f7d0c5c commit 43adefc
Show file tree
Hide file tree
Showing 4 changed files with 74 additions and 49 deletions.
6 changes: 3 additions & 3 deletions src/components/MintDialog/MintDialog.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -240,16 +240,16 @@ export const MintDialog: FC<{ size?: ButtonProps['size'] }> = ({ size }) => {
<Dialog.Overlay className={dialogClasses.overlay} />
<Dialog.Content
className={clsx(
'data-[state=open]:animate-contentShow fixed top-[50%] left-[50%] max-h-[90vh] w-[90vw] max-w-[450px] lg:max-w-[75vw] translate-x-[-50%] translate-y-[-50%] rounded-[24px] p-5 shadow-large bg-white focus:outline-none z-40 lg:p-16 overflow-initial h-auto lg:h-auto lg:overflow-hidden',
'data-[state=open]:animate-contentShow fixed top-[50%] left-[50%] max-h-fit w-[90vw] max-w-[450px] lg:max-w-[75vw] translate-x-[-50%] translate-y-[-50%] rounded-[24px] p-5 shadow-large bg-white focus:outline-none z-40 lg:p-16 overflow-initial h-auto lg:h-auto lg:overflow-hidden',
{ '!h-full': isDisplayingCrossMintForm }
)}
>
<Dialog.Close asChild>
<button
className="p-4 lg:p-0 bg-white rounded-full lg:rounded-none z-30 lg:inline-flex absolute -top-4 -right-4 lg:top-10 lg:right-10 appearance-none items-center justify-center"
className="p-4 lg:p-0 bg-white rounded-full lg:rounded-none z-30 lg:inline-flex absolute top-[1.75rem] right-[1.75rem] lg:top-10 lg:right-10 appearance-none items-center justify-center"
aria-label="Close"
>
<Close height={24} width={24} />
<Close height={8} width={8} />
<span className="sr-only">Close</span>
</button>
</Dialog.Close>
Expand Down
2 changes: 1 addition & 1 deletion src/components/MintDialog/elements/Layout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export const Layout: FC<LayoutProps> = ({ children }) => {
<img
src={dropImage}
alt={dropName}
className="object-cover rounded-lg md:rounded-[20px] absolute inset-0 h-full w-full"
className="object-cover object-top rounded-lg md:rounded-[20px] absolute inset-0 h-full w-full"
/>
</div>
<div className="flex flex-col w-full gap-4 h-full overflow-scroll hide-scrollbar">
Expand Down
7 changes: 6 additions & 1 deletion src/components/MintDialog/elements/PartnerInfo.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,12 @@ export const PartnerInfo: FC = () => {
return (
<div className="flex gap-2">
<div className="relative z-20 h-6 w-6">
<Image src={partnerIcon} alt={`${partnerName} Icon`} fill />
<Image
src={partnerIcon}
alt={`${partnerName} Icon`}
fill
className="!object-top"
/>
</div>
<span className="font-medium">{partnerName}</span>
</div>
Expand Down
108 changes: 64 additions & 44 deletions src/components/Share/Share.tsx
Original file line number Diff line number Diff line change
@@ -1,52 +1,72 @@
import { FC } from 'react';
import Link from 'next/link';
import { FC } from 'react'
import Link from 'next/link'

import { TwitterIcon } from '@/components/icons/Twitter';
import { useMintDialogContext } from '@/components/MintDialog/Context/useMintDialogContext';
import { website } from '@/config/website';
import { WarpCast } from '@/components/icons/Warpcast';
import {Lens} from "@/components/icons/Lens";
import { TwitterIcon } from '@/components/icons/Twitter'
import { useMintDialogContext } from '@/components/MintDialog/Context/useMintDialogContext'
import { website } from '@/config/website'
import { WarpCast } from '@/components/icons/Warpcast'
import { Lens } from '@/components/icons/Lens'

const twitterURL: string = "https://twitter.com/intent/tweet";
const warpCastURL: string = "https://warpcast.com";
const lensURL: string = "https://lenster.xyz";
const twitterURL: string = 'https://twitter.com/intent/tweet'
const warpCastURL: string = 'https://warpcast.com'
const lensURL: string = 'https://lenster.xyz'

type ShareComponentProps = {}
export const Share: FC<ShareComponentProps> = () => {
const { dropName } = useMintDialogContext();
const { location:{ href } } = window;
const shareText = {
twitter: `I just minted ${dropName}, celebrating the start of @BuildOnBase bringing billions of people onchain.%0a%0aIt’s Onchain Summer.`,
lens: `I just minted ${dropName}, celebrating the start of @BuildOnBase bringing billions of people onchain.%0a%0aIt’s Onchain Summer.`,
warpCast: `I just minted ${dropName}, celebrating the start of @base bringing billions of people onchain.%0a%0aIt’s Onchain Summer.`
}
export const Share: FC<ShareComponentProps> = () => {
const { dropName } = useMintDialogContext()
const {
location: { href },
} = window
const shareText = {
twitter: `I just minted ${dropName}, celebrating the start of @BuildOnBase bringing billions of people onchain.%0a%0aIt’s Onchain Summer.`,
lens: `I just minted ${dropName}, celebrating the start of @BuildOnBase bringing billions of people onchain.%0a%0aIt’s Onchain Summer.`,
warpCast: `I just minted ${dropName}, celebrating the start of @base bringing billions of people onchain.%0a%0aIt’s Onchain Summer.`,
}

const tweetUrl = `${twitterURL}?url=${href}&text=${shareText['twitter']}`;
const warpCastShareUrl = `${warpCastURL}/~/compose?text=${shareText['warpCast']}&embeds[]=${href}`;
const lensShareUrl = `${lensURL}?text=${shareText['lens']}&url=${href}`;
const tweetUrl = `${twitterURL}?url=${href}&text=${shareText['twitter']}`
const warpCastShareUrl = `${warpCastURL}/~/compose?text=${shareText['warpCast']}&embeds[]=${href}`
const lensShareUrl = `${lensURL}?text=${shareText['lens']}&url=${href}`

return (
<div className="flex flex-row items-center m-[10px] gap-4">
<div className="flex flex-col items-center space-x-2">
<Link href={tweetUrl} target="_blank" className="flex flex-col items-center">
<TwitterIcon/>
<p className="text-sm font-mono uppercase text-[#858585] mt-[6px]">Twitter</p>
</Link>
</div>
return (
<div className="flex flex-row items-center m-[10px] gap-4">
<div className="flex flex-col items-center space-x-2">
<Link
href={tweetUrl}
target="_blank"
className="flex flex-col items-center"
>
<TwitterIcon />
<p className="text-sm font-mono uppercase text-[#858585] mt-[6px]">
X
</p>
</Link>
</div>

<div className="flex flex-col items-center space-x-2">
<Link href={warpCastShareUrl} target="_blank" className="flex flex-col items-center">
<WarpCast/>
<p className="text-sm font-mono uppercase text-[#858585] mt-[6px]">Warpcast</p>
</Link>
</div>
<div className="flex flex-col items-center space-x-2">
<Link
href={warpCastShareUrl}
target="_blank"
className="flex flex-col items-center"
>
<WarpCast />
<p className="text-sm font-mono uppercase text-[#858585] mt-[6px]">
Warpcast
</p>
</Link>
</div>

<div className="flex flex-col items-center space-x-2">
<Link href={lensShareUrl} target="_blank" className="flex flex-col items-center">
<Lens/>
<p className="text-sm font-mono uppercase text-[#858585] mt-[6px]">Lens</p>
</Link>
</div>
</div>
)
}
<div className="flex flex-col items-center space-x-2">
<Link
href={lensShareUrl}
target="_blank"
className="flex flex-col items-center"
>
<Lens />
<p className="text-sm font-mono uppercase text-[#858585] mt-[6px]">
Lens
</p>
</Link>
</div>
</div>
)
}

0 comments on commit 43adefc

Please sign in to comment.