fix(lib): align zoom-control and tags (#427)

This commit is contained in:
Anton Tranelis 2025-11-11 15:14:59 +01:00 committed by GitHub
parent 462d9056f4
commit 5cf49cfcd3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 7 additions and 2 deletions

View File

@ -6,7 +6,7 @@ export const TagsControl = () => {
const removeFilterTag = useRemoveFilterTag()
return (
<div className='tw:flex tw:flex-wrap tw:mt-4 tw:w-[calc(100vw-2rem)] tw:max-w-xs'>
<div className='tw:flex tw:flex-wrap tw:mt-4 tw:w-[calc(100vw-2rem)] tw:max-w-xs tw:relative'>
{filterTags.map((tag) => (
<div
key={tag.id}

View File

@ -133,6 +133,7 @@ function UtopiaMap({
maplibreStyle={maplibreStyle}
zoomOffset={zoomOffset}
tileSize={tileSize}
showZoomControl={showZoomControl}
>
{children}
</UtopiaMapInner>

View File

@ -64,6 +64,7 @@ export function UtopiaMapInner({
maplibreStyle,
zoomOffset = 0,
tileSize = 256,
showZoomControl,
}: {
children?: React.ReactNode
geo?: GeoJsonObject
@ -81,6 +82,7 @@ export function UtopiaMapInner({
maplibreStyle?: string
zoomOffset?: number
tileSize?: number
showZoomControl?: boolean
}) {
const selectNewItemPosition = useSelectPosition()
const setSelectNewItemPosition = useSetSelectPosition()
@ -285,7 +287,9 @@ export function UtopiaMapInner({
<Outlet />
<Control position='topLeft' zIndex='1000' absolute>
<SearchControl />
<TagsControl />
<div className={`${showZoomControl ? 'tw:pl-14' : ''}`}>
<TagsControl />
</div>
</Control>
<Control position='bottomLeft' zIndex='999' absolute>
{showFullscreenControl && <FullscreenControl />}