use case mobile fixs

This commit is contained in:
Kalidou Diagne
2024-06-19 18:36:38 +02:00
parent 3f149a573f
commit 42ebb4320c
3 changed files with 9 additions and 9 deletions

View File

@@ -19,11 +19,11 @@ const IconMapping: Record<WebsiteType, React.ReactNode> = {
export default function UseCases() {
return (
<div className="flex flex-col">
<div className=" py-16">
<div className=" py-10 md:py-16">
<AppContainer className="flex flex-col gap-16 !max-w-[800px]">
<Section
title={
<h2 className=" text-primary font-semibold text-[32px] text-center">
<h2 className=" text-primary font-semibold text-2xl md:text-[32px] text-center">
{LABELS.USE_CASES.USE_CASES.TITLE}
</h2>
}
@@ -32,20 +32,20 @@ export default function UseCases() {
<Section
title={
<h2 className=" text-primary font-semibold text-[32px] text-center">
<h2 className=" text-primary font-inter w-3/4 mx-auto font-semibold text-2xl leading-6 md:text-[32px] md:w-full text-center">
{LABELS.USE_CASES.BUILD_WITH_TLSNOTARY}
</h2>
}
>
<div className="grid grid-cols-1 gap-5 md:grid-cols-2">
<div className="grid grid-cols-1 gap-5 md:grid-cols-2">
{ProjectList.map((project) => {
return (
<Card.Base key={project.title}>
<div className="flex flex-col gap-3">
<h5 className=" text-white font-inter font-semibold text-[28px] leading-[28px]">
<h5 className=" text-white font-inter font-semibold text-[22px] leading-5 md:text-[28px] md:leading-[28px]">
{project.title}
</h5>
<div className=" min-h-[100px]">
<div className="min-h-[100px]">
<span className="text-white text-sm font-normal font-inter line-clamp-5">{project.tldr}</span>
</div>
</div>

View File

@@ -9,8 +9,8 @@ interface SectionProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
export const Section = ({ title, description, children }: SectionProps) => {
return (
<div className="flex flex-col gap-6 md:gap-16">
<div className="flex flex-col gap-8">
<div className="flex flex-col gap-4 md:gap-16">
<div className="flex flex-col gap-4 md:gap-8">
{typeof title === "string" ? <Label.SectionTitle className="text-center">{title}</Label.SectionTitle> : title}
{description && <AppMarkdown>{description}</AppMarkdown>}
{children && <div className="flex">{children}</div>}

View File

@@ -56,7 +56,7 @@ export const Banner = ({ title, description, actions, descriptionClass, color }:
<AppContainer>
<div className="mx-auto py-10 md:py-16 px-8 md:px-[120px] bg-white rounded-3xl w-full md:max-w-[900px]">
<div className={cn("flex flex-col gap-8")}>
<div className="flex flex-col gap-6">
<div className="flex flex-col gap-4 md:gap-6">
<span className=" text-primary font-inter font-bold text-2xl text-center md:text-5xl">{title}</span>
{description && (
<ReactMarkdown