@import "../style"
@import "./ui"

body
	margin 0
	color #34495e
	word-break break-word

main
	margin 0 0 0 256px
	padding 64px
	width 100%
	max-width 768px

	section
		margin 32px 0

	h1
		margin 0 0 24px 0
		padding 16px 0
		font-size 1.5em
		border-bottom solid 2px #eee

	h2
		margin 0 0 24px 0
		padding 0 0 16px 0
		font-size 1.4em
		border-bottom solid 1px #eee

	h3
		margin 0
		padding 0
		font-size 1.25em

	h4
		margin 0

	p
		margin 1em 0
		line-height 1.6em

	footer
		margin 32px 0 0 0
		border-top solid 2px #eee

		> small
			margin 16px 0 0 0
			color #aaa

nav
	display block
	position fixed
	z-index 10000
	top 0
	left 0
	width 256px
	height 100%
	overflow auto
	padding 32px
	background #fff
	border-right solid 2px #eee

@media (max-width 1025px)
	main
		margin 0
		max-width 100%

	nav
		position relative
		width 100%
		max-height 128px
		background #f9f9f9
		border-right none

@media (max-width 768px)
	main
		padding 32px

@media (max-width 512px)
	main
		padding 16px

table
	display block
	width 100%
	max-width 100%
	overflow auto
	border-spacing 0
	border-collapse collapse

	thead
		font-weight bold
		border-bottom solid 2px #eee

		tr
			th
				text-align left

	tbody
		tr
			&:nth-child(odd)
				background #fbfbfb

	th, td
		padding 8px 16px
		min-width 128px

code
	display inline-block
	padding 8px 10px
	font-family Consolas, 'Courier New', Courier, Monaco, monospace
	color #295c92
	background #f2f2f2
	border-radius 4px

pre
	> code
		display block