@panoramax/web-viewer/src/components/core/PhotoViewer.css

Panoramax web viewer for geolocated pictures

pnx-photo-viewer {
	position: relative;
	display: block;
}

/* Maximized components */
pnx-photo-viewer .pnx-psv {
	position: absolute;
	inset: 0;
	z-index: 0;
}

/* No PSV loader */
pnx-photo-viewer .psv-loader {
	display: none;
}

/* Cornered grid layout */
pnx-photo-viewer pnx-cornered-grid::part(corner-top-left),
pnx-photo-viewer pnx-cornered-grid::part(corner-top),
pnx-photo-viewer pnx-cornered-grid::part(corner-top-right),
pnx-photo-viewer pnx-cornered-grid::part(corner-bottom-left),
pnx-photo-viewer pnx-cornered-grid::part(corner-bottom),
pnx-photo-viewer pnx-cornered-grid::part(corner-bottom-right) {
	gap: 10px;
	padding: 10px;
}

@media screen and (max-width: 576px) {
	pnx-photo-viewer pnx-cornered-grid::part(corner-top-right) {
		flex-direction: column;
		align-items: flex-end;
		justify-content: flex-start;
	}

	pnx-photo-viewer pnx-cornered-grid::part(corner-top-left) {
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
	}
}

/* Hidden widgets on sequence play */
pnx-photo-viewer.pnx-playing pnx-bottom-drawer,
pnx-photo-viewer.pnx-playing pnx-widget-legend,
pnx-photo-viewer.pnx-playing pnx-widget-zoom {
	display: none;
}

/* Override legend positioning */
@media screen and (min-width: 576px) {
	pnx-photo-viewer pnx-widget-legend:not([light="true"]) {
		width: 100%;
	}
}