Adding main images.

.gitmodules

@@ -17,3 +17,4 @@
 [submodule "lemmy-stats-crawler"]
 	path = lemmy-stats-crawler
 	url = https://github.com/LemmyNet/lemmy-stats-crawler.git
+	branch = upgrade_deps_1

joinlemmy-translations

@@ -1 +1 @@
-Subproject commit 57cc965548287bbf508fbbe8aadf15b1449fb839
+Subproject commit b95dfdad19b866e86ed810d6f79c99e13066671e

lemmy-stats-crawler

@@ -1 +1 @@
-Subproject commit 788a3dd6e02fbe153e6d7c6315601ade15637f8c
+Subproject commit 0e5578aaf34e0293c489eea64dbe7444c12732ec

src/shared/components/app-definitions.ts

@@ -103,6 +103,23 @@ export const IOS_APPS: AppDetails[] = [
     ],
   },
   voyagerApp,
+  {
+    name: "Lunar",
+    description: "A Lemmy Client for iOS written in Swift and SwiftUI",
+    link: "https://github.com/mani-sh-reddy/Lunar",
+    icon: "/static/assets/images/lunar_logo.webp",
+    banner: "/static/assets/images/lunar_screen.webp",
+    links: [
+      {
+        link: "https://testflight.apple.com/join/GEFCCQTb",
+        icon: "appleinc",
+      },
+      {
+        link: "https://github.com/mani-sh-reddy/Lunar",
+        icon: "github",
+      },
+    ],
+  },
   {
     name: "Memmy",
     description:
@@ -121,23 +138,6 @@ export const IOS_APPS: AppDetails[] = [
       },
     ],
   },
-  {
-    name: "Lunar",
-    description: "A Lemmy Client for iOS written in Swift and SwiftUI",
-    link: "https://github.com/mani-sh-reddy/Lunar",
-    icon: "/static/assets/images/lunar_logo.webp",
-    banner: "/static/assets/images/lunar_screen.webp",
-    links: [
-      {
-        link: "https://testflight.apple.com/join/GEFCCQTb",
-        icon: "appleinc",
-      },
-      {
-        link: "https://github.com/mani-sh-reddy/Lunar",
-        icon: "github",
-      },
-    ],
-  },
 ];
 
 export const WEB_APPS: AppDetails[] = [
@@ -153,18 +153,6 @@ export const WEB_APPS: AppDetails[] = [
       },
     ],
   },
-  {
-    name: "lemmyBB",
-    description: "A lemmy frontend based on phpBB.",
-    link: "https://github.com/LemmyNet/lemmyBB",
-    banner: "/static/assets/images/lemmybb_2.webp",
-    links: [
-      {
-        link: "https://github.com/LemmyNet/lemmyBB",
-        icon: "github",
-      },
-    ],
-  },
   {
     name: "Photon",
     description: "A sleek lemmy web UI.",
@@ -178,6 +166,18 @@ export const WEB_APPS: AppDetails[] = [
       },
     ],
   },
+  {
+    name: "lemmyBB",
+    description: "A lemmy frontend based on phpBB.",
+    link: "https://github.com/LemmyNet/lemmyBB",
+    banner: "/static/assets/images/lemmybb_2.webp",
+    links: [
+      {
+        link: "https://github.com/LemmyNet/lemmyBB",
+        icon: "github",
+      },
+    ],
+  },
 ];
 
 export const CLI_APPS: AppDetails[] = [

src/shared/components/apps.tsx

@@ -73,8 +73,10 @@ const AppTitle = ({ title }) => <div className="text-2xl mb-3">{title}</div>;
 
 const MobileAppsBlock = () => (
   <div>
-    <AppTitle title={i18n.t("mobile_apps_for_ios_and_android")} />
+    <AppTitle title={i18n.t("mobile_apps_for_android")} />
-    <AppGrid apps={ANDROID_APPS.concat(IOS_APPS)} />
+    <AppGrid apps={ANDROID_APPS} />
+    <AppTitle title={i18n.t("mobile_apps_for_ios")} />
+    <AppGrid apps={IOS_APPS} />
   </div>
 );
 

src/shared/components/main.tsx

@@ -27,23 +27,23 @@ const TitleBlock = () => (
 
 const CarouselBlock = () => (
   <div>
-    <div className="carousel carousel-center p-4 space-x-4 rounded-box">
+    <div className="carousel carousel-center p-8 space-x-8 rounded-box">
-      <div id="item1" className="carousel-item w-10/12">
+      <div id="item1" className="carousel-item w-9/12">
         <img
-          src={"/static/assets/images/main_screenshot.webp"}
+          src={"/static/assets/images/main_screen_2.webp"}
-          className="rounded-box"
+          className="rounded-box border-8 border-secondary/[.15]"
         />
       </div>
-      <div id="item2" className="carousel-item w-10/12">
+      <div id="item2" className="carousel-item w-9/12">
         <img
-          src={"/static/assets/images/main_screenshot.webp"}
+          src={"/static/assets/images/main_screen_3.webp"}
-          className="rounded-box"
+          className="rounded-box border-8 border-primary/[.15]"
         />
       </div>
-      <div id="item3" className="carousel-item w-10/12">
+      <div id="item3" className="carousel-item w-9/12">
         <img
-          src={"/static/assets/images/main_screenshot.webp"}
+          src={"/static/assets/images/main_screen_1.webp"}
-          className="rounded-box"
+          className="rounded-box border-8 border-secondary/[.15]"
         />
       </div>
     </div>
@@ -100,7 +100,7 @@ const FeatureCard = ({ pic, title, subtitle, classes }) => (
     <figure className="p-4">
       <img src={pic} className="rounded-xl w-full object-fill min-h-[300px]" />
     </figure>
-    <div className="card-body">
+    <div className="card-body pt-0">
       <h2 className="card-title text-secondary">{title}</h2>
       <p className="text-sm text-gray-300">{subtitle}</p>
     </div>