diff --git a/app/(home-pages)/home/Actions/AccountSettings.tsx b/app/(home-pages)/home/Actions/AccountSettings.tsx
index 67df4f37..21c87b57 100644
--- a/app/(home-pages)/home/Actions/AccountSettings.tsx
+++ b/app/(home-pages)/home/Actions/AccountSettings.tsx
@@ -23,7 +23,9 @@ export const AccountSettings = (props: { entityID: string }) => {
       side={isMobile ? "top" : "right"}
       align={isMobile ? "center" : "start"}
       className={`max-w-xs w-[1000px] ${state === "theme" && "bg-white!"}`}
-      trigger={<ActionButton icon=<AccountSmall /> label="Settings" />}
+      trigger={
+        <ActionButton smallOnMobile icon=<AccountSmall /> label="Settings" />
+      }
     >
       {state === "general" ? (
         <GeneralSettings backToMenu={() => setState("menu")} />
diff --git a/app/(home-pages)/home/Actions/CreateNewButton.tsx b/app/(home-pages)/home/Actions/CreateNewButton.tsx
index 417c5dcd..454ae7ca 100644
--- a/app/(home-pages)/home/Actions/CreateNewButton.tsx
+++ b/app/(home-pages)/home/Actions/CreateNewButton.tsx
@@ -26,8 +26,9 @@ export const CreateNewLeafletButton = (props: {}) => {
         <ActionButton
           id="new-leaflet-button"
           primary
-          icon=<AddTiny className="m-1 shrink-0" />
+          icon=<AddTiny className="sm:m-1 shrink-0 sm:scale-100 scale-75" />
           label="New"
+          smallOnMobile
         />
       }
     >
diff --git a/app/(home-pages)/home/HomeLayout.tsx b/app/(home-pages)/home/HomeLayout.tsx
index 95d22e60..cadc40d5 100644
--- a/app/(home-pages)/home/HomeLayout.tsx
+++ b/app/(home-pages)/home/HomeLayout.tsx
@@ -18,7 +18,6 @@ import {
   DashboardLayout,
   DashboardState,
   useDashboardState,
-  PageTitle,
 } from "components/PageLayouts/DashboardLayout";
 import { Actions } from "./Actions/Actions";
 import { GetLeafletDataReturnType } from "app/api/rpc/[command]/get_leaflet_data";
@@ -29,7 +28,6 @@ import {
   HomeEmptyState,
   PublicationBanner,
 } from "./HomeEmpty/HomeEmpty";
-import { PublicationNavigation } from "components/ActionBar/Publications";
 
 export type Leaflet = {
   added_at: string;
@@ -105,12 +103,7 @@ export const HomeLayout = (props: {
           ),
         },
       }}
-      pageTitle={
-        <PageTitle
-          pageTitle={"Home"}
-          controls={<PublicationNavigation currentPage="home" />}
-        />
-      }
+      pageTitle="Home"
     />
   );
 };
diff --git a/app/(home-pages)/looseleafs/LooseleafsLayout.tsx b/app/(home-pages)/looseleafs/LooseleafsLayout.tsx
index 6c2c982d..c389d6e4 100644
--- a/app/(home-pages)/looseleafs/LooseleafsLayout.tsx
+++ b/app/(home-pages)/looseleafs/LooseleafsLayout.tsx
@@ -1,8 +1,5 @@
 "use client";
-import {
-  DashboardLayout,
-  PageTitle,
-} from "components/PageLayouts/DashboardLayout";
+import { DashboardLayout } from "components/PageLayouts/DashboardLayout";
 import { useState } from "react";
 import { useDebouncedEffect } from "src/hooks/useDebouncedEffect";
 import { Fact, PermissionToken } from "src/replicache";
@@ -13,7 +10,6 @@ import { useIdentityData } from "components/IdentityProvider";
 import useSWR from "swr";
 import { getHomeDocs } from "../home/storage";
 import { Leaflet, LeafletList } from "../home/HomeLayout";
-import { PublicationNavigation } from "components/ActionBar/Publications";
 
 export const LooseleafsLayout = (props: {
   entityID: string | null;
@@ -51,12 +47,7 @@ export const LooseleafsLayout = (props: {
           ),
         },
       }}
-      pageTitle={
-        <PageTitle
-          pageTitle={"Looseleafs"}
-          controls={<PublicationNavigation currentPage="looseleafs" />}
-        />
-      }
+      pageTitle="Looseleafs"
     />
   );
 };
