tidy up some examples

site/content/examples/bar-chart/App.svelte

@@ -9,9 +9,6 @@
 
 	let width = 500;
 	let height = 200;
-	let barWidth;
-	let xScale;
-	let yScale;
 
 	function formatMobile(tick) {
 		return "'" + tick % 100;
@@ -25,10 +22,8 @@
 		.domain([0, Math.max.apply(null, yTicks)])
 		.range([height - padding.bottom, padding.top]);
 
-	$: {
+	$: innerWidth = width - (padding.left + padding.right);
-		const innerWidth = width - (padding.left + padding.right);
+	$: barWidth = innerWidth / xTicks.length;
-		barWidth = innerWidth / xTicks.length;
-	}
 </script>
 
 <style>

site/content/examples/binding-media-elements/App.svelte

@@ -2,8 +2,7 @@
 	let paused = true;
 	let t = 0;
 	let d;
-
+	let bg;
-	let icon, bg;
 
 	$: icon = `https://icon.now.sh/${paused ? 'play' : 'pause'}_circle_filled`;
 

site/content/examples/line-chart/App.svelte

@@ -11,13 +11,6 @@
 	let width = 500;
 	let height = 200;
 
-	let xScale;
-	let yScale;
-	let minX;
-	let maxX;
-	let path;
-	let area;
-
 	$: xScale = scaleLinear()
 		.domain([minX, maxX])
 		.range([padding.left, width - padding.right]);

site/content/examples/scatterplot/Scatterplot.svelte

@@ -4,31 +4,30 @@
 
 	export let points;
 
+	let svg;
+	let width = 500;
+	let height = 200;
+
 	const padding = { top: 20, right: 40, bottom: 40, left: 25 };
 
-	let xScale;
 	$: xScale = scaleLinear()
 		.domain([0, 20])
 		.range([padding.left, width - padding.right]);
-	let yScale;
+
 	$: yScale = scaleLinear()
 		.domain([0, 12])
 		.range([height - padding.bottom, padding.top]);
 
-	let width = 500;
-	let height = 200;
-	let xTicks;
 	$: xTicks = width > 180 ?
 		[0, 4, 8, 12, 16, 20] :
 		[0, 10, 20];
-	let yTicks;
+
 	$: yTicks = height > 180 ?
 		[0, 2, 4, 6, 8, 10, 12] :
 		[0, 4, 8, 12];
 
 	onMount(resize);
 
-	let svg;
 	function resize() {
 		({ width, height } = svg.getBoundingClientRect());
 	}

site/content/examples/svg-clock/App.svelte

@@ -2,15 +2,12 @@
 	import { onMount } from 'svelte';
 
 	let time = new Date();
-	let hours, minutes, seconds;
 
-	$: {
+	// these automatically update when `time`
-		// this block runs reactively, whenever
+	// changes, because of the `$:` prefix
-		// `time` changes
+	$: hours = time.getHours();
-		hours = time.getHours();
+	$: minutes = time.getMinutes();
-		minutes = time.getMinutes();
+	$: seconds = time.getSeconds();
-		seconds = time.getSeconds();
-	}
 
 	onMount(() => {
 		const interval = setInterval(() => {