diff --git a/app/(home-pages)/home/Actions/Actions.tsx b/app/(home-pages)/home/Actions/Actions.tsx
index e711d40e..6720edc0 100644
--- a/app/(home-pages)/home/Actions/Actions.tsx
+++ b/app/(home-pages)/home/Actions/Actions.tsx
@@ -5,7 +5,6 @@ import { HelpButton } from "app/[leaflet_id]/actions/HelpButton";
 import { AccountSettings } from "./AccountSettings";
 import { useIdentityData } from "components/IdentityProvider";
 import { useReplicache } from "src/replicache";
-import { LoginActionButton } from "components/LoginButton";
 
 export const Actions = () => {
   let { identity } = useIdentityData();
diff --git a/app/(home-pages)/home/LoggedOutWarning.tsx b/app/(home-pages)/home/LoggedOutWarning.tsx
deleted file mode 100644
index b4ca4955..00000000
--- a/app/(home-pages)/home/LoggedOutWarning.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-"use client";
-import { useIdentityData } from "components/IdentityProvider";
-import { LoginButton } from "components/LoginButton";
-
-export const LoggedOutWarning = (props: {}) => {
-  let { identity } = useIdentityData();
-  if (identity) return null;
-  return (
-    <div
-      className={`
-      homeWarning  z-10 shrink-0
-      bg-bg-page rounded-md
-      absolute bottom-16 left-2 right-2
-      sm:static sm:mr-1 sm:ml-6 sm:mt-6 border border-border-light`}
-    >
-      <div className="px-2 py-1 text-sm text-tertiary flex sm:flex-row flex-col sm:gap-4 gap-1 items-center sm:justify-between">
-        <p className="font-bold">
-          Log in to collect all your Leaflets and access them on multiple
-          devices
-        </p>
-        <LoginButton />
-      </div>
-    </div>
-  );
-};
diff --git a/app/lish/[did]/[publication]/[rkey]/PostPubInfo.tsx b/app/lish/[did]/[publication]/[rkey]/PostPubInfo.tsx
index 8f17b33d..ec7d295c 100644
--- a/app/lish/[did]/[publication]/[rkey]/PostPubInfo.tsx
+++ b/app/lish/[did]/[publication]/[rkey]/PostPubInfo.tsx
@@ -6,7 +6,7 @@ export const dummy = {
     loggedIn: true,
     email: "thisiscelinepark@gmail.com",
     handle: "cozylittle.house",
-    subscribed: true,
+    subscribed: false,
   },
 };
 
diff --git a/app/lish/[did]/[publication]/page.tsx b/app/lish/[did]/[publication]/page.tsx
index 260fbd65..15ebe3f3 100644
--- a/app/lish/[did]/[publication]/page.tsx
+++ b/app/lish/[did]/[publication]/page.tsx
@@ -23,7 +23,10 @@ import {
 } from "src/utils/normalizeRecords";
 import { getFirstParagraph } from "src/utils/getFirstParagraph";
 import { FontLoader } from "components/FontLoader";
