a tool for shared writing and social publishing
1"use client";
2import { useIdentityData } from "components/IdentityProvider";
3import { LoginButton } from "components/LoginButton";
4
5export const LoggedOutWarning = (props: {}) => {
6 let { identity } = useIdentityData();
7 if (identity) return null;
8 return (
9 <div
10 className={`
11 homeWarning z-10 shrink-0
12 bg-bg-page rounded-md
13 absolute bottom-16 left-2 right-2
14 sm:static sm:mr-1 sm:ml-6 sm:mt-6 border border-border-light`}
15 >
16 <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">
17 <p className="font-bold">
18 Log in to collect all your Leaflets and access them on multiple
19 devices
20 </p>
21 <LoginButton />
22 </div>
23 </div>
24 );
25};