@@include('./partial/head.html', {
	"title": "Calendar", 
	"css": [
		"assets/plugins/@fullcalendar/common/main.min.css",
		"assets/plugins/@fullcalendar/daygrid/main.min.css",
		"assets/plugins/@fullcalendar/timegrid/main.min.css",
		"assets/plugins/@fullcalendar/list/main.min.css",
		"assets/plugins/@fullcalendar/bootstrap/main.min.css"
]})
	<!-- BEGIN #app -->
	<div id="app" class="app app-content-full-height">
		@@include('./partial/header.html')
		
		@@include('./partial/sidebar.html', {"calendarClass": "active"})
		
		<!-- BEGIN #content -->
		<div id="content" class="app-content p-0">
			<!-- BEGIN calendar -->
			<div class="calendar">
				<!-- BEGIN calendar-body -->
				<div class="calendar-body">
					<div data-scrollbar="true" data-height="100%" data-skip-mobile="true">
						<div id="calendar"></div>
					</div>
				</div>
				<!-- ENG calendar-body -->
				<!-- BEGIN calendar-sidebar -->
				<div class="calendar-sidebar">
					<div class="desktop-sticky-top flex-fill h-100">
						<div class="calendar-sidebar-title">Draggable Events:</div>
						<div class="fc-event-list" id="external-events">
							<div class="fc-event-item"><div class="fc-event-link" data-color="#ff2d55"><i class="fa fa-circle fs-8px me-2 text-pink"></i> Meeting</div></div>
							<div class="fc-event-item"><div class="fc-event-link" data-color="#ff3b30"><i class="fa fa-circle fs-8px me-2 text-danger"></i> Group Discussion</div></div>
							<div class="fc-event-item"><div class="fc-event-link" data-color="#FF9500"><i class="fa fa-circle fs-8px me-2 text-warning"></i> Brainstorming</div></div>
							<div class="fc-event-item"><div class="fc-event-link" data-color="#FFCC00"><i class="fa fa-circle fs-8px me-2 text-yellow"></i> Presentation</div></div>
							<div class="fc-event-item"><div class="fc-event-link" data-color="#1ABD36"><i class="fa fa-circle fs-8px me-2 text-success"></i> Holiday</div></div>
							<div class="fc-event-item"><div class="fc-event-link" data-color="#0cd096"><i class="fa fa-circle fs-8px me-2 text-theme"></i> Sick Leave</div></div>
							<div class="fc-event-item"><div class="fc-event-link" data-color="#30beff"><i class="fa fa-circle fs-8px me-2 text-info"></i> Overtime</div></div>
							<div class="fc-event-item"><div class="fc-event-link" data-color="#1f6bff"><i class="fa fa-circle fs-8px me-2 text-blue"></i> Work from Home</div></div>
							<div class="fc-event-item"><div class="fc-event-link" data-color="#640DF3"><i class="fa fa-circle fs-8px me-2 text-indigo"></i> Business Travel</div></div>
							<div class="fc-event-item"><div class="fc-event-link" data-color="#5b2e91"><i class="fa fa-circle fs-8px me-2 text-purple"></i> Breakfast</div></div>
							<div class="fc-event-item"><div class="fc-event-link" data-color="#869ac0"><i class="fa fa-circle fs-8px me-2 text-muted"></i> Lunch</div></div>
							<div class="fc-event-item"><div class="fc-event-link" data-color="#869ac0"><i class="fa fa-circle fs-8px me-2 text-muted"></i> Dinner</div></div>
						</div>
					</div>
				</div>
				<!-- ENG calendar-sidebar -->
			</div>
			<!-- end calendar -->
		</div>
		<!-- END #content -->
		
		@@include('./partial/scroll-top-btn.html')
	</div>
	<!-- END #app -->
	
@@include('./partial/script.html', {"script": [
	"assets/plugins/moment/moment.js",
	"assets/plugins/@fullcalendar/core/main.global.js",
	"assets/plugins/@fullcalendar/daygrid/main.global.js",
	"assets/plugins/@fullcalendar/timegrid/main.global.js",
	"assets/plugins/@fullcalendar/interaction/main.global.js",
	"assets/plugins/@fullcalendar/list/main.global.js",
	"assets/plugins/@fullcalendar/bootstrap/main.global.js",
	"assets/js/demo/calendar.demo.js"
]})