-import { SubscribeInput } from "components/Subscribe/SubscribeButton";
+import {
+  SubscribeButton,
+  SubscribeInput,
+} from "components/Subscribe/SubscribeButton";
 import { dummy } from "./[rkey]/PostPubInfo";
 
 export default async function Publication(props: {
@@ -105,13 +108,15 @@ export default async function Publication(props: {
                     handle={profile.handle}
                   />
                 )}
-                <div className="sm:pt-4 pt-4">
-                  <SubscribeWithBluesky
+                <div className="sm:pt-4 pt-4 max-w-sm mx-auto w-full">
+                  <SubscribeInput {...dummy} />
+
+                  {/*<SubscribeWithBluesky
                     base_url={getPublicationURL(publication)}
                     pubName={publication.name}
                     pub_uri={publication.uri}
                     subscribers={publication.publication_subscriptions}
-                  />
+                  />*/}
                 </div>
               </div>
               <div className="publicationPostList w-full flex flex-col gap-4">
diff --git a/components/LoginButton.tsx b/components/LoginButton.tsx
index f05eaad3..12b62d42 100644
--- a/components/LoginButton.tsx
+++ b/components/LoginButton.tsx
@@ -6,6 +6,11 @@ import { ButtonPrimary } from "./Buttons";
 import { ActionButton } from "./ActionBar/ActionButton";
 import { AccountSmall } from "./Icons/AccountSmall";
 import { useIsMobile } from "src/hooks/isMobile";
+import { HandleInput } from "./Subscribe/HandleSubscribe";
+import { EmailInput } from "./Subscribe/EmailSubscribe";
+import { useState } from "react";
+import { GoToArrow } from "./Icons/GoToArrow";
+import { ToggleGroup } from "./ToggleGroup";
 
 export function LoginButton() {
   let identityData = useIdentityData();
@@ -28,16 +33,56 @@ export function LoginActionButton() {
   let identityData = useIdentityData();
   if (identityData.identity) return null;
   let isMobile = useIsMobile();
+  let [state, setState] = useState<"log in" | "sign up" | "email log in">(
+    "log in",
+  );
   return (
     <Popover
       asChild
       side={isMobile ? "top" : "right"}
       align={isMobile ? "center" : "start"}
+      className="flex flex-col gap-2"
       trigger={
         <ActionButton secondary icon={<AccountSmall />} label="Sign In" />
       }
     >
-      <LoginForm text="Save your Leaflets and access them on multiple devices!" />
+      <ToggleGroup
+        value={state === "email log in" ? "log in" : state}
+        onChange={setState}
+        options={[
+          { value: "log in", label: "Log In" },
+          { value: "sign up", label: "Sign Up" },
+        ]}
+      />
+      {state === "log in" ? (
+        <>
+          <h3>Atmospheric handle</h3>
+          <HandleInput className="h-10!" action="login" />
+          <hr className="border-border-light" />
+          <button
+            onClick={() => {
+              setState("email log in");
+            }}
+          >
+            log in with email
+          </button>
+        </>
+      ) : state === "email log in" ? (
+        <>
+          <EmailInput action="login" />
+          <hr className="border-border-light" />
+          <button
+            onClick={() => {
+              setState("log in");
+            }}
+          >
+            log in with atmosphere
+          </button>
+        </>
+      ) : (
+        <>heckin make a bluesky account yo</>
+      )}
+      {/*<LoginForm text="Save your Leaflets and access them on multiple devices!" />*/}
     </Popover>
   );
 }
diff --git a/components/Subscribe/EmailSubscribe.tsx b/components/Subscribe/EmailSubscribe.tsx
index 2e7e6cf2..c8d9cc9d 100644
--- a/components/Subscribe/EmailSubscribe.tsx
+++ b/components/Subscribe/EmailSubscribe.tsx
@@ -5,30 +5,33 @@ import { ButtonPrimary } from "components/Buttons";
 import { Input } from "components/Input";
 import { Modal } from "components/Modal";
 import { useState } from "react";
-import { HandleInputandOAuth, UniversalHandleInfo } from "./HandleSubscribe";
 import { EmailSubscribeSuccess } from "./EmailSubscribeSuccess";
+import { GoToArrow } from "components/Icons/GoToArrow";
+import { useToaster } from "components/Toast";
 
-export const EmailSubscribe = (props: {
-  link?: boolean;
+export const EmailInput = (props: {
+  action: "link" | "subscribe" | "login";
   autoFocus?: boolean;
-  user: {
+  user?: {
     loggedIn: boolean;
     email: string | undefined;
     handle: string | undefined;
   };
 }) => {
   let [value, setValue] = useState(
-    props.user.loggedIn && props.user.email ? props.user.email : "",
+    props.user?.loggedIn && props.user?.email ? props.user?.email : "",
   );
   let [state, setState] = useState<"confirm" | "success">(
-    props.user.loggedIn && props.user.email ? "success" : "confirm",
+    props.user?.loggedIn && props.user?.email ? "success" : "confirm",
   );
+  let toaster = useToaster();
+
   return (
     <div className="relative input-with-border flex gap-2 w-full items-center mx-auto">
       <Input
         autoFocus={props.autoFocus}
         className={`appearance-none! outline-none! w-full pr-22 `}
-        disabled={props.user.loggedIn}
+        disabled={props.user?.loggedIn}
         placeholder="email@example.com"
         size={0}
         value={value}
@@ -37,26 +40,42 @@ export const EmailSubscribe = (props: {
       <Modal
         asChild
         trigger={
-          <div className="absolute top-0 bottom-0 right-[4px] flex items-center">
-            <ButtonPrimary
-              compact
-              className="leading-tight! outline-none! text-sm!"
-            >
-              {props.link ? "Link" : "Subscribe"}
-            </ButtonPrimary>
+          <div className="absolute top-0 bottom-0 right-[4px] flex items-center text-accent-contrast">
+            {props.action === "login" ? (
+              <GoToArrow />
+            ) : (
+              <ButtonPrimary
+                compact
+                className="leading-tight! outline-none! text-sm!"
+              >
+                {props.action === "link" ? "Link" : "Subscribe"}
+              </ButtonPrimary>
+            )}
           </div>
         }
       >
         {state === "success" ? (
           <EmailSubscribeSuccess
-            email={props.user.email}
-            handle={props.user.handle}
+            email={props.user?.email}
+            handle={props.user?.handle}
           />
         ) : (
-          <EmailSubscribeConfirm
-            emailInputValue={value}
+          <EmailConfirm
+            emailValue={value}
             onSubmit={() => {
-              setState("success");
+              props.action === "subscribe"
+                ? setState("success")
+                : props.action === "link"
+                  ? toaster({
+                      content: (
+                        <div className="font-bold">Linked your email!</div>
+                      ),
+                      type: "success",
+                    })
+                  : toaster({
+                      content: <div className="font-bold">Welcome back!</div>,
+                      type: "success",
+                    });
             }}
           />
         )}
@@ -65,8 +84,8 @@ export const EmailSubscribe = (props: {
   );
 };
 
-const EmailSubscribeConfirm = (props: {
-  emailInputValue: string;
+export const EmailConfirm = (props: {
+  emailValue: string;
   onSubmit: () => void;
 }) => {
   let inputClassName = "input-with-border text-2xl w-8 h-12 text-center";
@@ -74,13 +93,12 @@ const EmailSubscribeConfirm = (props: {
     <div className="flex flex-col text-center max-w-sm pb-2">
       <h3>Confirm your email</h3>
       Enter the confirmation code sent to <br />
-      <div className="italic min-w-0 truncate">{props.emailInputValue}</div>
+      <div className="italic min-w-0 truncate">{props.emailValue}</div>
       <OneTimePasswordField.Root
         autoSubmit
         validationType="alphanumeric"
         onAutoSubmit={() => {
           props.onSubmit();
-          console.log("hello?");
         }}
       >
         <div className="flex gap-1 pt-4 w-full justify-center">
diff --git a/components/Subscribe/EmailSubscribeSuccess.tsx b/components/Subscribe/EmailSubscribeSuccess.tsx
index 64169518..5dc339a8 100644
--- a/components/Subscribe/EmailSubscribeSuccess.tsx
+++ b/components/Subscribe/EmailSubscribeSuccess.tsx
@@ -20,3 +20,11 @@ export const EmailSubscribeSuccess = (props: {
     </div>
   );
 };
+
+export const EmailLogInSuccess = (props: {}) => {
+  return (
+    <div className="flex flex-col text-center justify-center p-4 text-secondary max-w-md">
+      <h2 className="text-primary pb-1">Welcome!</h2>
+    </div>
+  );
+};
diff --git a/components/Subscribe/HandleSubscribe.tsx b/components/Subscribe/HandleSubscribe.tsx
index 8a7f7154..ea49bdee 100644
--- a/components/Subscribe/HandleSubscribe.tsx
+++ b/components/Subscribe/HandleSubscribe.tsx
@@ -14,6 +14,7 @@ import {
 } from "./Logos";
 
 import { Separator } from "components/Layout";
+import { GoToArrow } from "components/Icons/GoToArrow";
 
 export const SubscribeWithHandle = (props: {
   autoFocus?: boolean;
@@ -39,7 +40,7 @@ export const SubscribeWithHandle = (props: {
       <div className="max-w-sm mx-auto w-full ">
         <HandleInput autoFocus={props.autoFocus} />
         <div className="flex gap-2 justify-center items-center mx-auto pt-0.5 ">
-          <UniversalHandleInfo />
+          <AtmosphericHandleInfo />
           <Separator classname="h-3! border-accent-contrast!" />
           <div className="text-sm text-accent-contrast font-bold">Create</div>
         </div>
@@ -61,36 +62,50 @@ export const LinkHandle = (props: { compact?: boolean }) => {
         <div className="text-tertiary">
           to comment, recommend, and see what your friends are reading
         </div>
-        <UniversalHandleInfo />
+        <AtmosphericHandleInfo />
       </div>
       <HandleInputandOAuth link compact />
     </div>
   );
 };
 
-export const HandleInput = (props: { autoFocus?: boolean; link?: boolean }) => {
+export const HandleInput = (props: {
+  autoFocus?: boolean;
+  action?: "subscribe" | "link" | "login";
+  className?: string;
+}) => {
   let [handleValue, setHandleValue] = useState("");
   return (
-    <div className="handleInput input-with-border relative pl-0! py-0! flex gap-0 w-full">
-      <div className="border-r border-border text-tertiary text-center w-8 shrink-0 mr-2">
+    <div
+      className={`handleInput input-with-border relative pl-0! py-0! flex gap-0 w-full ${props.className}`}
+    >
+      <div className="text-tertiary text-center w-8 shrink-0 mr-2 flex justify-center h-full items-center">
         @
       </div>
       <Input
         autoFocus={props.autoFocus}
         className={`appearance-none! outline-none! w-full py-0.5 pr-22`}
-        placeholder="universal.handle"
+        placeholder="atmosphere.handle"
         size={0}
         value={handleValue}
         onChange={(e) => setHandleValue(e.target.value)}
       />
 
       <div className="absolute top-0 bottom-0 right-[4px] flex items-center">
-        <ButtonPrimary
-          compact
-          className="leading-tight! outline-none! text-sm!"
-        >
-          {props.link ? "Link" : "Subscribe"}
-        </ButtonPrimary>
+        {props.action === "login" ? (
+          <GoToArrow />
+        ) : (
+          <ButtonPrimary
+            compact
+            className="leading-tight! outline-none! text-sm!"
+          >
+            {props.action === "link"
+              ? "Link"
+              : props.action === "subscribe"
+                ? "Subscribe"
+                : null}
+          </ButtonPrimary>
+        )}
       </div>
     </div>
   );
@@ -102,7 +117,7 @@ export const HandleInputandOAuth = (props: {
 }) => {
   return (
     <div className="handleInputAndOAuth flex flex-col">
-      <HandleInput link={props.link} />
+      <HandleInput action="link" />
       <div
         className={`${props.compact ? "mt-1 mb-2 text-xs" : "text-sm mt-2 mb-3"} w-full flex gap-2 items-center`}
       >
@@ -143,7 +158,7 @@ export const AtSubscribeSuccess = (props: {}) => {
   );
 };
 
-export const UniversalHandleInfo = (props: { trigger?: React.ReactNode }) => {
+export const AtmosphericHandleInfo = (props: { trigger?: React.ReactNode }) => {
   return (
     <Popover
       className="z-100! max-w-sm flex flex-col gap-2"
diff --git a/components/Subscribe/ManageSubscribe.tsx b/components/Subscribe/ManageSubscribe.tsx
index 14b28888..3c038bc9 100644
--- a/components/Subscribe/ManageSubscribe.tsx
+++ b/components/Subscribe/ManageSubscribe.tsx
@@ -3,7 +3,7 @@ import { CheckTiny } from "components/Icons/CheckTiny";
 import { GoToArrow } from "components/Icons/GoToArrow";
 import { Modal } from "components/Modal";
 import { LinkHandle } from "./HandleSubscribe";
-import { EmailSubscribe } from "./EmailSubscribe";
+import { EmailInput } from "./EmailSubscribe";
 
 export const ManageSubscription = (props: {
   newsletterMode: boolean;
@@ -43,7 +43,10 @@ export const ManageSubscription = (props: {
         {props.user.handle && (
           <div className={prefClassName}>
             <div className="flex flex-col leading-snug">
-              Linked Handle {props.user.handle}
+              Linked Handle
+              <p className="text-tertiary font-normal italic">
+                {props.user.handle}
+              </p>
             </div>
           </div>
         )}
@@ -65,7 +68,7 @@ export const ManageSubscription = (props: {
                 to get updates right to your inbox!
               </div>
             </div>
-            <EmailSubscribe link {...props} />
+            <EmailInput action="link" {...props} />
           </div>
         ) : null}
         {!props.user.handle ? (
diff --git a/components/Subscribe/SubscribeButton.tsx b/components/Subscribe/SubscribeButton.tsx
index d1f78b9a..253576f4 100644
--- a/components/Subscribe/SubscribeButton.tsx
+++ b/components/Subscribe/SubscribeButton.tsx
@@ -1,5 +1,5 @@
 import { SubscribeWithHandle } from "./HandleSubscribe";
-import { EmailSubscribe } from "./EmailSubscribe";
+import { EmailInput } from "./EmailSubscribe";
 import { Modal } from "components/Modal";
 import { ButtonPrimary } from "components/Buttons";
 import { PostPubInfo } from "app/lish/[did]/[publication]/[rkey]/PostPubInfo";
@@ -48,7 +48,13 @@ export const SubscribeInput = (props: {
     return <ManageSubscription {...props} />;
   }
   if (props.newsletterMode) {
-    return <EmailSubscribe user={props.user} autoFocus={props.autoFocus} />;
+    return (
+      <EmailInput
+        action="subscribe"
+        user={props.user}
+        autoFocus={props.autoFocus}
+      />
+    );
   } else
     return (
       <SubscribeWithHandle user={props.user} autoFocus={props.autoFocus} />
diff --git a/components/ToggleGroup.tsx b/components/ToggleGroup.tsx
index ebf786ae..f671f52c 100644
--- a/components/ToggleGroup.tsx
+++ b/components/ToggleGroup.tsx
@@ -9,15 +9,15 @@ export function ToggleGroup<T extends string>(props: {
 }) {
   return (
     <div
-      className={`flex gap-1 p-1 bg-accent-1 rounded-lg text-sm ${props.className || ""}`}
+      className={`flex gap-1 p-1 bg-accent-1 rounded-lg text-sm w-fit ${props.className || ""}`}
     >
       {props.options.map((option) => (
         <button
           key={option.value}
           type="button"
-          className={`px-1 rounded-md ${
+          className={`px-1 rounded-md font-bold ${
             props.value === option.value
-              ? "bg-accent-2 font-bold text-accent-1"
+              ? "bg-accent-2  text-accent-1"
               : "bg-transparent text-accent-2"
           }
           ${props.optionClassName}