<template>
	<footer class="footer">
		<span class="segment">© traxxx</span>

		<router-link
			:to="{ name: 'stats' }"
			class="segment footer-link nolink"
		>stats</router-link>
	</footer>
</template>

<style lang="scss" scoped>
.footer {
	background: var(--background-dim);
	color: var(--shadow);
	font-size: .8rem;
	font-weight: bold;
	text-align: center;
}

.segment {
	padding: .5rem;

	&:not(:last-child) {
		border-right: solid 1px var(--shadow-hint);
	}
}

.footer-link {
	text-decoration: underline;

	&:hover {
		color: var(--primary);
	}
}
</style>