LumeWeb
/
web3browser.io
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: LumeWeb:1dcf53b92b483d4319068b55d198dec02127a255
Branches Tags
LumeWeb:master
LumeWeb:develop
LumeWeb:ditorodev
..
compare: LumeWeb:65e8d102312ded6e439629a7522c3a9c433d3c52
Branches Tags
LumeWeb:master
LumeWeb:develop
LumeWeb:ditorodev

No commits in common. "1dcf53b92b483d4319068b55d198dec02127a255" and "65e8d102312ded6e439629a7522c3a9c433d3c52" have entirely different histories.
1dcf53b92b ... 65e8d10231

2 changed files with 13 additions and 47 deletions
Show Stats Expand all files Collapse all files

43
src/components/Lume.tsx
View File

@ -1,41 +1,12 @@
import { import { LumeIdentity, LumeDashboard, LumeProvider } from "@lumeweb/sdk";
LumeIdentity,
LumeIdentityTrigger,
LumeDashboardTrigger,
LumeDashboard,
useLume,
LumeProvider,
} from "@lumeweb/sdk";
const Lume = () => {
const { isLoggedIn } = useLume();
return (
<>
<LumeIdentity>
<LumeIdentityTrigger asChild>
{isLoggedIn ? (
<LumeDashboard>
<LumeDashboardTrigger asChild>
<button className="ml-2 w-full rounded-full bg-[hsl(113,49%,55%)] text-black">
Check Status
</button>
</LumeDashboardTrigger>
</LumeDashboard>
) : (
<button className="ml-2 w-full rounded-full bg-[hsl(113,49%,55%)] text-black">
Login
</button>
)}
</LumeIdentityTrigger>
</LumeIdentity>
</>
);
};
export default function () { export default function () {
return ( return (
<LumeProvider> <>
<Lume /> <LumeIdentity />
</LumeProvider> <LumeProvider>
<LumeDashboard />
</LumeProvider>
</>
); );
} }

17
src/pages/index.astro
View File

@ -1,6 +1,6 @@
--- ---
import "@lumeweb/sdk/lib/style.css";
import "@/styles/globals.scss"; import "@/styles/globals.scss";
import "@lumeweb/sdk/lib/style.css";
import ArrowSvg from "@/components/Arrow"; import ArrowSvg from "@/components/Arrow";
import Lume from "../components/Lume"; import Lume from "../components/Lume";
--- ---
@ -14,25 +14,20 @@ import Lume from "../components/Lume";
<title>Astro</title> <title>Astro</title>
</head> </head>
<body> <body>
<main class="flex h-screen max-h-screen flex-col items-center justify-between"> <main class="flex min-h-screen flex-col items-center justify-between">
<header class="relative h-14 px-2 pl-2 py-2 w-full bg-neutral-900 flex"> <header class="relative h-14 px-2 pl-7 py-2 w-full bg-neutral-900">
<div <div
class="relative h-full w-full rounded-full bg-neutral-800 border border-neutral-700 flex items-center [>input:focus]:ring-2 [>input:focus]:ring-white" class="relative h-full w-full rounded-full bg-neutral-800 border border-neutral-700 flex items-center"
> >
<input class="ml-3 text-gray-300 w-[calc(100%-150px)] h-full bg-transparent focus:ring-0 focus:outline-none focus:border-0"/> <Lume client:only="react" />
<button <button
class="absolute bg-neutral-700 text-neutral-400 px-4 py-2 right-0 rounded-r-full" class="absolute bg-neutral-700 text-neutral-400 px-4 py-2 right-0 rounded-r-full"
> >
Navigate Navigate
<ArrowSvg className="inline-block ml-2 -mt-1 w-5 h-5" /> <ArrowSvg class="inline-block ml-2 -mt-1 w-5 h-5" />
</button> </button>
</div> </div>
<div class="w-32 flex justify-end">
<Lume client:only="react" />
</div>
</header> </header>
<iframe id="mainIframe" src="https://google.com" class="w-full h-full">
</iframe>
</main> </main>
</body> </body>
</html> </html>