<script>
	import { container } from '@leveluptuts/svelte-element-query'
</script>
<div class="contain" use:container={{small: 0, medium: 200, large: 500}}>
	<h1>Hello</h1>
</div>
<style>
	.contain {
		border: dashed 5px var(--borderColor, #333);
	}

	:global(.medium) {
		--borderColor: red;
	}

	:global(.large) {
		--borderColor: blue;
	}
</style>