chrome-font-changer
/
index.html

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title data-locale="name"></title>
	<link rel="stylesheet" href="style.css">
</head>
<body>

<header>
	<h1 data-locale="name"></h1>
</header>

<section class="inline">
	<h2 class="usual-text" data-locale="defaultFontSize">خەت چوڭ كىچىكلىكى</h2>
	<div class="range">
		<input type="range" min="6" max="50" class="js-default-font-size-slider">
		<div class="labels">
			<label data-locale="verySmall"></label>
			<label data-locale="veryBig"></label>
		</div>
	</div>
</section>

<section class="inline">
	<h2 class="usual-text" data-locale="minimumFontSize"></h2>
	<div class="range">
		<input type="range" min="6" max="50" class="js-minimum-font-size-slider">
		<div class="labels">
			<label data-locale="verySmall"></label>
			<label data-locale="veryBig"></label>
		</div>
	</div>
	<div class="text-sample js-minimum-font-size-preview js-standard-font-preview" style="font-size:14px;">
		<span class="js-minimum-font-size">0</span>:
		<span class="js-alphabet"></span>
	</div>
</section>

<section class="inline">
	<h2 class="usual-text" data-locale="standardFont"></h2>
	<div class="font-settings-row">
		<select class="js-fonts-list js-standard-font-select"></select>
	</div>
	<div class="text-sample js-standard-font-preview">
		<span class="js-default-font-size">0</span>:
		<span class="js-alphabet"></span>
	</div>
</section>


<script src="script.js"></script>
</body>
</html>