{{ header }}
{{ column_left }}
<div id="content">
	<div class="page-header">
		<div class="container-fluid">
			<div class="pull-right">
				<button type="button" onclick="$('#form-gallery-setting').submit();" class="save btn btn-primary" data-toggle="tooltip" title="{{ button_save }}" data-loading-text="<i class='fa fa-spinner'></i>"><i class="fa fa-save"></i></button>
			</div>
			<h1>{{ heading_title }}</h1><br />
			<ul class="breadcrumb">
				{% for breadcrumb in breadcrumbs %}
					<li><a href="{{ breadcrumb.href }}">{{ breadcrumb.text }}</a></li>
				{% endfor %}
			</ul>
		</div>
	</div>
	<div class="container-fluid">
		{% if error_warning %}
			<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> {{ error_warning }}<button type="button" class="close" data-dismiss="alert">&times;</button></div>
		{% endif %}
		{% if error_name %}
			<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> {{ error_main_page_gallery_name }}<button type="button" class="close" data-dismiss="alert">&times;</button></div>
		{% endif %}
		{% if success %}
			<div class="alert alert-success"><i class="fa fa-check-circle"></i> {{ success }}<button type="button" class="close" data-dismiss="alert">&times;</button></div>
		{% endif %}
		<div class="panel panel-default">
			<div class="panel-heading">
				<h3 class="panel-title"><i class="fa fa-list"></i> {{ text_setting }}</h3>
			</div>
			<div class="panel-body">
				<form method="post" enctype="multipart/form-data" id="form-gallery-setting" class="form-horizontal">
					<div class="row row-flex">
						<div class="col-sm-2 control-label">{{ entry_main_page_gallery_data }}</div>
						<div class="col-sm-10">
							<ul class="nav nav-tabs">
								{% for lang in languages %}
									<li><a href="#gallery-title-{{ lang.language_id }}" data-toggle="tab"><img src="language/{{ lang.code }}/{{ lang.code }}.png" title="{{ lang.name }}" /></a></li>
								{% endfor %}
							</ul>
							<div class="tab-content">
								{% for lang in languages %}
									<div id="gallery-title-{{ lang.language_id }}" class="tab-pane">
										<input type="text" name="uni_gallery[name][{{ lang.language_id }}]" value="{{ uni_gallery.name[lang.language_id] }}" placeholder="{{ text_main_page_gallery_name }}" class="form-control" />
										{% if error_name[lang.language_id] %}
											<div class="text-danger">{{ error_name[lang.language_id] }}</div>
										{% endif %} 
										<textarea name="uni_gallery[meta_description][{{ lang.language_id }}]" rows="3" placeholder="{{ text_meta_description }}" id="input-meta-description1" class="form-control">{{ uni_gallery.meta_description[lang.language_id] }}</textarea>
										<textarea name="uni_gallery[meta_keyword][{{ lang.language_id }}]" rows="3" placeholder="{{ text_meta_keyword }}" id="input-meta-description1" class="form-control">{{ uni_gallery.meta_keyword[lang.language_id] }}</textarea>
										<textarea name="uni_gallery[description][{{ lang.language_id }}]" data-lang="{{ summernote }}" data-toggle="summernote">{{ uni_gallery.description[lang.language_id] }}</textarea>
									</div>
								{% endfor %}
							</div>
						</div>
					</div>
					<div class="row row-flex">
						<div class="col-sm-2 control-label">{{ entry_image_sizes }}</div>
						<div class="col-sm-10">
							<div class="input-group">
								<input type="text" name="uni_gallery[image_width]" value="{{ uni_gallery.image_width ? uni_gallery.image_width : 360 }}" class="form-control" style="width:60px !important; text-align:center;" />
								<input type="text" name="uni_gallery[image_height]" value="{{ uni_gallery.image_height ? uni_gallery.image_height : 270 }}" class="form-control" style="width:60px !important; text-align:center;" /> 
								<span>пикс.</span>
								{% if error_newspage_thumb %}<span class="error">{{ lang.error_newspage_thumb }}</span>{% endif %}
							</div>
						</div>
					</div>
					<div class="row row-flex">
						<div class="col-sm-2 control-label">{{ entry_image_sizes_popup }}</div>
						<div class="col-sm-10">
							<div class="input-group">
								<input type="text" name="uni_gallery[image_popup_width]" value="{{ uni_gallery.image_popup_width ? uni_gallery.image_popup_width : 1200 }}" class="form-control" style="width:60px !important; text-align:center;" />
								<input type="text" name="uni_gallery[image_popup_height]" value="{{ uni_gallery.image_popup_height ? uni_gallery.image_popup_height : 800 }}" class="form-control" style="width:60px !important; text-align:center;" /> 
								<span>пикс.</span>
								{% if error_newspage_thumb %}<span class="error">{{ lang.error_newspage_thumb }}</span>{% endif %}
							</div>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
</div>
<style>
	.row-flex {display:flex;width:100%;align-items:center;margin: 0 -15px 20px;padding:0 0 20px;border-bottom:solid 1px #ddd}
	.gallery-data__item > div:nth-child(2){flex:1 1 auto;margin:0 0 0 15px}
	.row-flex .nav{margin:0 0 10px}
	.row-flex .nav li a {padding:5px 12px}
	.row-flex .control-label {padding-top:0;font-weight:700}
	.row-flexinput + input {margin:10px 0}
	.row-flex textarea {min-height:auto;margin:10px 0 !important}
	.row-flex textarea + textarea {margin:0 0 10px}
	.row-flex .text-danger {margin:8px 0 0}
	.row-flex .input-group input + span, #module .input-group select + span{display:inline-block;width:auto;vertical-align:middle;height:35px;line-height:30px;padding:0 10px;text-align:center;color:#888;cursor:pointer;background:#eee;border:solid 1px #ccc;border-left:none;border-radius:0 3px 3px 0;}

	.overflow {display:flex;flex-direction:column;height:180px;overflow:auto;padding:15px;border:solid 1px #ddd;border-radius:4px;background:#f2f2f2;box-shadow:inset 0 0 10px #ddd;}
	.overflow b {display:inline !important;font-weight:400 !important}
	.overflow label {display:flex;align-items:center;margin:0 0 10px !important;font-weight:400;cursor:pointer}
	.overflow span {width:10px;margin:0 0 10px}
	#content label input[type="checkbox"] {display:none}
	#content label input[type="checkbox"] + span{position:relative;content:'';display:inline-block;vertical-align:middle;margin:0 10px 0 0;width:38px;height:18px;background:#ccc;border:solid 1px #999;border-radius:10px;box-shadow:inset 0 1px 2px rgba(0, 0, 0, .3);cursor:pointer;transition:all ease-in-out .2s}
	#content label input[type="checkbox"]:checked + span {background:#6ab344}
	#content label input[type="checkbox"] + span:after {position:absolute;top:1px;right:auto;left:2px;width:14px;height:14px;content:'';background:#fff;border-radius:100%;transition:all ease-in-out .2s}
	#content label input[type="checkbox"]:checked + span:after {right:auto;left:21px;background:#fff}
</style>
<script type="text/javascript">
$('.nav-tabs').each(function() {
	$(this).find('li:first a').tab('show');
});
</script>
{{ footer }}