@extends('layouts.app')

@section('title', $windowTitle)

@section('content')

<section class="section" style="min-height:80vh">
	<div class="columns is-centered">
		<div class="column is-three-quarters-widescreen">
			@include('includes.shared.go_back_button', ['route' => 'issues.index', 'link' => 'back_to_issues_list'])
		</div>
	</div>
	<div class="columns is-centered">
		<div class="column is-three-quarters-widescreen">
			<h1 class="title is-3 mt-4">{{ $pageTitle }}</h1>
		</div>
	</div>
	<div class="columns is-centered">
		<div class="column is-three-quarters-widescreen">
			<div class="tabs is-fullwidth is-boxed">
				<ul>
					<li class="is-active" data-tab="issue_create_form_one_wrapper"><a style="cursor: default;" href="#">1.{{ __('titles.tabs.identification') }}</a></li>
					<li data-tab="issue_create_form_two_wrapper"><a id="tab_two_link" href="#" style="cursor: default;">2.{{ __('titles.tabs.coordinators_and_tags') }}</a></li>
				</ul>
			</div>
		</div>
	</div>

	@include('publishing.issues.includes.issue_create_form_step_one')
	<div id="modal_container"></div>		
</section>

<script src="{{ url('/js/modules/issueCreateForm.js') }}"></script>
<script src="{{ url('/js/autocompletes/userAutocomplete.js') }}"></script>
<script src="{{ url('/js/modules/addCoordinatorsForm.js') }}"></script>
<script src="{{ url('/js/autocompletes/tagAutocomplete.js') }}"></script>
<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@10.2.7/dist/autoComplete.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@10.2.7/dist/css/autoComplete.02.min.css">
@endsection