doctype
html
	head
		meta(charset="UTF-8")
		title 7th Saga Data
		link(rel="stylesheet" href="/static/bootstrap.css")
		link(rel="stylesheet" href="/static/bootstrap-icons.css")
		link(rel="stylesheet" href="/static/7th-saga.css")
	body
		mixin sortHeader(label)
			th: div.sortable
				div.sortable-links
					a(href="#") ▲
					a(href="#") ▼
				div.col-label.ml-1= label

		mixin na(bool, text)
			if bool
				block
			else
				small: em.text-muted= text || 'n/a'

		mixin apprenticeFilterForm()
			form.apprentice-filter-form: div.d-flex.justify-content-center
				each apprentice in [ 'Esuna', 'Kamil', 'Olvan', 'Lejes', 'Lux', 'Valsu', 'Wilme' ]
					div.form-check-inline
						- const id = 'apprentice-' + apprentice;
						input.form-check-input(type="checkbox" name=apprentice id=id)
						label.form-check-label(for=id)= apprentice

		div.container-fluid
			ul.nav.nav-tabs.mt-4.px-4.position-sticky(style="top: 0; background-color: white;")
				li.nav-item: a.nav-link(href="/enemies" class=(context === 'enemies' ? 'active' : '')) Enemies
				li.nav-item: a.nav-link(href="/spells" class=(context === 'spells' ? 'active' : '')) Spells
				li.nav-item: a.nav-link(href="/items" class=(context === 'items' ? 'active' : '')) Items
				li.nav-item: a.nav-link(href="/weapons" class=(context === 'weapons' ? 'active' : '')) Weapons
				li.nav-item: a.nav-link(href="/armor" class=(context === 'armor' ? 'active' : '')) Armor
				li.nav-item: a.nav-link(href="/accessories" class=(context === 'accessories' ? 'active' : '')) Accessories
				li.nav-item: a.nav-link(href="/exp" class=(context === 'exp' ? 'active' : '')) Experience
				li.nav-item: a.nav-link(href="/calc" class=(context === 'calc' ? 'active' : '')) Calculations
			div.tab-content
				div.tab-pane.show.active.mt-2
					block tab-content

		script(src="/static/jquery.js")
		script(src="/static/popper.js")
		script(src="/static/bootstrap.js")