diff --git a/app/lish/[did]/[publication]/dashboard/Actions.tsx b/app/lish/[did]/[publication]/dashboard/Actions.tsx
index ba945f35..92a7b9de 100644
--- a/app/lish/[did]/[publication]/dashboard/Actions.tsx
+++ b/app/lish/[did]/[publication]/dashboard/Actions.tsx
@@ -38,6 +38,7 @@ function PublicationShareButton() {
           icon=<ShareSmall />
           label="Share"
           onClick={() => {}}
+          smallOnMobile
         />
       }
     >
diff --git a/app/lish/[did]/[publication]/dashboard/DraftList.tsx b/app/lish/[did]/[publication]/dashboard/DraftList.tsx
index ac78e380..49ff4514 100644
--- a/app/lish/[did]/[publication]/dashboard/DraftList.tsx
+++ b/app/lish/[did]/[publication]/dashboard/DraftList.tsx
@@ -1,6 +1,5 @@
 "use client";
 
-import { NewDraftSecondaryButton } from "./NewDraftButton";
 import React from "react";
 import {
   usePublicationData,
diff --git a/app/lish/[did]/[publication]/dashboard/NewDraftButton.tsx b/app/lish/[did]/[publication]/dashboard/NewDraftButton.tsx
index 915fa734..a24652ba 100644
--- a/app/lish/[did]/[publication]/dashboard/NewDraftButton.tsx
+++ b/app/lish/[did]/[publication]/dashboard/NewDraftButton.tsx
@@ -16,8 +16,9 @@ export function NewDraftActionButton(props: { publication: string }) {
         let newLeaflet = await createPublicationDraft(props.publication);
         router.push(`/${newLeaflet}`);
       }}
-      icon=<AddTiny className="m-1 shrink-0" />
-      label="New Draft"
+      icon=<AddTiny className="sm:m-1 shrink-0 sm:scale-100 scale-75" />
+      smallOnMobile
+      label="Draft"
     />
   );
 }
diff --git a/app/lish/[did]/[publication]/dashboard/PublicationDashboard.tsx b/app/lish/[did]/[publication]/dashboard/PublicationDashboard.tsx
index 505092e4..0821c232 100644
--- a/app/lish/[did]/[publication]/dashboard/PublicationDashboard.tsx
+++ b/app/lish/[did]/[publication]/dashboard/PublicationDashboard.tsx
@@ -8,12 +8,10 @@ import { PublishedPostsList } from "./PublishedPostsLists";
 import { PublicationSubscribers } from "./PublicationSubscribers";
 import {
   DashboardLayout,
-  PageTitle,
   PublicationDashboardControls,
 } from "components/PageLayouts/DashboardLayout";
 import { useDebouncedEffect } from "src/hooks/useDebouncedEffect";
 import { type NormalizedPublication } from "src/utils/normalizeRecords";
