From 7a562a50c928e1ab8946bf9c226241faac858eaf Mon Sep 17 00:00:00 2001
From: Caner Akdas <canerakdas@gmail.com>
Date: Sat, 28 Dec 2024 21:05:12 +0300
Subject: [PATCH 1/5] chore: mobile layout and skeleton sizes

---
 .../components/Downloads/Release/BlogPostLink.tsx  |  6 ++----
 .../Downloads/Release/PlatformDropdown.tsx         |  2 +-
 .../Downloads/Release/PrebuiltDownloadButtons.tsx  | 14 +++++++++++---
 .../Downloads/Release/ReleaseCodeBox.tsx           |  2 +-
 4 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/apps/site/components/Downloads/Release/BlogPostLink.tsx b/apps/site/components/Downloads/Release/BlogPostLink.tsx
index d9d1f90d60aad..3082da9c3c5c8 100644
--- a/apps/site/components/Downloads/Release/BlogPostLink.tsx
+++ b/apps/site/components/Downloads/Release/BlogPostLink.tsx
@@ -3,16 +3,14 @@
 import type { FC, PropsWithChildren } from 'react';
 import { useContext } from 'react';
 
-import LinkWithArrow from '@/components/Downloads/Release/LinkWithArrow';
+import Link from '@/components/Link';
 import { ReleaseContext } from '@/providers/releaseProvider';
 
 const BlogPostLink: FC<PropsWithChildren> = ({ children }) => {
   const { release } = useContext(ReleaseContext);
   const version = release.versionWithPrefix;
 
-  return (
-    <LinkWithArrow href={`/blog/release/${version}`}>{children}</LinkWithArrow>
-  );
+  return <Link href={`/blog/release/${version}`}>{children}</Link>;
 };
 
 export default BlogPostLink;
diff --git a/apps/site/components/Downloads/Release/PlatformDropdown.tsx b/apps/site/components/Downloads/Release/PlatformDropdown.tsx
index 6acb57beb0872..696ecb6076f1e 100644
--- a/apps/site/components/Downloads/Release/PlatformDropdown.tsx
+++ b/apps/site/components/Downloads/Release/PlatformDropdown.tsx
@@ -64,7 +64,7 @@ const PlatformDropdown: FC = () => {
       placeholder={t('layouts.download.dropdown.unknown')}
       ariaLabel={t('layouts.download.dropdown.installMethod')}
       onChange={platform => platform && release.setPlatform(platform)}
-      className="min-w-20"
+      className="min-w-28"
       inline={true}
     />
   );
