From f0885bebba679f7ba9c17acfa57ecfac3d88869d Mon Sep 17 00:00:00 2001
From: Pouria Delfanazari <pdelfan@gmail.com>
Date: Wed, 20 Dec 2023 20:16:26 -0800
Subject: [PATCH] Make app bar icons easier to click and add more space to
 account for home indicator

---
 src/components/actions/composeButton/ComposeButton.tsx | 2 +-
 src/components/actions/refetch/Refetch.tsx             | 4 ++--
 src/components/navigational/appBar/AppBar.tsx          | 2 +-
 src/components/navigational/navbar/NavItem.tsx         | 2 +-
 src/containers/NotificationsContainer.tsx              | 1 -
 5 files changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/components/actions/composeButton/ComposeButton.tsx b/src/components/actions/composeButton/ComposeButton.tsx
index 7b2686c2..a2de4468 100644
--- a/src/components/actions/composeButton/ComposeButton.tsx
+++ b/src/components/actions/composeButton/ComposeButton.tsx
@@ -23,7 +23,7 @@ export default function ComposeButton(props: Props) {
       {mode === "float" && (
         <button
           onClick={toggleComposer}
-          className={`z-40 p-3.5 rounded-full fixed md:hidden right-3 bottom-20 md:bottom-5 bg-primary text-white hover:bg-primary-dark outline-none ${
+          className={`z-40 p-3.5 rounded-full fixed md:hidden right-3 bottom-28 bg-primary text-white hover:bg-primary-dark outline-none ${
             show ? "translate-y-0 opacity-100" : "translate-y-36 opacity-0"
           } transition-all ease-in-out duration-500`}
         >
diff --git a/src/components/actions/refetch/Refetch.tsx b/src/components/actions/refetch/Refetch.tsx
index 506260d5..0834cb67 100644
--- a/src/components/actions/refetch/Refetch.tsx
+++ b/src/components/actions/refetch/Refetch.tsx
@@ -1,4 +1,4 @@
-"use client"
+"use client";
 
 import { useScrollContext } from "@/app/providers/scroll";
 import Button from "../button/Button";
@@ -19,7 +19,7 @@ export default function Refetch(props: Props) {
       icon="tabler:refresh"
       iconSize="text-2xl"
       iconColor="text-neutral-500 hover:text-neutral-600"
-      className={`z-40 p-3 rounded-full fixed bottom-20 md:bottom-5 ml-3 border border-neutral-300 bg-white hover:bg-neutral-50 hover:-rotate-180 ${
+      className={`z-40 p-3 rounded-full fixed bottom-28 ml-3 border border-neutral-300 bg-white hover:bg-neutral-50 hover:-rotate-180 ${
         show ? "translate-y-0 opacity-100" : "translate-y-36 opacity-0"
       } transition-all ease-in-out duration-500`}
     />
diff --git a/src/components/navigational/appBar/AppBar.tsx b/src/components/navigational/appBar/AppBar.tsx
index 16afc98d..e62a882a 100644
--- a/src/components/navigational/appBar/AppBar.tsx
+++ b/src/components/navigational/appBar/AppBar.tsx
@@ -10,7 +10,7 @@ export default function AppBar() {
 
   return (
     <nav
-      className={`flex justify-between py-4 px-6 border-t gap-6 fixed bottom-0 z-40 w-full md:hidden bg-white ${
+      className={`flex justify-between pb-8 pt-1 px-6 border-t gap-6 fixed bottom-0 z-40 w-full md:hidden bg-white ${
         show ? "translate-y-0 opacity-100" : "translate-y-36 opacity-0"
       } transition-all ease-in-out duration-500`}
     >
diff --git a/src/components/navigational/navbar/NavItem.tsx b/src/components/navigational/navbar/NavItem.tsx
index 818ec0c2..3ebe93cc 100644
--- a/src/components/navigational/navbar/NavItem.tsx
+++ b/src/components/navigational/navbar/NavItem.tsx
@@ -19,7 +19,7 @@ export default function NavItem(props: Props) {
     >
       <Icon
         icon={activeIcon}
-        className={`text-2xl md:text-3xl ${activeStyle}`}
+        className={`text-2xl md:text-3xl m-2 sm:m-0 ${activeStyle}`}
       />
       <span className={`hidden lg:inline text-lg font-medium ${activeStyle}`}>
         {title}
diff --git a/src/containers/NotificationsContainer.tsx b/src/containers/NotificationsContainer.tsx
index 0da6bfc0..2d58d986 100644
--- a/src/containers/NotificationsContainer.tsx
+++ b/src/containers/NotificationsContainer.tsx
@@ -6,7 +6,6 @@ import EndOfFeed from "@/components/feedback/endOfFeed/EndOfFeed";
 import FeedAlert from "@/components/feedback/feedAlert/FeedAlert";
 import usePreferences from "@/lib/hooks/bsky/actor/usePreferences";
 import useNotification from "@/lib/hooks/bsky/notification/useNotification";
-import { getContentFilter } from "@/lib/utils/feed";
 import { Icon } from "@iconify/react/dist/iconify.js";
 import { Fragment } from "react";