antontranelis/utopia-ui
1
0
Fork 0
mirror of https://github.com/utopia-os/utopia-ui.git synced 2025-12-13 07:46:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

changes to overla page

Browse Source
This commit is contained in:
Anton Tranelis 2024-02-26 13:03:17 +01:00
parent 2c1eea870d
commit f9f9bb3283
1 changed files with 2 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/Components/Templates/MapOverlayPage.tsx
View File

@ -3,7 +3,7 @@ import * as L from 'leaflet';
import * as React from 'react'
import { useNavigate } from 'react-router-dom';
export function MapOverlayPage({ children, className, backdrop }: { children: React.ReactNode, className?: string, backdrop?: boolean }) {
export function MapOverlayPage({ children, className, backdrop, card = true }: { children: React.ReactNode, className?: string, backdrop?: boolean, card?:boolean }) {
const closeScreen = () => {
@ -32,11 +32,9 @@ export function MapOverlayPage({ children, className, backdrop }: { children: Re
return (
<div className={`tw-absolute tw-h-full tw-w-full tw-m-auto ${backdrop && "tw-z-[2000]"}`}>
<div ref={backdropRef} className={`${backdrop && "tw-backdrop-brightness-75"} tw-h-full tw-w-full tw-grid tw-place-items-center tw-m-auto`} >
<div ref={overlayRef} className={`tw-card tw-shadow-xl tw-bg-base-100 tw-p-6 ${className && className} ${!backdrop && "tw-z-[2000]"} tw-absolute tw-top-0 tw-bottom-0 tw-right-0 tw-left-0 tw-m-auto`}>
<div className="tw-card-body tw-p-0 tw-h-full">
<div ref={overlayRef} className={`${card && "tw-card tw-card-body"} tw-shadow-xl tw-bg-base-100 tw-p-6 ${className && className} ${!backdrop && "tw-z-[2000]"} tw-absolute tw-top-0 tw-bottom-0 tw-right-0 tw-left-0 tw-m-auto`}>
{children}
<button className="tw-btn tw-btn-sm tw-btn-circle tw-btn-ghost tw-absolute tw-right-2 tw-top-2" onClick={() => closeScreen()}>✕</button>
</div>
</div>
</div>
</div>