@alegendstale/holly-components/dist/components/responsive-svg/responsive-svg.styles.js

Reusable UI components created using lit

import { css as t } from "lit";
const s = t`
	:host {
		display: block;
		--scale: 1;
	}

	:host([autofit]),
	:host([autofit]) svg {
		width: 100%;
		height: 100%;
	}

	/* Size scaling based on font-size */
	:host(:not([autofit])) {
		/* Removes extra space from under SVG */
		display: flex;
	}

	:host(:not([autofit])) svg {
		/* Allow SVG to be manipulated by font size */
		display: inline-block;
		/* Change SVG size using font-size */
		font-size: inherit;
		/* Remove extra vertical space in inline element reserved for character descenders */
		vertical-align: top;

		width: calc(var(--svg-width, var(--svg-width-fallback)) / 100 * var(--scale));
		height: calc(var(--svg-height, var(--svg-height-fallback)) / 100 * var(--scale));
	}

	:host(:not([svgColors])) svg {
		/* Inherit fill to bypass default */
		fill: inherit;
	}

	:host(:not([svgColors])) path {
		fill: inherit;
		stroke: inherit;
	}

	svg {
		max-width: 100%;
		max-height: 100%;
	}
`;
export {
  s as default
};