Moves the "percent" metadata next to the bar for Tiles Progress Bar Block

tiles-progress-percent-side.php

<?php

register_block_style( 'tiles/progress', [
	'name'  => 'percent-side',
	'label' => 'Percent Side',
	'inline_style' => '
		.wp-block-tiles-progress.is-style-percent-side {
			line-height: 1;
		}
		.wp-block-tiles-progress.is-style-percent-side .wp-block-tiles-progress__background,
		.wp-block-tiles-progress.is-style-percent-side .wp-block-tiles-progress__foreground {
			border-radius: 0;
			height: 2rem;
		}
		.wp-block-tiles-progress.is-style-percent-side .wp-block-tiles-progress__background {
			max-width: calc( 100% - 3em );
		}
		.wp-block-tiles-progress.is-style-percent-side .wp-block-tiles-progress__percentage {
			margin-top: 2em;
			margin-bottom: calc( -2rem - 1em );
			font-family: monospace;
		}
	'
] );