-import { PublicationNavigation } from "components/ActionBar/Publications";
 
 export default function PublicationDashboard({
   publication,
@@ -78,17 +76,7 @@ export default function PublicationDashboard({
       actions={<Actions publication={publication.uri} />}
       currentPage="pub"
       publication={publication.uri}
-      pageTitle={
-        <PageTitle
-          pageTitle={record.name}
-          controls={
-            <PublicationNavigation
-              currentPage="pub"
-              currentPubUri={publication.uri}
-            />
-          }
-        />
-      }
+      pageTitle={record.name}
     />
   );
 }
diff --git a/app/lish/[did]/[publication]/dashboard/settings/PublicationSettings.tsx b/app/lish/[did]/[publication]/dashboard/settings/PublicationSettings.tsx
index 0b85e548..92f72613 100644
--- a/app/lish/[did]/[publication]/dashboard/settings/PublicationSettings.tsx
+++ b/app/lish/[did]/[publication]/dashboard/settings/PublicationSettings.tsx
@@ -34,6 +34,7 @@ export function PublicationSettingsButton(props: { publication: string }) {
           id="pub-settings-button"
           icon=<SettingsSmall />
           label="Settings"
+          smallOnMobile
         />
       }
     >
diff --git a/components/ActionBar/ActionButton.tsx b/components/ActionBar/ActionButton.tsx
index 5355a62c..6a4ebd46 100644
--- a/components/ActionBar/ActionButton.tsx
+++ b/components/ActionBar/ActionButton.tsx
@@ -18,6 +18,7 @@ export const ActionButton = (
     className?: string;
     subtext?: string;
     labelOnMobile?: boolean;
+    smallOnMobile?: boolean;
     z?: boolean;
   },
 ) => {
@@ -29,6 +30,7 @@ export const ActionButton = (
     secondary,
     nav,
     labelOnMobile,
+    smallOnMobile,
     subtext,
     className,
     ...buttonProps
@@ -53,14 +55,15 @@ export const ActionButton = (
       className={`
       actionButton relative font-bold
       rounded-md border
-      flex gap-2 items-start sm:justify-start justify-center
+      flex gap-2 items-center justify-start
       p-1 sm:mx-0
       ${showLabelOnMobile && "sm:w-full w-max"}
+      ${smallOnMobile && "sm:text-base text-sm py-0 sm:py-1 sm:h-fit h-6"}
       ${
         primary
-          ? "bg-accent-1 border-accent-1 text-accent-2 transparent-outline sm:hover:outline-accent-contrast focus:outline-accent-1 outline-offset-1 mx-1 first:ml-0"
+          ? "bg-accent-1 border-accent-1 text-accent-2 transparent-outline sm:hover:outline-accent-contrast focus:outline-accent-1 outline-offset-1 "
           : secondary
-            ? " bg-bg-page border-accent-contrast text-accent-contrast transparent-outline focus:outline-accent-contrast sm:hover:outline-accent-contrast outline-offset-1 mx-1 first:ml-0"
+            ? " bg-bg-page border-accent-contrast text-accent-contrast transparent-outline focus:outline-accent-contrast sm:hover:outline-accent-contrast outline-offset-1"
             : nav
               ? "border-transparent text-secondary sm:hover:border-border justify-start! max-w-full"
               : "border-transparent text-accent-contrast sm:hover:border-accent-contrast"
@@ -71,7 +74,7 @@ export const ActionButton = (
     >
       <div className="shrink-0 flex flex-row gap-0.5">{icon}</div>
       <div
-        className={`flex flex-col ${subtext && "leading-snug"} max-w-full min-w-0  ${sidebar.open ? "block" : showLabelOnMobile ? "sm:hidden block" : "hidden"}`}
+        className={`flex flex-col ${subtext && "leading-snug"} max-w-full min-w-0 mr-1  ${sidebar.open ? "block" : showLabelOnMobile ? "sm:hidden block" : "hidden"}`}
       >
         <div className="truncate text-left">{label}</div>
         {subtext && (
@@ -83,3 +86,10 @@ export const ActionButton = (
     </button>
   );
 };
+
+// ok currently in the middle of making the actions on home, looseleaf, and pub appear at the top by the page title 
+// i then need to find a good place for the publication list in the footer 
+// but first i really need to refactor action button
+// 1) make a primary variant
+// 2) make a secondary variant 
+// 
\ No newline at end of file
diff --git a/components/PageLayouts/DashboardLayout.tsx b/components/PageLayouts/DashboardLayout.tsx
index c33256f5..f578e73b 100644
--- a/components/PageLayouts/DashboardLayout.tsx
+++ b/components/PageLayouts/DashboardLayout.tsx
@@ -141,8 +141,8 @@ export function DashboardLayout<
   currentPage: navPages;
   publication?: string;
   profileDid?: string;
-  actions: React.ReactNode;
-  pageTitle?: React.ReactNode;
+  actions?: React.ReactNode;
+  pageTitle?: string;
 }) {
   const searchParams = useSearchParams();
   const tabParam = searchParams.get("tab");
@@ -189,7 +189,9 @@ export function DashboardLayout<
           ref={ref}
           id="home-content"
         >
-          {props.pageTitle}
+          {props.pageTitle && (
+            <PageTitle pageTitle={props.pageTitle} actions={props.actions} />
+          )}
 
           {Object.keys(props.tabs).length <= 1 && !controls ? null : (
             <>
@@ -250,11 +252,6 @@ export function DashboardLayout<
             currentPublicationUri={props.publication}
             currentProfileDid={props.profileDid}
           />
-          {props.actions && (
-            <div className="place-self-end flex flex-row-reverse gap-2 ">
-              {props.actions}
-            </div>
-          )}
         </Footer>
       </div>
     </DashboardIdContext.Provider>
@@ -263,7 +260,7 @@ export function DashboardLayout<
 
 export const PageTitle = (props: {
   pageTitle: string;
-  controls: React.ReactNode;
+  actions: React.ReactNode;
 }) => {
   return (
     <MediaContents
@@ -271,7 +268,8 @@ export const PageTitle = (props: {
       className="flex justify-between items-center px-1 mt-1 -mb-1 w-full "
     >
       <h4 className="grow truncate">{props.pageTitle}</h4>
-      <div className="shrink-0 h-6">{props.controls}</div>
+      <div className="flex flex-row-reverse! gap-1">{props.actions}</div>
+      {/* <div className="shrink-0 h-6">{props.controls}</div> */}
     </MediaContents>
   );
 };