Mobile fixes

This commit is contained in:
Elio Struyf
2021-08-30 18:01:31 +02:00
parent 4994761fe2
commit e7a124f178
4 changed files with 10 additions and 5 deletions
+1 -1
View File
@@ -8,7 +8,7 @@ export const CTA: React.FunctionComponent<ICTAProps> = (props: React.PropsWithCh
const { t: strings } = useTranslation();
return (
<div className="pt-8 overflow-hidden sm:pt-12 lg:relative lg:py-48">
<div className="px-4 sm:px-0 pt-8 overflow-hidden sm:pt-12 lg:relative lg:py-48">
<div className="mx-auto sm:max-w-3xl sm:px-6 lg:px-8 lg:max-w-7xl lg:grid lg:grid-cols-2 lg:gap-24">
<div className={`my-4 sm:my-5 lg:my-6`}>
<h1 className="text-5xl tracking-tight font-extrabold sm:leading-none lg:text-5xl xl:text-6xl">
+5
View File
@@ -12,6 +12,7 @@ export const Generators: React.FunctionComponent<IGeneratorsProps> = (props: Rea
<p className="text-center text-sm font-semibold uppercase text-vulcan-500 tracking-wide">
{strings(`generators_title`)}
</p>
<div className="mt-6 grid grid-cols-2 gap-8 md:grid-cols-6">
<div className="col-span-1 flex justify-center">
<img className="h-12" src="/assets/logos/11ty.svg" alt="11ty" />
@@ -32,6 +33,10 @@ export const Generators: React.FunctionComponent<IGeneratorsProps> = (props: Rea
<img className="h-12" src="/assets/logos/nextjs.svg" alt="Next.js" />
</div>
</div>
<div className="mt-6 flex justify-center">
<p className={`text-2xl tracking-tight font-bold sm:leading-none text-vulcan-500`}>and many more...</p>
</div>
</div>
</div>
);
+1 -1
View File
@@ -16,7 +16,7 @@ export default function Home({ content }: any) {
<OtherMeta image={`/assets/frontmatter-preview.png`} />
<Layout>
<div className="max-w-7xl mx-auto py-16 px-4 sm:px-6 lg:py-24 lg:px-8 divide-y-2 divide-vulcan-200">
<div className="max-w-7xl mx-auto py-8 px-4 sm:px-6 lg:py-24 lg:px-8 divide-y-2 divide-vulcan-200">
<div className="py-8 space-y-2 md:space-y-5 ">
<h1 className="text-5xl tracking-tight font-extrabold sm:leading-none lg:text-5xl xl:text-6xl">{strings(`changelog_page_title`)}</h1>
+3 -3
View File
@@ -14,17 +14,17 @@ export default function Home({ showcases }: any) {
<OtherMeta image={`/assets/frontmatter-preview.png`} />
<Layout>
<div className="max-w-7xl mx-auto py-16 px-4 sm:px-6 lg:py-24 lg:px-8 divide-y-2 divide-vulcan-200">
<div className="max-w-7xl mx-auto py-8 px-4 sm:px-6 lg:py-24 lg:px-8 divide-y-2 divide-vulcan-200">
<div className="py-8 space-y-2 md:space-y-5 ">
<h1 className="text-5xl tracking-tight font-extrabold sm:leading-none lg:text-5xl xl:text-6xl">{strings(`showcase_title`)}</h1>
<p className="mt-3 text-base text-whisper-700 sm:mt-5 sm:text-xl lg:text-lg xl:text-xl">{strings(`showcase_description`)}</p>
</div>
<div className={`py-8 grid grid-cols-2 gap-8`}>
<div className={`py-8 grid grid-cols-1 lg:grid-cols-2 gap-8`}>
{showcases.filter((showcase: any) => showcase.image).map((showcase: any) => (
<a key={showcase.title} className="group space-y-2 md:space-y-5 relative" href={showcase.link} title={showcase.title} rel={`noopener noreferrer`}>
<figure className={`relative h-[25rem] overflow-hidden grayscale group-hover:grayscale-0`}>
<figure className={`relative h-64 lg:h-[25rem] overflow-hidden grayscale group-hover:grayscale-0`}>
<img className={`w-full object-cover`} src={`/showcases/${showcase.image}`} alt={showcase.title} loading={`lazy`} />
</figure>