svelte/test/runtime/samples/inline-style-directive-stri.../main.svelte

<script>
	export let translate_x = "45px";
	export let border_width = 100;
	export let border_color;
</script>

<p style:color={"green"} style:transform="translateX({translate_x})" style:border="{border_width}px solid {border_color || 'pink'}" />
[feat] Style directives (#5923) * add Style node, interfaces * style-directives: add parser and runtime test * style-directives: push styles in to styles array on Element * style-directives: minimal ssr work * style-directives: ssr add_styles * style-directive: tests * style-directives: work in progress * obviously incorrect hard-coded color * tweak * style directive interface * style-directives: get text from info in Style node * style-directives: add_styles func in ElementWrapper * style-directives: ssr rendering * handle text-only style directive in tag.ts * style-directives: handle spread styles in ssr * style-directives: more parser tests * style-directives: more inline tests * style-directives: remove solo tests * style-directives: cleanup * style-directives: tweak spread ssr internal * style-directives: push updater into update chunks; add dynamic test; * remove .solo * check for dynamic dependencies before adding update chunk * add test of multiple styles; remove null styles; * style-directives: docs; more tests of multiple styles * style-directives: use camelcase * style-directives: cleanup * style-directives: fix mustache template case with template literal * style-directives: use ternary * style-directives: linting * style-directives: remove "text" from interface * style-directives: actually, remove StyleDirective interface entriely * add more test, fix test for ssr * fix lint and tidy up * add test for css variables * fix linting errors Co-authored-by: pmurray73 <pmurray73@bloomberg.net> Co-authored-by: Tan Li Hau <lhtan93@gmail.com> 3 years ago			`<script>`
			`export let translate_x = "45px";`
			`export let border_width = 100;`
			`export let border_color;`
			`</script>`

			`<p style:color={"green"} style:transform="translateX({translate_x})" style:border="{border_width}px solid {border_color \|\| 'pink'}" />`