harness-drone/static/styles/pages/docs.sass

.toc
	list-style-type: none;
	padding:0px;
	margin:0px;
	padding-bottom:40px;

	h2
		font-size:21px;
		font-weight:normal;
		margin-bottom:20px;
		color:#2b303b;

	ul
		list-style-type: none;
		padding:0px;
		margin:0px;
		margin-bottom:40px;
		border-bottom: 1px solid #EEE;
		padding-bottom:40px;
		li
			line-height:25px;
			a
				color: #2b303b;
				text-decoration:none;
			a:hover
				text-decoration:underline;

	[data-method]:before
		content: attr(data-method);
		padding:0px 10px;
		line-height:18px;
		min-width:70px;
		font-size:11px;
		text-transform:uppercase;
		display: inline-block;
		text-align:center;
		color:#FFF;
		border-radius:2px;
		margin-right:20px;

	[data-method="GET"]:before
		background-color:#1ABC9C;
	[data-method="PUT"]:before
		background-color:#9B59B6;
	[data-method="POST"]:before
		background-color:#3498DB;
	[data-method="PATCH"]:before
		background-color:#E67E22;
	[data-method="DELETE"]:before
		background-color:#E74C3C;



	[data-method]:before
		background:#FFF;
		border:1px solid #FFF;
	[data-method="GET"]:before
		color:#1ABC9C;
		border-color:#1ABC9C;
	[data-method="PUT"]:before
		color:#9B59B6;
		border-color:#9B59B6;
	[data-method="POST"]:before
		color:#3498DB;
		border-color:#3498DB;
	[data-method="PATCH"]:before
		color:#E67E22;
		border-color:#E67E22;
	[data-method="DELETE"]:before
		color:#E74C3C;
		border-color:#E74C3C;

.operation

	[data-method]:before
		content: attr(data-method);
		padding:0px 10px;
		line-height:18px;
		min-width:70px;
		font-size:11px;
		text-transform:uppercase;
		display: inline-block;
		text-align:center;
		color:#FFF;
		border-radius:2px;
		margin-right:20px;
		background:#FFF;
		border:1px solid #FFF;
		line-height: 20px;
		vertical-align: top;


	[data-method]:before
		background:#FFF;
		border:1px solid #FFF;
	[data-method="GET"]:before
		color:#1ABC9C;
		border-color:#1ABC9C;
	[data-method="PUT"]:before
		color:#9B59B6;
		border-color:#9B59B6;
	[data-method="POST"]:before
		color:#3498DB;
		border-color:#3498DB;
	[data-method="PATCH"]:before
		color:#E67E22;
		border-color:#E67E22;
	[data-method="DELETE"]:before
		color:#E74C3C;
		border-color:#E74C3C;

.docs
	margin-top:40px;
	padding: 0px 50px;
	padding-right:40px;

.docs-api
	pre
		margin-right: 15px;
		font-size: 13px;
		color: #eff1f5;
		color: #2b303b;
		border-radius: 2px;
		background: #2b303b;
		background: #ECF0F1;
		white-space: pre-wrap;
		word-wrap: break-word;
		box-sizing: border-box;
		padding: 25px 30px;
		font-family: "Roboto Mono";

		margin-right: 0px;
		padding-left: 40px;
		background: #eff1f5;
		color: #2b303b;
		white-space: pre-wrap;
		word-wrap: break-word;
		box-sizing: border-box;
		padding: 25px 30px;
		font-family: "Roboto Mono";
		border-radius: 2px;
		font-size:13px;

.operation
	min-height:100vh;
	padding:20px 0px;
	display: flex
	&> aside,
	&> div
		min-width:50%;
		max-width:50%;
		width:50%;
		padding-right:40px;
	h2
		color:#2b303b;
		font-size:21px;
	h3
		font-size:16px;
		margin-bottom:20px;
		margin-top:40px;
	aside
		background: rgba(43, 48, 59, 0.95);
		box-sizing: border-box;
		padding: 20px 0px 10px 0px;
		border-radius:2px;
		h4
			color: #d0d4d7;
			font-size:15px;
			padding:20px;
			padding-left:40px;
		pre
			background: #2b303b;
			color: #d0d4d7;
			margin-right:0px;
			padding-left:40px;

	.params
		padding: 0px;
		margin: 0px;
		list-style-type: none;
		border-top: 1px solid #f0f4f7
		li
			padding:15px 10px;
			border-bottom:1px solid #f0f4f7;
			font-size:15px
			p
				line-height:20px;
				margin: 0 0 0 170px;

		li:after
			visibility: hidden;
			display: block;
			font-size: 0;
			content: " ";
			clear: both;
			height: 0;

		h4
			float:left;
			line-height:20px;
			text-align:right;
			padding-right:20px;
			width:150px;
			font-weight:bold;
			font-size:15px;

		small
			display:block;
			text-transform: uppercase;
			color:#E67E22;
			font-size:11px;
			font-weight:normal;
			margin-top:5px;


.operation
	aside
		background: rgba(239, 241, 245, 0.49)
		h4
			color: #2b303b
		pre
			background: #eff1f5
			color: #2b303b




.docs-usage
	.row
		display:flex;
		.content-nav
			max-width:250px;
			min-width:250px;
			width:250px;
			ul
				padding:0px;
				margin:0px;
				list-style-type: none;
				li
					position:relative;
					color: rgba(0,0,0,0.5);
					text-transform: uppercase;
					font-size: 13px;
				li a
					color:rgba(43, 48, 59, 0.8);
					line-height: 30px;
					display: block;
					font-size: 16px;
					text-transform: none;
				li.active a
					color:#2b303b;
					font-size: 16px;
					text-transform: none;
				li.active:before
					content: "";
					border-left: 4px solid #2b303b;
					position: absolute;
					top: 0px;
					bottom: 0px;
					left: -20px;
				ul
					margin-bottom: 25px;
					margin-top: 5px;
		.content-main
			max-width: 900px;
			margin: 0px auto;
			margin-bottom:40px;
			font-size:14px;

			p
				line-height:20px;
				margin:20px 0px;

			blockquote
				color: #31708f;
				background-color: #d9edf7;
				border-color: #bcdff1;
				padding: 30px;
				margin: 15px 0px;
				border-radius:2px;

			blockquote p:first-child
				margin-top:0px;

			blockquote p:last-child
				margin-bottom:0px;

			strong
				font-weight:bold;

			h1
				margin:40px 0px 20px 0px;
				font-size:22px;

			h1:first-child
			    margin-top:0px;

			h2
				margin:40px 0px 30px 0px;
				font-size:20px;
				border-top: 1px solid #EEE;
				padding-top: 30px;
			h3
			    margin:40px 0px 20px 0px;
			    font-size:16px;

			ul code, ol code, p code
				background: #eff1f5;
				color: #2b303b;
				padding: 0px 7px;
				font-family: "Roboto Mono";
				font-size:13px;
				white-space:nowrap;
			pre
				margin-right: 0px;
				padding-left: 40px;
				background: #eff1f5;
				color: #2b303b;
				white-space: pre-wrap;
				word-wrap: break-word;
				box-sizing: border-box;
				padding: 25px 30px;
				font-family: "Roboto Mono";
				border-radius: 2px;
				font-size:13px;
			pre > code
				background: #eff1f5;
				color: #2b303b;
				font-family: "Roboto Mono";
				font-size:13px;