feat: mobile everything

gatteo · Mar 11, 2024 · 8b54da4 · 8b54da4
1 parent f636c44
commit 8b54da4
Show file tree

Hide file tree

Showing 8 changed files with 13 additions and 13 deletions.
diff --git a/app/(core)/blog/page.tsx b/app/(core)/blog/page.tsx
@@ -41,8 +41,8 @@ export default async function Page() {
     return (
         <>
             <PageTitle
-                title='Articoli. Storie. Guide.'
-                description='Sono onesto, la scrittura non è il mio punto forte. Non è che non mi piaccia, ma spesso mi spaventa affrontare una pagina bianca da riempire con parole. Proprio per questo, ho deciso di sfidare me stesso creando questo piccolo angolo del web, un posto dove allenarmi a scrivere. Tanto chi legge i blog nel 2024?'
+                title='articoli. storie. guide.'
+                description='sarò onesto, la scrittura non è il mio punto forte. Non è che non mi piaccia, ma spesso mi spaventa affrontare una pagina bianca da riempire con parole. Proprio per questo, ho deciso di sfidare me stesso creando questo piccolo angolo del web, un posto dove allenarmi a scrivere. Tanto chi legge i blog nel 2024?'
                 fromColor='from-purple-400'
                 toColor='to-pink-600'
             />

diff --git a/app/(core)/contacts/page.tsx b/app/(core)/contacts/page.tsx
@@ -16,8 +16,8 @@ export default function Page() {
                 toColor='to-blue-500'
             />
 
-            <h2 className='mt-16 text-2xl font-bold'>Email</h2>
-            <div className='mt-6 grid grid-cols-1 gap-4 sm:grid-cols-2'>
+            <h2 className='mt-16 text-xl font-bold md:text-2xl'>Email</h2>
+            <div className='mt-4 grid grid-cols-1 gap-4 sm:grid-cols-2 md:mt-6'>
                 {ContactLinks.map((link) => {
                     return (
                         <Link
@@ -43,8 +43,8 @@ export default function Page() {
                 })}
             </div>
 
-            <h2 className='mt-16 text-2xl font-bold'>Social</h2>
-            <div className='mt-6 grid grid-cols-1 gap-4 sm:grid-cols-3'>
+            <h2 className='mt-16 text-xl font-bold md:text-2xl'>Social</h2>
+            <div className='mt-4 grid grid-cols-1 gap-4 sm:grid-cols-3 md:mt-6'>
                 {SocialLinks.map((link) => {
                     return (
                         <Link

diff --git a/components/blog/post-footer.tsx b/components/blog/post-footer.tsx
@@ -17,7 +17,7 @@ type Props = {
 export function Footer({ slug, title, source, author }: Props) {
     return (
         <div>
-            <div className='mt-10 flex w-full flex-col items-center gap-2 border-t pt-4 md:flex-row md:justify-between'>
+            <div className='mt-10 flex w-full flex-col items-center gap-4 border-t pt-4 md:flex-row md:justify-between'>
                 <div className='flex flex-row items-center gap-2'>
                     <Avatar className='size-6'>
                         <AvatarImage src={author.image} />

diff --git a/components/blog/post-header.tsx b/components/blog/post-header.tsx
@@ -42,7 +42,7 @@ export function Header({ createdAt, title, slug, summary, image, source, author,
             <motion.div initial={animation.hide} animate={animation.show}>
                 <h1 className='text-5xl font-bold'>{title}</h1>
                 <div className='mt-2 text-muted-foreground'>{summary}</div>
-                <div className='mt-8 flex flex-col items-center justify-between gap-4 lg:flex-row'>
+                <div className='mt-8 flex flex-col items-center justify-between gap-8 md:flex-row'>
                     <div className='flex flex-wrap items-center gap-2 text-xs sm:text-sm'>
                         <div className='flex flex-row items-center gap-2'>
                             <Avatar className='size-6'>

diff --git a/components/blog/post-toc.tsx b/components/blog/post-toc.tsx
@@ -18,7 +18,7 @@ const TableOfContents = (props: TableOfContentsProps) => {
     )
 
     return (
-        <div className='hidden lg:block'>
+        <div className=''>
             <div className='mb-4 flex items-center gap-4'>On this page</div>
             <div>
                 {toc.map((item) => {

diff --git a/components/blog/subscribe-form.tsx b/components/blog/subscribe-form.tsx
@@ -12,8 +12,8 @@ export function SubscribeForm({ className }: { className?: string }) {
                 {`
                      window.CustomSubstackWidget = {
                         substackUrl: "matteogiardino.substack.com",
-                        placeholder: "example@gmail.com",
-                        buttonText: "Iscriviti",
+                        placeholder: "la tua email",
+                        buttonText: "iscriviti",
                         theme: "custom",
                         colors: {
                             primary: "#FFFFFF",

diff --git a/components/mdx-content.tsx b/components/mdx-content.tsx
@@ -24,7 +24,7 @@ export async function Content({ title, body, url }: Props) {
                 <article className='w-full lg:w-[670px]'>
                     <Mdx code={body.code} />
                 </article>
-                <aside className='lg:min-w-[270px] lg:max-w-[270px]'>
+                <aside className='hidden lg:block lg:min-w-[270px] lg:max-w-[270px]'>
                     <div className='sticky top-24 will-change-[transform,opacity]'>
                         {toc && toc.length > 0 && <TableOfContents toc={toc} />}
                         <div className='mt-6 flex justify-start'>

diff --git a/config/links.ts b/config/links.ts
@@ -136,6 +136,6 @@ export const ContactLinks: ContactLinks = [
         name: 'Wezard',
         mailto: 'matteo@wezard.it',
         icon: 'email',
-        logo: '/images/brands/wezard-icon.webp',
+        logo: '/images/brands/wezard-icon.png',
     },
 ]