Skip to content

Add position relative on all Shadcn/Chakra AspectRatio component replacement divs #4801

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

Merged
merged 1 commit into from
Sep 25, 2024
Merged

Add position relative on all Shadcn/Chakra AspectRatio component replacement divs #4801

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
2 changes: 1 addition & 1 deletion ...ard/src/app/(dashboard)/(chain)/[chain_id]/(chainPage)/components/server/chain-header.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ export function ChainHeader(props: ChainHeaderProps) {
{!props.headerImageUrl && <div className="h-8 md:hidden" />}
<div
className={cn(
"max-sm:-mx-4 border-border border-b",
"max-sm:-mx-4 relative border-border border-b",
props.headerImageUrl ? "aspect-[4/1]" : "aspect-[8/1]",
)}
>
Expand Down
2 changes: 1 addition & 1 deletion apps/dashboard/src/components/hackathon/gaming/GameShowcase.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,7 +86,7 @@ export const GameShowcase = () => {
>
<ModalCloseButton />
</Box>
<div className="aspect-[16/9] w-full">
<div className="relative aspect-[16/9] w-full">
<Box
bg="#000"
borderRadius={{ base: "md", md: "lg" }}
Expand Down
4 changes: 2 additions & 2 deletions apps/dashboard/src/components/homepage/sections/WithoutThirdwebSection.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -113,7 +113,7 @@ export const WithoutThirdwebSection: React.FC = () => {
>
<SimpleGrid columns={12} gap={8} w="full">
<GridItem colSpan={{ base: 12, md: 6 }}>
<div className="aspect-[16/10] w-full">
<div className="relative aspect-[16/10] w-full">
<HomePageCodeBlock
darkTheme={darkTheme}
color="white"
Expand All @@ -131,7 +131,7 @@ export const WithoutThirdwebSection: React.FC = () => {
</div>
</GridItem>
<GridItem colSpan={{ base: 12, md: 6 }}>
<div className="aspect-[16/10] w-full">
<div className="relative aspect-[16/10] w-full">
<HomePageCodeBlock
darkTheme={darkTheme}
color="white"
Expand Down
4 changes: 2 additions & 2 deletions apps/dashboard/src/components/ipfs-upload/dropzone.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ export const IpfsUploadDropzone: React.FC = () => {
<Flex flexDir="column" gap={4}>
<div
className={cn(
"w-full",
"relative w-full",
droppedFiles.length
? "aspect-square md:aspect-[16/9]"
: "aspect-[2] md:aspect-[36/9]",
Expand Down Expand Up @@ -234,7 +234,7 @@ const FileUpload: React.FC<FileUploadProps> = ({ files, updateFiles }) => {
alignItems="center"
>
<GridItem colSpan={5} rowSpan={2}>
<div className="aspect-square">
<div className="relative aspect-square">
<Box
rounded="lg"
overflow="hidden"
Expand Down
4 changes: 2 additions & 2 deletions apps/dashboard/src/components/logo/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ export const IconLogo: React.FC<{ extraClass?: string; color?: string }> = ({
extraClass,
}) => {
return (
<div className={cn("aspect-[516/321]", extraClass || "")}>
<div className={cn("relative aspect-[516/321]", extraClass || "")}>
<svg viewBox="0 0 516 321" fill="none">
<title>thirdweb</title>
<g clipPath="url(#clip0_3:35)">
Expand Down Expand Up @@ -100,7 +100,7 @@ export const Logo: React.FC<ILogoProps> = ({
{(hideWordmark && !forceShowWordMark) ?? (
<div
className={cn(
"aspect-[1377/267] w-24 flex-shrink-0 md:w-28",
"relative aspect-[1377/267] w-24 flex-shrink-0 md:w-28",
forceShowWordMark ? "block" : "none md:block",
)}
style={color ? { color } : undefined}
Expand Down
2 changes: 1 addition & 1 deletion apps/dashboard/src/components/product-pages/common/GuideCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ export const GuideCard: React.FC<GuideCardProps> = ({
_hover={{ opacity: 0.86 }}
overflow="hidden"
>
<div className="aspect-[2400/1260] w-full">
<div className="relative aspect-[2400/1260] w-full">
<Box bg="rgba(0,0,0,.8)">
<NextImage
loading="lazy"
Expand Down
2 changes: 1 addition & 1 deletion apps/dashboard/src/contract-ui/tabs/claim-conditions/components/snapshot-upload.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -225,7 +225,7 @@ export const SnapshotUpload: React.FC<SnapshotUploadProps> = ({
<Flex flexGrow={1} align="center" overflow="auto">
<Container maxW="container.page">
<Flex gap={8} flexDir="column">
<div className="aspect-[21/9] w-full">
<div className="relative aspect-[21/9] w-full">
<Center
borderRadius="md"
{...getRootProps()}
Expand Down
2 changes: 1 addition & 1 deletion apps/dashboard/src/contract-ui/tabs/nfts/components/airdrop-upload.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -204,7 +204,7 @@ export const AirdropUpload: React.FC<AirdropUploadProps> = ({
<Flex flexGrow={1} align="center" overflow="auto">
<Container maxW="container.page">
<Flex gap={8} flexDir="column">
<div className="aspect-[21/9] w-full">
<div className="relative aspect-[21/9] w-full">
<Center
borderRadius="md"
{...getRootProps()}
Expand Down
2 changes: 1 addition & 1 deletion apps/dashboard/src/contract-ui/tabs/overview/components/MarketplaceDetails.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -272,7 +272,7 @@ const ListingCards: React.FC<ListingCardsProps> = ({
_hover={{ opacity: 0.75, textDecoration: "none" }}
>
<Card p={0} position="relative">
<div className="aspect-square w-full overflow-hidden rounded-xl">
<div className="relative aspect-square w-full overflow-hidden rounded-xl">
<Skeleton isLoaded={!isPending}>
<NFTMediaWithEmptyState
metadata={listing.asset.metadata}
Expand Down
2 changes: 1 addition & 1 deletion apps/dashboard/src/contract-ui/tabs/overview/components/NFTCards.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ export const NFTCards: React.FC<NFTCardsProps> = ({
_hover={{ opacity: 0.75, textDecoration: "none" }}
>
<Card p={0} h="full">
<div className="aspect-square w-full overflow-hidden rounded-xl">
<div className="relative aspect-square w-full overflow-hidden rounded-xl">
<Skeleton isLoaded={!isPending}>
<NFTMediaWithEmptyState
metadata={token.metadata}
Expand Down
2 changes: 1 addition & 1 deletion apps/dashboard/src/contract-ui/tabs/tokens/components/airdrop-upload-erc20.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -222,7 +222,7 @@ export const AirdropUploadERC20: React.FC<AirdropUploadProps> = ({
</>
) : (
<div className="flex flex-col gap-8">
<div className="aspect-[21/9] w-full">
<div className="relative aspect-[21/9] w-full">
<Center
borderRadius="md"
{...getRootProps()}
Expand Down
2 changes: 1 addition & 1 deletion apps/dashboard/src/core-ui/batch-upload/upload-step.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ export const UploadStep: React.FC<UploadStepProps> = ({
<Flex flexGrow={1} align="center" overflow="auto">
<Container maxW="container.page">
<Flex gap={8} flexDir={{ base: "column", md: "row" }}>
<div className="aspect-square w-full md:w-1/2">
<div className="relative aspect-square w-full md:w-1/2">
<Center
borderRadius="md"
{...getRootProps()}
Expand Down