@extends('layouts.header')
@section('content')
<!--  BEGIN CONTENT AREA  -->
<br>
<div class="page-header">
	<div class="breadcrumb-four">
		<ul class="breadcrumb">
			<li><a href="{{url('dashboard')}}"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-home"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path><polyline points="9 22 9 12 15 12 15 22"></polyline></svg></a></li>
			<li class="active" aria-current="page">
			<a href="" title="Layout Configuration">
			<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-plus"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg>
			Layout Configuration</a>
		</li>
		</ul>
	</div>
</div>
<br>
<div class="row">
	<div class="col-lg-12 col-md-12 layout-spacing">
		@csrf
		<div class="statbox widget box box-shadow">
			<div class="col-md-6" name="TemplateDiv" id="TemplateDiv">
				<h6>Tempalte : </h6>
				<select name="TemplateId" id="TemplateId" class="form-control" onchange="ShowRowsDiv(this.value)">
					<option value="">--Select Template--</option>
					@foreach($TempaltesArray as $key=>$value)
						<option value="{{$key}}">{{$value}}</option>
					@endforeach
				</select>
			</div>
			<br/>
			<div class="col-md-6" name="RowsDiv" id="RowsDiv" style="display:none">
				<h6>Row Type : </h6>
				<select name="RowType" id="RowType" class="form-control" onChange="ShowTemplateRowsLayout(this.value)">
					<option value="">--Select Template--</option>
						<option value="1">1 Column</option>
						<option value="2">2 Column</option>
						<option value="3">3 Column</option>
						<option value="4">4 Column</option>
						<option value="5">Grid</option>
				</select>
			</div>
			<div class="col-xs-12 col-sm-12 col-md-12" name="RowLayoutDesign" id="RowLayoutDesign">
				
			</div>
		</div>
		<br/>
		<div class="statbox widget box box-shadow" name="LayoutPreview" id="LayoutPreview">
		</div>
	</div>
</div>
<!--  END CONTENT AREA  -->
@endsection