Merge branch 'preview'

Author: pdelfan

src/components/actions/composeButton/ComposeButton.tsx

@@ -27,8 +27,10 @@ export default function ComposeButton(props: Props) {
           onClick={() => openComposer({ mention: userHandle })}
           className="z-40 p-3.5 rounded-full fixed md:hidden right-3 bottom-24 bg-primary text-white hover:bg-primary-dark outline-none ease-linear transition-all"
           style={{
-            opacity: canUpdate ? `${100 - (val ?? 0)}%` : "none",
-            transform: canUpdate ? `translateY(${val ?? 0}%)` : "none",
+            opacity: canUpdate ? `${100 - (val ?? 0)}%` : "100%",
+            transform: canUpdate
+              ? `translateY(${val ?? 0}%)`
+              : "translateY(0%)",
           }}
         >
           <RiQuillPenFill className="text-2xl" />

src/components/actions/refetch/Refetch.tsx

@@ -20,8 +20,8 @@ export default function Refetch(props: Props) {
       onClick={debouncedRefetch}
       className="z-40 p-3 rounded-full fixed bottom-24 md:bottom-8 ml-3 md:ml-[0.80rem] border border-neutral-300 bg-white hover:bg-neutral-50 hover:-rotate-180 ease-linear transition-all"
       style={{
-        opacity: canUpdate ? `${100 - (val ?? 0)}%` : "none",
-        transform: canUpdate ? `translateY(${val ?? 0}%)` : "none",
+        opacity: canUpdate ? `${100 - (val ?? 0)}%` : "100%",
+        transform: canUpdate ? `translateY(${val ?? 0}%)` : "translateY(0%)",
       }}
     >
       <LuRefreshCcw className="text-2xl text-neutral-500 hover:text-neutral-600" />

src/components/navigational/appBar/AppBar.tsx

@@ -30,8 +30,8 @@ export default function AppBar() {
     <nav
       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 overflow-auto ease-linear transition-all"
       style={{
-        opacity: canUpdate ? `${100 - (val ?? 0)}%` : "none",
-        transform: canUpdate ? `translateY(${val ?? 0}%)` : "none",
+        opacity: canUpdate ? `${100 - (val ?? 0)}%` : "100%",
+        transform: canUpdate ? `translateY(${val ?? 0}%)` : "translateY(0%)",
       }}
     >
       <NavItem

src/components/navigational/feedTabs/FeedTabs.tsx

@@ -35,8 +35,10 @@ export default function FeedTabs() {
       <div
         className={`bg-white border-x-0 border-t-0 border-b md:border md:rounded-t-2xl overflow-x-hidden hover:overflow-x-auto md:opacity-100 sticky top-[3.2rem] md:top-6 z-50 md:z-50 ease-linear transition-all`}
         style={{
-          opacity: canUpdate ? `${100 - (val ?? 0)}%` : "none",
-          transform: canUpdate ? `translateY(-${val ?? 0}%)` : "none",
+          opacity: canUpdate ? `${100 - (val ?? 0)}%` : "100%",
+          transform: canUpdate
+            ? `translateY(-${val ?? 0}%)`
+            : "translateY(-0%)",
         }}
       >
         {isFetching && <FeedTabsSkeleton />}

src/components/navigational/topBar/TopBar.tsx

@@ -21,8 +21,8 @@ export default function TopBar(props: Props) {
     <div
       className="flex justify-between bg-white border-b px-3 py-2.5 sticky md:hidden top-0 z-50 ease-linear transition-all"
       style={{
-        opacity: canUpdate ? `${100 - (val ?? 0)}%` : "none",
-        transform: canUpdate ? `translateY(-${val ?? 0}%)` : "none",
+        opacity: canUpdate ? `${100 - (val ?? 0)}%` : "100%",
+        transform: canUpdate ? `translateY(-${val ?? 0}%)` : "translateY(-0%)",
       }}
     >
       <Link