@schukai/monster/source/components/style/floating-ui.css

Monster is a simple library for creating fast, robust and lightweight websites.

/** generated from floating-ui.pcss **/
div[data-monster-role="popper"] {
	align-content: center;
	background: var(--monster-bg-color-primary-1);
	border-color: var(--monster-bg-color-primary-4);
	border-radius: var(--monster-border-radius);
	border-style: var(--monster-border-style);
	border-width: var(--monster-border-width);
	box-shadow: var(--monster-box-shadow-1);
	box-sizing: border-box;
	color: var(--monster-color-primary-1);
	display: none;
	justify-content: space-between;
	left: 0;
	max-height: var(--monster-popper-max-height, calc(100vh - 2rem));
	max-width: var(--monster-popper-max-width, calc(100vw - 2rem));
	opacity: 1;
	padding: 1.1em;
	position: absolute;
	top: 0;
	transition: opacity var(--monster-popper-fade-duration, .14s)
		var(--monster-popper-fade-timing, cubic-bezier(0.2, 0, 0, 1));
	width: -moz-max-content;
	width: max-content;
	z-index: var(--monster-z-index-modal);
}
div[data-monster-role="popper"][data-monster-appearance="opening"] {
	opacity: 0;
}
div[data-monster-role="popper"][data-monster-appearance="open"] {
	opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
	div[data-monster-role="popper"] {
		transition: none;
	}
}
div[data-monster-role="popper"] > [part="content"] {
	max-height: var(--monster-popper-content-max-height, calc(100vh - 4.2rem));
	max-width: 100%;
	overflow: auto;
}
div[data-monster-role="popper"]
	> [part="content"][data-monster-overflow-mode="horizontal"] {
	clip-path: none;
	overflow-x: auto;
	overflow-y: visible;
}
div[data-monster-role="popper"]
	> [part="content"][data-monster-overflow-mode="visible"] {
	clip-path: none;
	max-height: none;
	max-width: none;
	overflow: visible;
}
div[data-monster-role="popper"] div[data-monster-role="arrow"] {
	background: var(--monster-bg-color-primary-1);
	height: calc(
		max(
			var(--monster-popper-witharrrow-distance),
			-1 *
			var(--monster-popper-witharrrow-distance)
		) *
		2
	);
	pointer-events: none;
	position: absolute;
	width: calc(
		max(
			var(--monster-popper-witharrrow-distance),
			-1 *
			var(--monster-popper-witharrrow-distance)
		) *
		2
	);
	z-index: -1;
}