diff --git a/apps/site/components/Downloads/Release/PrebuiltDownloadButtons.tsx b/apps/site/components/Downloads/Release/PrebuiltDownloadButtons.tsx
index 8be309c5f46da..e7ca0d7958833 100644
--- a/apps/site/components/Downloads/Release/PrebuiltDownloadButtons.tsx
+++ b/apps/site/components/Downloads/Release/PrebuiltDownloadButtons.tsx
@@ -30,12 +30,16 @@ const PrebuiltDownloadButtons: FC = () => {
     : '';
 
   return (
-    <div className="my-4 flex gap-2">
+    <div className="my-4 flex flex-col flex-wrap gap-2 sm:flex-row">
       <Skeleton
         loading={os === 'LOADING' || platform === ''}
         hide={OS_NOT_SUPPORTING_INSTALLERS.includes(os)}
       >
-        <Button href={installerUrl} size="small" className="min-w-56">
+        <Button
+          href={installerUrl}
+          size="small"
+          className="w-full min-w-56 sm:w-auto"
+        >
           <CloudArrowDownIcon />
 
           {t('layouts.download.buttons.installer', {
@@ -46,7 +50,11 @@ const PrebuiltDownloadButtons: FC = () => {
       </Skeleton>
 
       <Skeleton loading={os === 'LOADING' || platform === ''}>
-        <Button href={binaryUrl} size="small" className="min-w-56">
+        <Button
+          href={binaryUrl}
+          size="small"
+          className="w-full min-w-56 sm:w-auto"
+        >
           <CloudArrowDownIcon />
 
           {t('layouts.download.buttons.binary', {
diff --git a/apps/site/components/Downloads/Release/ReleaseCodeBox.tsx b/apps/site/components/Downloads/Release/ReleaseCodeBox.tsx
index 46701c5b17fa6..f3ffb8057cf62 100644
--- a/apps/site/components/Downloads/Release/ReleaseCodeBox.tsx
+++ b/apps/site/components/Downloads/Release/ReleaseCodeBox.tsx
@@ -111,7 +111,7 @@ const ReleaseCodeBox: FC = () => {
       )}
 
       <Skeleton loading={renderSkeleton}>
-        <CodeBox language={displayName} className="min-h-[16rem]">
+        <CodeBox language={displayName} className="min-h-[16.5rem]">
           <code dangerouslySetInnerHTML={{ __html: parsedSnippets }} />
         </CodeBox>
       </Skeleton>

From a03a2888d80aaf147051c03a23ea70238b713639 Mon Sep 17 00:00:00 2001
From: Caner Akdas <canerakdas@gmail.com>
Date: Sat, 28 Dec 2024 21:28:51 +0300
Subject: [PATCH 2/5] chore: layout on not-found page

---
 apps/site/app/[locale]/not-found.tsx  | 2 +-
 apps/site/layouts/GlowingBackdrop.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/site/app/[locale]/not-found.tsx b/apps/site/app/[locale]/not-found.tsx
index ec3a343628e52..9ab34ca5bbf2e 100644
--- a/apps/site/app/[locale]/not-found.tsx
+++ b/apps/site/app/[locale]/not-found.tsx
@@ -12,7 +12,7 @@ const NotFoundPage: FC = () => {
   const t = useTranslations();
 
   return (
-    <GlowingBackdropLayout>
+    <GlowingBackdropLayout kind="default">
       404
       <h1 className="special -mt-4 text-center">
         {t('layouts.error.notFound.title')}
diff --git a/apps/site/layouts/GlowingBackdrop.tsx b/apps/site/layouts/GlowingBackdrop.tsx
index 377eac2e18903..fa966404bd052 100644
--- a/apps/site/layouts/GlowingBackdrop.tsx
+++ b/apps/site/layouts/GlowingBackdrop.tsx
@@ -8,7 +8,7 @@ import WithNavBar from '@/components/withNavBar';
 import styles from './layouts.module.css';
 
 type GlowingBackdropLayoutProps = PropsWithChildren<{
-  kind?: 'home';
+  kind?: 'home' | 'default';
 }>;
 
 const GlowingBackdropLayout: FC<GlowingBackdropLayoutProps> = ({

From 980cacc1d6846b53d985bc756e068859fe507bf7 Mon Sep 17 00:00:00 2001
From: Caner Akdas <canerakdas@gmail.com>
Date: Sat, 28 Dec 2024 21:38:40 +0300
Subject: [PATCH 3/5] chore: mobile skeleton size

---
 .../components/Downloads/Release/PrebuiltDownloadButtons.tsx    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/site/components/Downloads/Release/PrebuiltDownloadButtons.tsx b/apps/site/components/Downloads/Release/PrebuiltDownloadButtons.tsx
index 6cf4cfeb71979..e7ca0d7958833 100644
--- a/apps/site/components/Downloads/Release/PrebuiltDownloadButtons.tsx
+++ b/apps/site/components/Downloads/Release/PrebuiltDownloadButtons.tsx
@@ -30,7 +30,7 @@ const PrebuiltDownloadButtons: FC = () => {
     : '';
 
   return (
-    <div className="my-4 flex flex-wrap gap-2">
+    <div className="my-4 flex flex-col flex-wrap gap-2 sm:flex-row">
       <Skeleton
         loading={os === 'LOADING' || platform === ''}
         hide={OS_NOT_SUPPORTING_INSTALLERS.includes(os)}

From 63946133315115ad86e875838f12c4c1b10c5fb2 Mon Sep 17 00:00:00 2001
From: Caner Akdas <canerakdas@gmail.com>
Date: Sat, 28 Dec 2024 23:19:40 +0300
Subject: [PATCH 4/5] chore: review updates

---
 .../Downloads/Release/PrebuiltDownloadButtons.tsx          | 2 +-
 apps/site/layouts/GlowingBackdrop.tsx                      | 7 +++----
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/apps/site/components/Downloads/Release/PrebuiltDownloadButtons.tsx b/apps/site/components/Downloads/Release/PrebuiltDownloadButtons.tsx
index e7ca0d7958833..5a943b0472a8b 100644
--- a/apps/site/components/Downloads/Release/PrebuiltDownloadButtons.tsx
+++ b/apps/site/components/Downloads/Release/PrebuiltDownloadButtons.tsx
@@ -30,7 +30,7 @@ const PrebuiltDownloadButtons: FC = () => {
     : '';
 
   return (
-    <div className="my-4 flex flex-col flex-wrap gap-2 sm:flex-row">
+    <div className="my-4 flex flex-col gap-2 sm:flex-row">
       <Skeleton
         loading={os === 'LOADING' || platform === ''}
         hide={OS_NOT_SUPPORTING_INSTALLERS.includes(os)}
diff --git a/apps/site/layouts/GlowingBackdrop.tsx b/apps/site/layouts/GlowingBackdrop.tsx
index fa966404bd052..a291865f640d8 100644
--- a/apps/site/layouts/GlowingBackdrop.tsx
+++ b/apps/site/layouts/GlowingBackdrop.tsx
@@ -11,10 +11,9 @@ type GlowingBackdropLayoutProps = PropsWithChildren<{
   kind?: 'home' | 'default';
 }>;
 
-const GlowingBackdropLayout: FC<GlowingBackdropLayoutProps> = ({
-  kind = 'home',
-  children,
-}) => (
+const GlowingBackdropLayout: FC<
+  PropsWithChildren<GlowingBackdropLayoutProps>
+> = ({ kind = 'home', children }) => (
   <>
     <WithNavBar />
     <div className={styles.centeredLayout}>

From 87068fcfd0ca56f65c94e04e35995d7ac5f08d05 Mon Sep 17 00:00:00 2001
From: Caner Akdas <canerakdas@gmail.com>
Date: Sat, 28 Dec 2024 23:28:32 +0300
Subject: [PATCH 5/5] chore: error page layout

---
 apps/site/app/[locale]/error.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/site/app/[locale]/error.tsx b/apps/site/app/[locale]/error.tsx
index 2a4d2e3431e71..79feae5ccf4c0 100644
--- a/apps/site/app/[locale]/error.tsx
+++ b/apps/site/app/[locale]/error.tsx
@@ -11,7 +11,7 @@ const ErrorPage: FC<{ error: Error }> = () => {
   const t = useTranslations();
 
   return (
-    <GlowingBackdropLayout>
+    <GlowingBackdropLayout kind="default">
       500
       <h1 className="special -mt-4 text-center">
         {t('layouts.error.internalServerError.title')}