New-OMIS/Modules/Admin/resources/views/calendars/index.blade.php

1306 lines
99 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

@extends('layouts.app')
@section('content')
<div class="page-content">
<div class="container-fluid">
<!-- start page title -->
@include('layouts.partials.breadcrumb', ['title' => $title])
<!-- end page title -->
<div class="row">
<div class="col-12">
<div class="row">
<div class="col-xl-3">
<div class="card card-h-100">
<div class="card-body">
<button class="btn btn-primary w-100" id="btn-new-event"><i class="mdi mdi-plus"></i> Create New
Event</button>
<div id="external-events">
<br>
<p class="text-muted">Drag and drop your event or click in the calendar</p>
<div class="external-event fc-event bg-success-subtle text-success" data-class="bg-success-subtle">
<i class="mdi mdi-checkbox-blank-circle me-2"></i>New Event Planning
</div>
<div class="external-event fc-event bg-info-subtle text-info" data-class="bg-info-subtle">
<i class="mdi mdi-checkbox-blank-circle me-2"></i>Meeting
</div>
<div class="external-event fc-event bg-warning-subtle text-warning" data-class="bg-warning-subtle">
<i class="mdi mdi-checkbox-blank-circle me-2"></i>Generating Reports
</div>
<div class="external-event fc-event bg-danger-subtle text-danger" data-class="bg-danger-subtle">
<i class="mdi mdi-checkbox-blank-circle me-2"></i>Create New theme
</div>
</div>
</div>
</div>
<div>
<h5 class="mb-1">Upcoming Events</h5>
<p class="text-muted">Don't miss scheduled events</p>
<div class="me-n1 simplebar-scrollable-y mb-3 pe-2" data-simplebar="init" style="height: 400px">
<div class="simplebar-wrapper" style="margin: 0px -8px 0px 0px;">
<div class="simplebar-height-auto-observer-wrapper">
<div class="simplebar-height-auto-observer"></div>
</div>
<div class="simplebar-mask">
<div class="simplebar-offset" style="right: 0px; bottom: 0px;">
<div class="simplebar-content-wrapper" tabindex="0" role="region"
aria-label="scrollable content" style="height: 100%; overflow: hidden scroll;">
<div class="simplebar-content" style="padding: 0px 8px 0px 0px;">
<div id="upcoming-event-list">
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-info me-2"></i><span class="fw-medium">4
Jan 2022 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">5:45 AM to 12:00 AM</small>
</div>
</div>
<h6 class="card-title fs-16"> World Braille Day</h6>
<p class="text-muted text-truncate-two-lines mb-0"> </p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-info me-2"></i><span
class="fw-medium">30 Jan 2022 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">5:45 AM to 12:00 AM</small>
</div>
</div>
<h6 class="card-title fs-16"> World Leprosy Day</h6>
<p class="text-muted text-truncate-two-lines mb-0"> </p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-info me-2"></i><span
class="fw-medium">21 Feb 2022 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">5:45 AM to 12:00 AM</small>
</div>
</div>
<h6 class="card-title fs-16"> International Mother Language Day</h6>
<p class="text-muted text-truncate-two-lines mb-0"> </p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-info me-2"></i><span
class="fw-medium">22 Feb 2022 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">5:45 AM to 12:00 AM</small>
</div>
</div>
<h6 class="card-title fs-16"> World Thinking Day</h6>
<p class="text-muted text-truncate-two-lines mb-0"> </p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-info me-2"></i><span class="fw-medium">8
Mar 2022 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">5:45 AM to 12:00 AM</small>
</div>
</div>
<h6 class="card-title fs-16"> International Women's Day</h6>
<p class="text-muted text-truncate-two-lines mb-0"> </p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-info me-2"></i><span
class="fw-medium">21 Mar 2022 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">5:45 AM to 12:00 AM</small>
</div>
</div>
<h6 class="card-title fs-16"> International Mother Language Day</h6>
<p class="text-muted text-truncate-two-lines mb-0"> </p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-info me-2"></i><span
class="fw-medium">22 Mar 2022 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">5:45 AM to 12:00 AM</small>
</div>
</div>
<h6 class="card-title fs-16"> World Water Day</h6>
<p class="text-muted text-truncate-two-lines mb-0"> </p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-info me-2"></i><span
class="fw-medium">7 Apr 2022 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">5:45 AM to 12:00 AM</small>
</div>
</div>
<h6 class="card-title fs-16"> World Health Day</h6>
<p class="text-muted text-truncate-two-lines mb-0"> </p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-info me-2"></i><span
class="fw-medium">16 Apr 2022 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">5:45 AM to 12:00 AM</small>
</div>
</div>
<h6 class="card-title fs-16"> International Special Librarians Day</h6>
<p class="text-muted text-truncate-two-lines mb-0"> </p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-info me-2"></i><span
class="fw-medium">22 Apr 2022 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">5:45 AM to 12:00 AM</small>
</div>
</div>
<h6 class="card-title fs-16"> Earth Day</h6>
<p class="text-muted text-truncate-two-lines mb-0"> </p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-primary me-2"></i><span
class="fw-medium">1 Apr 2024 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">Full day event</small></div>
</div>
<h6 class="card-title fs-16"> All Day Event</h6>
<p class="text-muted text-truncate-two-lines mb-0"> An all-day event is an event that
lasts an entire day or longer</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-warning me-2"></i><span
class="fw-medium">10 Apr 2024 to 12 Apr 2024 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">Full day event</small></div>
</div>
<h6 class="card-title fs-16"> Visit Online Course</h6>
<p class="text-muted text-truncate-two-lines mb-0"> Long Term Event means an incident
that last longer than 12 hours.</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-success me-2"></i><span
class="fw-medium">15 Apr 2024 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">12:30 PM to 12:00 AM</small>
</div>
</div>
<h6 class="card-title fs-16"> Meeting With Designer</h6>
<p class="text-muted text-truncate-two-lines mb-0"> Tell how to boost website traffic
</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-success me-2"></i><span
class="fw-medium">16 Apr 2024 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">7:00 PM to 12:00 AM</small>
</div>
</div>
<h6 class="card-title fs-16"> Birthday Party</h6>
<p class="text-muted text-truncate-two-lines mb-0"> Family slumber party Bring out
the blankets and pillows and have a family slumber party! Play silly party games,
share special snacks and wind down the fun with a special movie.</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-primary me-2"></i><span
class="fw-medium">19 Apr 2024 to 23 Apr 2024 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">Full day event</small></div>
</div>
<h6 class="card-title fs-16"> Repeating Event</h6>
<p class="text-muted text-truncate-two-lines mb-0"> A recurring or repeating event is
simply any event that you will occur more than once on your calendar. </p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-danger me-2"></i><span
class="fw-medium">24 Apr 2024 to 25 Apr 2024 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">Full day event</small></div>
</div>
<h6 class="card-title fs-16"> Weekly Strategy Planning</h6>
<p class="text-muted text-truncate-two-lines mb-0"> Strategies for Creating Your Weekly
Schedule</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-dark me-2"></i><span
class="fw-medium">28 Apr 2024 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">Full day event</small></div>
</div>
<h6 class="card-title fs-16"> Click for Google</h6>
<p class="text-muted text-truncate-two-lines mb-0"> </p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-danger me-2"></i><span
class="fw-medium">7 May 2024 to 8 May 2024 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">8:00 PM to 4:00 PM</small>
</div>
</div>
<h6 class="card-title fs-16"> Client Meeting with Alexis</h6>
<p class="text-muted text-truncate-two-lines mb-0"> A meeting is a gathering of two or
more people that has been convened for the purpose of achieving a common goal through
verbal interaction, such as sharing information or reaching agreement.</p>
</div>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="d-flex mb-3">
<div class="flex-grow-1"><i
class="mdi mdi-checkbox-blank-circle text-info me-2"></i><span
class="fw-medium">8 May 2024 </span></div>
<div class="flex-shrink-0"><small
class="badge bg-primary-subtle text-primary ms-auto">8:00 PM to 4:00 PM</small>
</div>
</div>
<h6 class="card-title fs-16"> Velzon Project Discussion with Team</h6>
<p class="text-muted text-truncate-two-lines mb-0"> Tell how to boost website traffic
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="simplebar-placeholder" style="width: 302px; height: 2502px;"></div>
</div>
<div class="simplebar-track simplebar-horizontal" style="visibility: hidden;">
<div class="simplebar-scrollbar" style="width: 0px; display: none;"></div>
</div>
<div class="simplebar-track simplebar-vertical" style="visibility: visible;">
<div class="simplebar-scrollbar"
style="height: 63px; display: block; transform: translate3d(0px, 0px, 0px);"></div>
</div>
</div>
</div>
<div class="card">
<div class="card-body bg-info-subtle">
<div class="d-flex">
<div class="flex-shrink-0">
<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-calendar text-info icon-dual-info">
<rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect>
<line x1="16" y1="2" x2="16" y2="6"></line>
<line x1="8" y1="2" x2="8" y2="6"></line>
<line x1="3" y1="10" x2="21" y2="10"></line>
</svg>
</div>
<div class="flex-grow-1 ms-3">
<h6 class="fs-15">Welcome to your Calendar!</h6>
<p class="text-muted mb-0">Event that applications book will appear here. Click on an event to see
the details and manage applicants event.</p>
</div>
</div>
</div>
</div>
<!--end card-->
</div> <!-- end col-->
<div class="col-xl-9">
<div class="card card-h-100">
<div class="card-body">
<div id="calendar" class="fc fc-media-screen fc-direction-ltr fc-theme-standard">
<div class="fc-header-toolbar fc-toolbar fc-toolbar-ltr">
<div class="fc-toolbar-chunk">
<div class="fc-button-group"><button type="button" title="Previous month"
aria-pressed="false" class="fc-prev-button fc-button fc-button-primary"><span
class="fc-icon fc-icon-chevron-left"></span></button><button type="button"
title="Next month" aria-pressed="false"
class="fc-next-button fc-button fc-button-primary"><span
class="fc-icon fc-icon-chevron-right"></span></button></div><button type="button"
title="This month" disabled="" aria-pressed="false"
class="fc-today-button fc-button fc-button-primary">today</button>
</div>
<div class="fc-toolbar-chunk">
<h2 class="fc-toolbar-title" id="fc-dom-1">April 2024</h2>
</div>
<div class="fc-toolbar-chunk">
<div class="fc-button-group"><button type="button" title="month view" aria-pressed="true"
class="fc-dayGridMonth-button fc-button fc-button-primary fc-button-active">month</button><button
type="button" title="week view" aria-pressed="false"
class="fc-timeGridWeek-button fc-button fc-button-primary">week</button><button
type="button" title="day view" aria-pressed="false"
class="fc-timeGridDay-button fc-button fc-button-primary">day</button><button type="button"
title="list view" aria-pressed="false"
class="fc-listMonth-button fc-button fc-button-primary">list</button></div>
</div>
</div>
<div aria-labelledby="fc-dom-1" class="fc-view-harness fc-view-harness-active"
style="height: 673.333px;">
<div class="fc-dayGridMonth-view fc-view fc-daygrid">
<table role="grid" class="fc-scrollgrid fc-scrollgrid-liquid">
<thead role="rowgroup">
<tr role="presentation" class="fc-scrollgrid-section fc-scrollgrid-section-header">
<th role="presentation">
<div class="fc-scroller-harness">
<div class="fc-scroller" style="overflow: hidden;">
<table role="presentation" class="fc-col-header" style="width: 906px;">
<colgroup></colgroup>
<thead role="presentation">
<tr role="row">
<th role="columnheader" class="fc-col-header-cell fc-day fc-day-sun">
<div class="fc-scrollgrid-sync-inner"><a aria-label="Sunday"
class="fc-col-header-cell-cushion">Sun</a></div>
</th>
<th role="columnheader" class="fc-col-header-cell fc-day fc-day-mon">
<div class="fc-scrollgrid-sync-inner"><a aria-label="Monday"
class="fc-col-header-cell-cushion">Mon</a></div>
</th>
<th role="columnheader" class="fc-col-header-cell fc-day fc-day-tue">
<div class="fc-scrollgrid-sync-inner"><a aria-label="Tuesday"
class="fc-col-header-cell-cushion">Tue</a></div>
</th>
<th role="columnheader" class="fc-col-header-cell fc-day fc-day-wed">
<div class="fc-scrollgrid-sync-inner"><a aria-label="Wednesday"
class="fc-col-header-cell-cushion">Wed</a></div>
</th>
<th role="columnheader" class="fc-col-header-cell fc-day fc-day-thu">
<div class="fc-scrollgrid-sync-inner"><a aria-label="Thursday"
class="fc-col-header-cell-cushion">Thu</a></div>
</th>
<th role="columnheader" class="fc-col-header-cell fc-day fc-day-fri">
<div class="fc-scrollgrid-sync-inner"><a aria-label="Friday"
class="fc-col-header-cell-cushion">Fri</a></div>
</th>
<th role="columnheader" class="fc-col-header-cell fc-day fc-day-sat">
<div class="fc-scrollgrid-sync-inner"><a aria-label="Saturday"
class="fc-col-header-cell-cushion">Sat</a></div>
</th>
</tr>
</thead>
</table>
</div>
</div>
</th>
</tr>
</thead>
<tbody role="rowgroup">
<tr role="presentation"
class="fc-scrollgrid-section fc-scrollgrid-section-body fc-scrollgrid-section-liquid">
<td role="presentation">
<div class="fc-scroller-harness fc-scroller-harness-liquid">
<div class="fc-scroller fc-scroller-liquid-absolute" style="overflow: hidden auto;">
<div class="fc-daygrid-body fc-daygrid-body-unbalanced" style="width: 906px;">
<table role="presentation" class="fc-scrollgrid-sync-table"
style="width: 906px; height: 634px;">
<colgroup></colgroup>
<tbody role="presentation">
<tr role="row">
<td aria-labelledby="fc-dom-2" role="gridcell" data-date="2024-03-31"
class="fc-day fc-day-sun fc-day-past fc-day-other fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to March 31, 2024"
data-navlink="" tabindex="0" id="fc-dom-2"
class="fc-daygrid-day-number">31</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-4" role="gridcell" data-date="2024-04-01"
class="fc-day fc-day-mon fc-day-past fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 1, 2024"
data-navlink="" tabindex="0" id="fc-dom-4"
class="fc-daygrid-day-number">1</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-event-harness" style="margin-top: 0px;"><a
tabindex="0"
class="fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-past bg-primary-subtle fc-daygrid-event fc-daygrid-block-event fc-h-event">
<div class="fc-event-main">
<div class="fc-event-main-frame">
<div class="fc-event-title-container">
<div class="fc-event-title fc-sticky">All Day Event</div>
</div>
</div>
</div>
<div class="fc-event-resizer fc-event-resizer-end"></div>
</a></div>
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-6" role="gridcell" data-date="2024-04-02"
class="fc-day fc-day-tue fc-day-past fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 2, 2024"
data-navlink="" tabindex="0" id="fc-dom-6"
class="fc-daygrid-day-number">2</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-8" role="gridcell" data-date="2024-04-03"
class="fc-day fc-day-wed fc-day-past fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 3, 2024"
data-navlink="" tabindex="0" id="fc-dom-8"
class="fc-daygrid-day-number">3</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-10" role="gridcell" data-date="2024-04-04"
class="fc-day fc-day-thu fc-day-past fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 4, 2024"
data-navlink="" tabindex="0" id="fc-dom-10"
class="fc-daygrid-day-number">4</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-12" role="gridcell" data-date="2024-04-05"
class="fc-day fc-day-fri fc-day-past fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 5, 2024"
data-navlink="" tabindex="0" id="fc-dom-12"
class="fc-daygrid-day-number">5</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-14" role="gridcell" data-date="2024-04-06"
class="fc-day fc-day-sat fc-day-past fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 6, 2024"
data-navlink="" tabindex="0" id="fc-dom-14"
class="fc-daygrid-day-number">6</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
</tr>
<tr role="row">
<td aria-labelledby="fc-dom-16" role="gridcell" data-date="2024-04-07"
class="fc-day fc-day-sun fc-day-past fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 7, 2024"
data-navlink="" tabindex="0" id="fc-dom-16"
class="fc-daygrid-day-number">7</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-18" role="gridcell" data-date="2024-04-08"
class="fc-day fc-day-mon fc-day-past fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 8, 2024"
data-navlink="" tabindex="0" id="fc-dom-18"
class="fc-daygrid-day-number">8</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-20" role="gridcell" data-date="2024-04-09"
class="fc-day fc-day-tue fc-day-past fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 9, 2024"
data-navlink="" tabindex="0" id="fc-dom-20"
class="fc-daygrid-day-number">9</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-22" role="gridcell" data-date="2024-04-10"
class="fc-day fc-day-wed fc-day-past fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 10, 2024"
data-navlink="" tabindex="0" id="fc-dom-22"
class="fc-daygrid-day-number">10</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-event-harness fc-daygrid-event-harness-abs"
style="top: 0px; left: 0px; right: -259px;"><a tabindex="0"
class="fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-past bg-warning-subtle fc-daygrid-event fc-daygrid-block-event fc-h-event">
<div class="fc-event-main">
<div class="fc-event-main-frame">
<div class="fc-event-title-container">
<div class="fc-event-title fc-sticky">Visit Online Course
</div>
</div>
</div>
</div>
<div class="fc-event-resizer fc-event-resizer-end"></div>
</a></div>
<div class="fc-daygrid-day-bottom" style="margin-top: 38px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-24" role="gridcell" data-date="2024-04-11"
class="fc-day fc-day-thu fc-day-past fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 11, 2024"
data-navlink="" tabindex="0" id="fc-dom-24"
class="fc-daygrid-day-number">11</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 38px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-26" role="gridcell" data-date="2024-04-12"
class="fc-day fc-day-fri fc-day-past fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 12, 2024"
data-navlink="" tabindex="0" id="fc-dom-26"
class="fc-daygrid-day-number">12</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 38px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-28" role="gridcell" data-date="2024-04-13"
class="fc-day fc-day-sat fc-day-past fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 13, 2024"
data-navlink="" tabindex="0" id="fc-dom-28"
class="fc-daygrid-day-number">13</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
</tr>
<tr role="row">
<td aria-labelledby="fc-dom-30" role="gridcell" data-date="2024-04-14"
class="fc-day fc-day-sun fc-day-past fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 14, 2024"
data-navlink="" tabindex="0" id="fc-dom-30"
class="fc-daygrid-day-number">14</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-32" role="gridcell" data-date="2024-04-15"
class="fc-day fc-day-mon fc-day-today fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 15, 2024"
data-navlink="" tabindex="0" id="fc-dom-32"
class="fc-daygrid-day-number">15</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-event-harness" style="margin-top: 0px;"><a
tabindex="0"
class="fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-today bg-success-subtle fc-daygrid-event fc-daygrid-block-event fc-h-event">
<div class="fc-event-main">
<div class="fc-event-main-frame">
<div class="fc-event-title-container">
<div class="fc-event-title fc-sticky">Meeting With Designer
</div>
</div>
</div>
</div>
<div class="fc-event-resizer fc-event-resizer-end"></div>
</a></div>
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-34" role="gridcell" data-date="2024-04-16"
class="fc-day fc-day-tue fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 16, 2024"
data-navlink="" tabindex="0" id="fc-dom-34"
class="fc-daygrid-day-number">16</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-event-harness" style="margin-top: 0px;"><a
tabindex="0"
class="fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-future bg-success-subtle fc-daygrid-event fc-daygrid-block-event fc-h-event">
<div class="fc-event-main">
<div class="fc-event-main-frame">
<div class="fc-event-title-container">
<div class="fc-event-title fc-sticky">Birthday Party</div>
</div>
</div>
</div>
<div class="fc-event-resizer fc-event-resizer-end"></div>
</a></div>
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-36" role="gridcell" data-date="2024-04-17"
class="fc-day fc-day-wed fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 17, 2024"
data-navlink="" tabindex="0" id="fc-dom-36"
class="fc-daygrid-day-number">17</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-38" role="gridcell" data-date="2024-04-18"
class="fc-day fc-day-thu fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 18, 2024"
data-navlink="" tabindex="0" id="fc-dom-38"
class="fc-daygrid-day-number">18</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-40" role="gridcell" data-date="2024-04-19"
class="fc-day fc-day-fri fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 19, 2024"
data-navlink="" tabindex="0" id="fc-dom-40"
class="fc-daygrid-day-number">19</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-event-harness fc-daygrid-event-harness-abs"
style="top: 0px; left: 0px; right: -130px;"><a tabindex="0"
class="fc-event fc-event-draggable fc-event-start fc-event-future bg-primary-subtle fc-daygrid-event fc-daygrid-block-event fc-h-event">
<div class="fc-event-main">
<div class="fc-event-main-frame">
<div class="fc-event-title-container">
<div class="fc-event-title fc-sticky">Repeating Event</div>
</div>
</div>
</div>
</a></div>
<div class="fc-daygrid-day-bottom" style="margin-top: 38px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-42" role="gridcell" data-date="2024-04-20"
class="fc-day fc-day-sat fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 20, 2024"
data-navlink="" tabindex="0" id="fc-dom-42"
class="fc-daygrid-day-number">20</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 38px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
</tr>
<tr role="row">
<td aria-labelledby="fc-dom-44" role="gridcell" data-date="2024-04-21"
class="fc-day fc-day-sun fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 21, 2024"
data-navlink="" tabindex="0" id="fc-dom-44"
class="fc-daygrid-day-number">21</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-event-harness fc-daygrid-event-harness-abs"
style="top: 0px; left: 0px; right: -259px;"><a tabindex="0"
class="fc-event fc-event-draggable fc-event-resizable fc-event-end fc-event-future bg-primary-subtle fc-daygrid-event fc-daygrid-block-event fc-h-event">
<div class="fc-event-main">
<div class="fc-event-main-frame">
<div class="fc-event-title-container">
<div class="fc-event-title fc-sticky">Repeating Event</div>
</div>
</div>
</div>
<div class="fc-event-resizer fc-event-resizer-end"></div>
</a></div>
<div class="fc-daygrid-day-bottom" style="margin-top: 38px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-46" role="gridcell" data-date="2024-04-22"
class="fc-day fc-day-mon fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 22, 2024"
data-navlink="" tabindex="0" id="fc-dom-46"
class="fc-daygrid-day-number">22</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 38px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-48" role="gridcell" data-date="2024-04-23"
class="fc-day fc-day-tue fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 23, 2024"
data-navlink="" tabindex="0" id="fc-dom-48"
class="fc-daygrid-day-number">23</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 38px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-50" role="gridcell" data-date="2024-04-24"
class="fc-day fc-day-wed fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 24, 2024"
data-navlink="" tabindex="0" id="fc-dom-50"
class="fc-daygrid-day-number">24</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-event-harness fc-daygrid-event-harness-abs"
style="top: 0px; left: 0px; right: -129.5px;"><a tabindex="0"
class="fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-future bg-danger-subtle fc-daygrid-event fc-daygrid-block-event fc-h-event">
<div class="fc-event-main">
<div class="fc-event-main-frame">
<div class="fc-event-title-container">
<div class="fc-event-title fc-sticky">Weekly Strategy
Planning</div>
</div>
</div>
</div>
<div class="fc-event-resizer fc-event-resizer-end"></div>
</a></div>
<div class="fc-daygrid-day-bottom" style="margin-top: 38px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-52" role="gridcell" data-date="2024-04-25"
class="fc-day fc-day-thu fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 25, 2024"
data-navlink="" tabindex="0" id="fc-dom-52"
class="fc-daygrid-day-number">25</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 38px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-54" role="gridcell" data-date="2024-04-26"
class="fc-day fc-day-fri fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 26, 2024"
data-navlink="" tabindex="0" id="fc-dom-54"
class="fc-daygrid-day-number">26</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-56" role="gridcell" data-date="2024-04-27"
class="fc-day fc-day-sat fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 27, 2024"
data-navlink="" tabindex="0" id="fc-dom-56"
class="fc-daygrid-day-number">27</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
</tr>
<tr role="row">
<td aria-labelledby="fc-dom-58" role="gridcell" data-date="2024-04-28"
class="fc-day fc-day-sun fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 28, 2024"
data-navlink="" tabindex="0" id="fc-dom-58"
class="fc-daygrid-day-number">28</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-event-harness" style="margin-top: 0px;"><a
href="http://google.com/"
class="fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-future bg-dark-subtle fc-daygrid-event fc-daygrid-block-event fc-h-event">
<div class="fc-event-main">
<div class="fc-event-main-frame">
<div class="fc-event-title-container">
<div class="fc-event-title fc-sticky">Click for Google</div>
</div>
</div>
</div>
<div class="fc-event-resizer fc-event-resizer-end"></div>
</a></div>
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-60" role="gridcell" data-date="2024-04-29"
class="fc-day fc-day-mon fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 29, 2024"
data-navlink="" tabindex="0" id="fc-dom-60"
class="fc-daygrid-day-number">29</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-62" role="gridcell" data-date="2024-04-30"
class="fc-day fc-day-tue fc-day-future fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to April 30, 2024"
data-navlink="" tabindex="0" id="fc-dom-62"
class="fc-daygrid-day-number">30</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-64" role="gridcell" data-date="2024-05-01"
class="fc-day fc-day-wed fc-day-future fc-day-other fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to May 1, 2024"
data-navlink="" tabindex="0" id="fc-dom-64"
class="fc-daygrid-day-number">1</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-66" role="gridcell" data-date="2024-05-02"
class="fc-day fc-day-thu fc-day-future fc-day-other fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to May 2, 2024"
data-navlink="" tabindex="0" id="fc-dom-66"
class="fc-daygrid-day-number">2</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-68" role="gridcell" data-date="2024-05-03"
class="fc-day fc-day-fri fc-day-future fc-day-other fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to May 3, 2024"
data-navlink="" tabindex="0" id="fc-dom-68"
class="fc-daygrid-day-number">3</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-70" role="gridcell" data-date="2024-05-04"
class="fc-day fc-day-sat fc-day-future fc-day-other fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to May 4, 2024"
data-navlink="" tabindex="0" id="fc-dom-70"
class="fc-daygrid-day-number">4</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
</tr>
<tr role="row">
<td aria-labelledby="fc-dom-72" role="gridcell" data-date="2024-05-05"
class="fc-day fc-day-sun fc-day-future fc-day-other fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to May 5, 2024"
data-navlink="" tabindex="0" id="fc-dom-72"
class="fc-daygrid-day-number">5</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-74" role="gridcell" data-date="2024-05-06"
class="fc-day fc-day-mon fc-day-future fc-day-other fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to May 6, 2024"
data-navlink="" tabindex="0" id="fc-dom-74"
class="fc-daygrid-day-number">6</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-76" role="gridcell" data-date="2024-05-07"
class="fc-day fc-day-tue fc-day-future fc-day-other fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to May 7, 2024"
data-navlink="" tabindex="0" id="fc-dom-76"
class="fc-daygrid-day-number">7</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-event-harness fc-daygrid-event-harness-abs"
style="top: 0px; left: 0px; right: -129.5px;"><a tabindex="0"
class="fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-future bg-danger-subtle fc-daygrid-event fc-daygrid-block-event fc-h-event">
<div class="fc-event-main">
<div class="fc-event-main-frame">
<div class="fc-event-title-container">
<div class="fc-event-title fc-sticky">Client Meeting with
Alexis</div>
</div>
</div>
</div>
<div class="fc-event-resizer fc-event-resizer-end"></div>
</a></div>
<div class="fc-daygrid-day-bottom" style="margin-top: 38px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-78" role="gridcell" data-date="2024-05-08"
class="fc-day fc-day-wed fc-day-future fc-day-other fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to May 8, 2024"
data-navlink="" tabindex="0" id="fc-dom-78"
class="fc-daygrid-day-number">8</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-event-harness" style="margin-top: 38px;"><a
tabindex="0"
class="fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-future bg-info-subtle fc-daygrid-event fc-daygrid-block-event fc-h-event">
<div class="fc-event-main">
<div class="fc-event-main-frame">
<div class="fc-event-title-container">
<div class="fc-event-title fc-sticky">Velzon Project
Discussion with Team</div>
</div>
</div>
</div>
<div class="fc-event-resizer fc-event-resizer-end"></div>
</a></div>
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-80" role="gridcell" data-date="2024-05-09"
class="fc-day fc-day-thu fc-day-future fc-day-other fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to May 9, 2024"
data-navlink="" tabindex="0" id="fc-dom-80"
class="fc-daygrid-day-number">9</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-82" role="gridcell" data-date="2024-05-10"
class="fc-day fc-day-fri fc-day-future fc-day-other fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to May 10, 2024"
data-navlink="" tabindex="0" id="fc-dom-82"
class="fc-daygrid-day-number">10</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
<td aria-labelledby="fc-dom-84" role="gridcell" data-date="2024-05-11"
class="fc-day fc-day-sat fc-day-future fc-day-other fc-daygrid-day">
<div class="fc-daygrid-day-frame fc-scrollgrid-sync-inner">
<div class="fc-daygrid-day-top"><a title="Go to May 11, 2024"
data-navlink="" tabindex="0" id="fc-dom-84"
class="fc-daygrid-day-number">11</a></div>
<div class="fc-daygrid-day-events">
<div class="fc-daygrid-day-bottom" style="margin-top: 0px;"></div>
</div>
<div class="fc-daygrid-day-bg"></div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div><!-- end col -->
</div>
<!--end row-->
<div style="clear:both"></div>
<!-- Add New Event MODAL -->
<div class="modal fade" id="event-modal" tabindex="-1" style="display: none;" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content border-0">
<div class="modal-header bg-info-subtle p-3">
<h5 class="modal-title" id="modal-title">Add Event</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-hidden="true"></button>
</div>
<div class="modal-body p-4">
<form class="needs-validation" name="event-form" id="form-event" novalidate="">
<div class="text-end">
<a href="#" class="btn btn-sm btn-soft-primary" id="edit-event-btn"
data-id="new-event" onclick="editEvent(this)" role="button" hidden="true">Edit</a>
</div>
<div class="event-details">
<div class="d-flex mb-2">
<div class="flex-grow-1 d-flex align-items-center">
<div class="me-3 flex-shrink-0">
<i class="ri-calendar-event-line text-muted fs-16"></i>
</div>
<div class="flex-grow-1">
<h6 class="d-none fw-semibold mb-0" id="event-start-date-tag"></h6>
</div>
</div>
</div>
<div class="d-flex align-items-center mb-2">
<div class="me-3 flex-shrink-0">
<i class="ri-time-line text-muted fs-16"></i>
</div>
<div class="flex-grow-1">
<h6 class="d-block fw-semibold mb-0"><span id="event-timepicker1-tag"></span> - <span
id="event-timepicker2-tag"></span></h6>
</div>
</div>
<div class="d-flex align-items-center mb-2">
<div class="me-3 flex-shrink-0">
<i class="ri-map-pin-line text-muted fs-16"></i>
</div>
<div class="flex-grow-1">
<h6 class="d-block fw-semibold mb-0"> <span id="event-location-tag"></span></h6>
</div>
</div>
<div class="d-flex mb-3">
<div class="me-3 flex-shrink-0">
<i class="ri-discuss-line text-muted fs-16"></i>
</div>
<div class="flex-grow-1">
<p class="d-none text-muted mb-0" id="event-description-tag"></p>
</div>
</div>
</div>
<div class="row event-form">
<div class="col-12">
<div class="mb-3">
<label class="form-label">Type</label>
<div class="choices" data-type="select-one" tabindex="0" role="listbox"
aria-haspopup="true" aria-expanded="false">
<div class="choices__inner"><select class="form-select d-block choices__input"
name="category" id="event-category" required="" hidden="" tabindex="-1"
data-choice="active">
<option value="bg-danger-subtle" data-custom-properties="[object Object]">Danger
</option>
</select>
<div class="choices__list choices__list--single">
<div class="choices__item choices__item--selectable" data-item="" data-id="1"
data-value="bg-danger-subtle" data-custom-properties="[object Object]"
aria-selected="true">Danger</div>
</div>
</div>
<div class="choices__list choices__list--dropdown" aria-expanded="false">
<div class="choices__list" role="listbox">
<div id="choices--event-category-item-choice-1"
class="choices__item choices__item--choice is-selected choices__item--selectable is-highlighted"
role="option" data-choice="" data-id="1" data-value="bg-danger-subtle"
data-select-text="Press to select" data-choice-selectable="" aria-selected="true">
Danger</div>
<div id="choices--event-category-item-choice-2"
class="choices__item choices__item--choice choices__item--selectable" role="option"
data-choice="" data-id="2" data-value="bg-dark-subtle"
data-select-text="Press to select" data-choice-selectable="">Dark</div>
<div id="choices--event-category-item-choice-3"
class="choices__item choices__item--choice choices__item--selectable" role="option"
data-choice="" data-id="3" data-value="bg-info-subtle"
data-select-text="Press to select" data-choice-selectable="">Info</div>
<div id="choices--event-category-item-choice-4"
class="choices__item choices__item--choice choices__item--selectable" role="option"
data-choice="" data-id="4" data-value="bg-primary-subtle"
data-select-text="Press to select" data-choice-selectable="">Primary</div>
<div id="choices--event-category-item-choice-5"
class="choices__item choices__item--choice choices__item--selectable" role="option"
data-choice="" data-id="5" data-value="bg-success-subtle"
data-select-text="Press to select" data-choice-selectable="">Success</div>
<div id="choices--event-category-item-choice-6"
class="choices__item choices__item--choice choices__item--selectable" role="option"
data-choice="" data-id="6" data-value="bg-warning-subtle"
data-select-text="Press to select" data-choice-selectable="">Warning</div>
</div>
</div>
</div>
<div class="invalid-feedback">Please select a valid event category</div>
</div>
</div>
<!--end col-->
<div class="col-12">
<div class="mb-3">
<label class="form-label">Event Name</label>
<input class="form-control d-block" placeholder="Enter event name" type="text"
name="title" id="event-title" required="" value="">
<div class="invalid-feedback">Please provide a valid event name</div>
</div>
</div>
<!--end col-->
<div class="col-12">
<div class="mb-3">
<label>Event Date</label>
<div class="input-group">
<input type="text" id="event-start-date"
class="form-control flatpickr flatpickr-input" placeholder="Select date"
required="" value="" readonly="readonly">
<span class="input-group-text"><i class="ri-calendar-event-line"></i></span>
</div>
</div>
</div>
<!--end col-->
<div class="col-12" id="event-time">
<div class="row">
<div class="col-6">
<div class="mb-3">
<label class="form-label">Start Time</label>
<div class="input-group">
<input id="timepicker1" type="hidden"
class="form-control flatpickr flatpickr-input" placeholder="Select start time"
value="" readonly="readonly"><input
class="form-control flatpickr flatpickr-input flatpickr-mobile" tabindex="1"
type="time" placeholder="Select start time">
<span class="input-group-text"><i class="ri-time-line"></i></span>
</div>
</div>
</div>
<div class="col-6">
<div class="mb-3">
<label class="form-label">End Time</label>
<div class="input-group">
<input id="timepicker2" type="hidden"
class="form-control flatpickr flatpickr-input" placeholder="Select end time"
value="" readonly="readonly"><input
class="form-control flatpickr flatpickr-input flatpickr-mobile" tabindex="1"
type="time" placeholder="Select end time">
<span class="input-group-text"><i class="ri-time-line"></i></span>
</div>
</div>
</div>
</div>
</div>
<!--end col-->
<div class="col-12">
<div class="mb-3">
<label for="event-location">Location</label>
<div>
<input type="text" class="form-control d-block" name="event-location"
id="event-location" placeholder="Event location">
</div>
</div>
</div>
<!--end col-->
<input type="hidden" id="eventid" name="eventid" value="">
<div class="col-12">
<div class="mb-3">
<label class="form-label">Description</label>
<textarea class="form-control d-block" id="event-description" placeholder="Enter a description" rows="3"
spellcheck="false"></textarea>
</div>
</div>
<!--end col-->
</div>
<!--end row-->
<div class="hstack justify-content-end gap-2">
<button type="button" class="btn btn-soft-danger" id="btn-delete-event" hidden="true"><i
class="ri-close-line align-bottom"></i> Delete</button>
<button type="submit" class="btn btn-success" id="btn-save-event">Add Event</button>
</div>
</form>
</div>
</div> <!-- end modal-content-->
</div> <!-- end modal dialog-->
</div> <!-- end modal-->
<!-- end modal-->
</div>
</div>
</div>
</div>
@endsection