<pre class="mdl-code">{**
 *
 * The classes are named using the format .font-{size} for all breakpoints.
 *
 * Where size is one of:
 *
<?php
	foreach($sizes as $sizeName => $sizeValue) {
		echo " *    {$sizeName} - (by default) {$sizeValue}\n";
	}
?>
 *
 * font-size in html element is 62,5% = 10px by default;
 *
 * Sizes values could be redefine by $font-sizes variable in vars.scss.
 *
 *}</pre>

<br>

<?php
	foreach($sizes as $sizeName => $sizeValue) {
		if ($sizeIndex > 0) echo "<hr>\n";

		echo "<span class='font-{$sizeName}'>Lorem ipsum dolor sit amet, consectetuer adipiscing elit</span>\n";

		$sizeIndex++;
	}
?>

.font {

    @each $name, $size in $font-sizes {

        &-#{$name} {

            @include font-size($name);

        }

    }

}