diff --git a/app/discover/SortedPublicationList.tsx b/app/discover/SortedPublicationList.tsx
index d2c4ce74..cb2f03ad 100644
--- a/app/discover/SortedPublicationList.tsx
+++ b/app/discover/SortedPublicationList.tsx
@@ -11,7 +11,7 @@ export function SortedPublicationList(props: {
 }) {
   let [order, setOrder] = useState(props.order);
   return (
-    <div className="discoverHeader flex flex-col items-center px-4">
+    <div className="discoverHeader flex flex-col items-center ">
       <SortButtons
         order={order}
         setOrder={(o) => {
diff --git a/components/ActionBar/Navigation.tsx b/components/ActionBar/Navigation.tsx
index 9df024fb..1a272067 100644
--- a/components/ActionBar/Navigation.tsx
+++ b/components/ActionBar/Navigation.tsx
@@ -89,7 +89,7 @@ const NavigationOptions = (props: {
   return (
     <>
       <HomeButton current={props.currentPage === "home"} />
-      <ReaderButton current={props.currentPage === "reader"} />
+      <ReaderButton current={props.currentPage === "discover"} />
       <hr className="border-border-light my-1" />
       <PublicationButtons currentPubUri={thisPublication?.uri} />
     </>
@@ -130,10 +130,8 @@ const ReaderButton = (props: { current?: boolean }) => {
         nav
         icon={<DiscoverSmall />}
         label="Discover"
-        subtext={
-          !props.current ? "Check out what others are writing!" : undefined
-        }
-        className={props.current ? "bg-border-light! border-border" : ""}
+        subtext={"Check out what others are writing!"}
+        className={props.current ? "bg-bg-page! border-border-light!" : ""}
       />
     </Link>
   );