extends ./master.pug

block main
	h2.d-flex.justify-content-between
		span= data.name + ' - ' + data.country
		a.align-self-center(href=("/countries/" + data.countrySafeName + ".html") style="font-size: 50%")
			| ◀ #{data.country}

	+heroChart

	mixin renderItemName(item)
		if item.name && item.country === 'United States'
			a(href=("/countries/" + data.countrySafeName + "-" + data.safeName + "-" + item.safeName + ".html"))
				= item.name
		else if item.name
			= item.name
		else
			em.text-muted Other #{item.state}

	+dataTable(data.counties, 'County/Region', 'county')