<div class="wrapper">
	<div id="framework-configurations">
		<h3>Framework configurations</h3>
		<table class="overview">
			<thead>
				<tr class="even">
					<th>Framework</th>
					<th>Configuration</th>
					<th>Edit</th>
					<th>Delete</th>
				</tr>
			</thead>
			<tbody>
			<% $.each(frameworkConfigurations, function (index, fc) { %>
			<tr id="<%-fc.id%>">
				<td>
					<%- fc.framework_name %>
				</td>
				<td>
					<%- fc.configuration_name %>
				</td>
				<td>
					<a data-id="<%-fc.id%>" href="#" class="edit-framework-configuration ui-icon ui-icon-pencil">
						Edit
					</a>
				</td>
				<td>
					<a data-id="<%-fc.id%>" href="#" class="delete-framework-configuration ui-icon ui-icon-minusthick">
						Delete
					</a>
				</td>
			</tr>
			<% });%>
			</tbody>
		</table>
		<div class="allwidth"><button class="large" id="add-framework-configuration">Add configuration</button></div>
	</div>
	<div id="controller-configurations">
		<h3>Controller configurations</h3>
		<table class="overview">
			<thead>
				<tr class="even">
					<th>Controller</th>
					<th>Configuration</th>
					<th>Edit</th>
					<th>Delete</th>
				</tr>
			</thead>
			<tbody>
			<% $.each(controllerConfigurations, function (index, cc) { %>
			<tr id="<%-cc.id%>">
				<td>
					<%- cc.controller_name %>
				</td>
				<td>
					<%- cc.configuration_name %>
				</td>
				<td>
					<a data-id="<%-cc.id%>" href="#" class="edit-controller-configuration ui-icon ui-icon-pencil">
						Edit
					</a>
				</td>
				<td>
					<a data-id="<%-cc.id%>" href="#" class="delete-controller-configuration ui-icon ui-icon-minusthick">
						Delete
					</a>
				</td>
			</tr>
			<% });%>
			</tbody>
		</table>
		<div class="allwidth"><button class="large" id="add-controller-configuration">Add configuration</button></div>
	</div>
</div>