h3n3/cadhub
1
0
Fork 0
Code Issues 35 Pull Requests Packages Projects Releases Wiki Activity

Bump SocialCard font sizes

Browse Source
This commit is contained in:
Kurt Hutten
2021-08-14 18:16:28 +10:00
parent 182ec78f79
commit 567da606f3
2 changed files with 13 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
app/web/src/components/SocialCardCell/SocialCardCell.tsx
View File

@@ -41,6 +41,7 @@ export const Success = ({
}: CellSuccessProps<FindSocialCardQuery>) => {
const image = userProject?.Project?.mainImage
const gravatar = userProject?.image
const truncatedDescription = userProject?.Project?.description?.length > 150 ? (userProject?.Project?.description || '').slice(0, 145) + ' . . .' : (userProject?.Project?.description || '')
return (
<div
className="flex-col flex h-full bg-ch-gray-800 text-ch-gray-300"
@@ -52,36 +53,30 @@ export const Success = ({
>
<div className="bg-ch-gray-800 relative">
<div className="absolute bottom-0 left-0 transform scale-200 aspect-h-1 h-full -translate-x-24 translate-y-24 rotate-45 rounded-full overflow-hidden">
{/* <CloudinaryImage
cloudName="irevdev"
publicId={image || 'CadHub/eia1kwru54g2kf02s2xx'}
width={500}
crop="scale"
/> */}
</div>
<div className="relative bg-ch-gray-760 bg-opacity-90 pt-10 pl-20 pr-12 h-full backdrop-filter backdrop-blur">
<div className="flex justify-between items-center">
<div className="flex items-center">
{gravatar && (
<Gravatar image={gravatar} className="w-14 h-14" size={60} />
<Gravatar image={gravatar} className="w-18 h-18" size={60} />
)}
<div className="text-2xl font-fira-sans ml-6 whitespace-nowrap">
<div className="text-3xl font-fira-sans ml-6 whitespace-nowrap">
{userProject?.userName}
</div>
</div>
<CadPackage
cadPackage={userProject?.Project?.cadPackage}
className="p-2 rounded px-4"
className="p-2 rounded px-4 transform scale-150 origin-right"
/>
</div>
<h1 className="text-6xl font-fira-sans mt-16 capitalize">
<h1 className="text-6xl font-fira-sans mt-12 capitalize">
{userProject?.Project?.title.replace(/-/g, ' ')}
</h1>
<p className="mt-10 text-2xl font-fira-sans text-ch-gray-400">
{(userProject?.Project?.description || '').slice(0, 150)}
<p className="mt-10 text-3xl font-fira-sans text-ch-gray-400">
{truncatedDescription}
</p>
</div>
</div>
@@ -104,7 +99,7 @@ export const Success = ({
</div>
</div>
<div
className="h-24 grid bg-ch-gray-900 relative"
className="h-28 grid bg-ch-gray-900 relative"
style={{ gridTemplateColumns: '7fr 5fr' }}
>
<div className="grid grid-flow-col-dense items-center justify-center gap-16">
@@ -121,10 +116,10 @@ export const Success = ({
},
].map(({ svg, title, count }, index) => (
<div className="grid grid-flow-col-dense gap-4" key={index}>
<Svg className="w-10" name={svg} />
<Svg className="w-12" name={svg} />
<div className="flex flex-col">
<div className="text-3xl">{count}</div>
<div className="text-xl text-ch-gray-400">{title}</div>
<div className="text-4xl">{count}</div>
<div className="text-3xl text-ch-gray-400">{title}</div>
</div>
</div>
))}
@@ -134,17 +129,11 @@ export const Success = ({
<div className="ml-2 md:ml-6 flex">
{/* Because of how specific these styles are to this heading/logo and it doesn't need to be replicated else where as well as it's very precise with the placement of "pre-alpha" I think it's appropriate. */}
<h2
className="text-indigo-300 text-2xl md:text-5xl font-ropa-sans py-1 md:tracking-wider"
className="text-indigo-300 text-3xl md:text-5xl font-ropa-sans py-1 md:tracking-wider"
style={{ letterSpacing: '0.3em' }}
>
CadHub
</h2>
<div
className="text-pink-400 text-sm font-bold font-ropa-sans hidden md:block whitespace-nowrap"
style={{ paddingBottom: '2rem', marginLeft: '-1.8rem' }}
>
pre-alpha
</div>
</div>
</div>
</div>