Some More Changes

src/app/(app)/page.tsx

@@ -135,4 +135,24 @@ function Mobile() {
     );
 }
 
-export default Mobile;
+function Web() {
+	return (
+		<main className="flex flex-col gap-[32px] my-20 row-start-2 items-center mt-10 text-white">
+			<img
+				src="/drinkhappylogo.png"
+				alt="Drink Happy Logo Image"
+				className="h-auto mx-auto my-auto w-3/4 lg:w-1/3"
+			/>
+			<h1 className="text-3xl sm:text-4xl font-bold tracking-[-.01em] text-center sm:text-left">
+				Welcome to Drink Happy!
+			</h1>
+		</main>
+	);
+}
+
+export default function Home() {
+	const { isMobile, isSafari } = useDevice();
+
+	if(isMobile && isSafari) return Mobile();
+	else return Web();
+}

src/lib/components/Post.tsx

@@ -91,11 +91,11 @@ export default function Post({
             )}
 
             {/* Post Actions */}
-            <div className="flex gap-4 items-center">
+            <div className="flex flex-col gap-4 items-center">
                 <button
                     onClick={onLike}
                     disabled={!allowReactions} // Disable button if allowReactions is false
-                    className={`px-3 py-1 rounded text-sm ${
+                    className={`px-3 py-1 w-full rounded text-sm ${
                         allowReactions
                             ? "bg-success-600 hover:bg-primary-600 text-white"
                             : "bg-gray-500 text-gray-300 cursor-not-allowed"
@@ -106,7 +106,7 @@ export default function Post({
                 <button
                     onClick={onWarning}
                     disabled={!allowReactions} // Disable button if allowReactions is false
-                    className={`px-3 py-1 rounded text-sm ${
+                    className={`px-3 py-1 w-full rounded text-sm ${
                         allowReactions
                             ? "bg-primary-500 hover:bg-red-600 text-white"
                             : "bg-gray-500 text-gray-300 cursor-not-allowed"