parent
41f88d9e24
commit
8d304d8bbf
7 changed files with 222 additions and 9 deletions
@ -0,0 +1,82 @@ |
||||
/*! Zabuto Calendar - v2.1.0 - 2022-12-29 |
||||
* https://github.com/zabuto/calendar |
||||
* Copyright (c) 2022 Anke Heijnen; Licensed MIT */ |
||||
.zabuto-calendar { |
||||
width: 100%; |
||||
margin: 0; |
||||
padding: 0 |
||||
} |
||||
|
||||
.zabuto-calendar__navigation__item--next, |
||||
.zabuto-calendar__navigation__item--prev { |
||||
text-align: center; |
||||
cursor: pointer |
||||
} |
||||
|
||||
.zabuto-calendar__navigation__item--header { |
||||
text-align: center |
||||
} |
||||
|
||||
.zabuto-calendar__navigation__item--header__title { |
||||
cursor: pointer; |
||||
font-weight: bolder |
||||
} |
||||
|
||||
.zabuto-calendar__days-of-week__item { |
||||
text-align: center |
||||
} |
||||
|
||||
.zabuto-calendar__day { |
||||
text-align: center |
||||
} |
||||
|
||||
.zabuto-calendar__day--today { |
||||
text-align: center |
||||
} |
||||
|
||||
.zabuto-calendar.table td, |
||||
.zabuto-calendar.table th { |
||||
vertical-align: middle |
||||
} |
||||
|
||||
.zabuto-calendar.table thead td { |
||||
padding-top: 14px; |
||||
padding-bottom: 14px; |
||||
background-color: #fafafa |
||||
} |
||||
|
||||
.zabuto-calendar.table-bordered thead td { |
||||
border: 0 |
||||
} |
||||
|
||||
.zabuto-calendar.table thead th { |
||||
background-color: #f0f0f0 |
||||
} |
||||
|
||||
.zabuto-calendar.table>thead:first-child>tr:first-child>td { |
||||
border-top: 1px solid #ddd |
||||
} |
||||
|
||||
.zabuto-calendar.table>thead>tr>th { |
||||
border-bottom: 2px solid #ddd |
||||
} |
||||
|
||||
.zabuto-calendar.table>tbody td { |
||||
width: calc(100% / 7) |
||||
} |
||||
|
||||
.zabuto-calendar.table>tbody>tr:last-child>td { |
||||
border-bottom: 1px solid #ddd |
||||
} |
||||
|
||||
.zabuto-calendar.table>tbody td .badge { |
||||
font-size: 100% |
||||
} |
||||
|
||||
.zabuto-calendar.clickable>tbody td { |
||||
cursor: pointer |
||||
} |
||||
|
||||
.zabuto-calendar.table.clickable>tbody td:hover { |
||||
background-color: #f0f0f0 |
||||
} |
File diff suppressed because one or more lines are too long
@ -0,0 +1,64 @@ |
||||
@extends('layout.app') |
||||
@section('title') |
||||
<title>Book an Appointment</title> |
||||
<meta name="description" content="ET Education and Visa Services, presented by Extratech, is an adept provider of excellent education consultation, information, and visa guidance solution to students seeking schooling abroad."> |
||||
<meta name="robots" content="index, follow" /> |
||||
<meta property="og:url" content="" /> |
||||
<meta property="og:image" content="{{url('frontend/images/banner.png')}}"/> |
||||
<meta property="og:title" content="ET-Visas"/> |
||||
<meta property="og:description" content="ET Education and Visa Services, presented by Extratech, is an adept provider of excellent education consultation, information, and visa guidance solution to students seeking schooling abroad."/> |
||||
@endsection |
||||
@section('content') |
||||
<section class="appointment-section"> |
||||
<div class="row"> |
||||
<div class="col-md-6"> |
||||
<h1>Book an Appointment</h1> |
||||
<div class="appointment-cards"> |
||||
<a href="" class="appointment-card"> |
||||
<div class="appointment-card-img"> |
||||
<img src="{{url('frontend/icons/visa-approved.svg')}}" class="img-fluid" alt=""> |
||||
</div> |
||||
<div> |
||||
<h3>Education Services</h3> |
||||
</div> |
||||
</a> |
||||
<a href="" class="appointment-card"> |
||||
<div class="appointment-card-img"> |
||||
<img src="{{url('frontend/icons/visa-approved.svg')}}" class="img-fluid" alt=""> |
||||
</div> |
||||
<div> |
||||
<h3>Education Services</h3> |
||||
</div> |
||||
</a> |
||||
</div> |
||||
</div> |
||||
<div class="col-md-6"> |
||||
<div class="calender-section"> |
||||
<div class="claender-top"> |
||||
<p>Time Zone:</p> |
||||
<h5>Australia / Sydney</h5> |
||||
</div> |
||||
<h2>Select available date</h2> |
||||
<h3>Education services | 30 mins</h3> |
||||
<div id="demo-calendar-apppearance"></div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</section> |
||||
@endsection |
||||
@section('script') |
||||
<script> |
||||
$(document).ready(function () { |
||||
$("#demo-calendar-apppearance").zabuto_calendar({ |
||||
classname: 'table clickable table-bordered lightgrey-weekends', |
||||
week_starts: 'monday', |
||||
show_days: true, |
||||
today_markup: '<span class="badge bg-primary">[day]</span>', |
||||
navigation_markup: { |
||||
prev: '<i class="fas fa-chevron-circle-left"></i>', |
||||
next: '<i class="fas fa-chevron-circle-right"></i>' |
||||
} |
||||
}); |
||||
}); |
||||
</script> |
||||
@endsection |
Loading…
Reference in new issue