Skip to content

W
Website
Commit d7f0bd20 authored by I.K Seneviratne's avatar I.K Seneviratne
Browse files
Options

Committing the major changes in the Research Project Scope section.

parent 5ad0297b
Show whitespace changes
Inline Side-by-side
Showing with 638 additions and 49 deletions
assets/img/literature_survey/tophat_logo.svg 0 → 100644
View file @ d7f0bd20
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 220.92 30.16"><path d="M47.21 30.16c-8.8 0-14.21-6.28-14.21-15.08S38.41 0 47.21 0s14.24 6.28 14.24 15.08S56 30.16 47.21 30.16zm0-25.16c-5.45 0-8.38 4.19-8.38 10.05s2.93 10.05 8.38 10.05 8.38-4.19 8.38-10.05S52.66 5 47.21 5zm40.88 13h-8l-.42.42v10.9l-.42.42h-5l-.42-.42V.84l.42-.42h13.84c5.86 0 10.05 2.93 10.05 8.8S94 18 88.09 18zm0-12.57h-8l-.42.42v6.7l.42.42h8c2.51 0 4.19-.84 4.19-3.77s-1.67-3.75-4.19-3.75zM149.14.42h-5.03l-.42.42v10.51l-.41.41h-12.04v5.87h12.04l.41.42v11.27l.42.42h5.03l.42-.42V.84l-.42-.42zm39.08 29.32h-3.77l-.42-.42-2.09-5.45-.84-.42h-10.47l-.84.42-2.09 5.45-.42.42h-3.77l-.42-.42v-4.19L172.72.84l.42-.42h5.45l.42.42 9.63 24.3v4.19zM176.07 8h-.42l-3.76 10 .42.42h7.12l.42-.42zm44.43-2.55h-8.38l-.42.42v23.45l-.42.42h-5l-.42-.42V5.86l-.42-.42H197l-.38-.44V.84l.38-.42h23.5l.42.42V5zm-196.62 0H15.5l-.42.42v23.45l-.42.42h-5l-.42-.42V5.86l-.44-.41H.42L0 5V.84L.42.42h23.46l.42.42V5zM131.24.83v10.93h-5.45l-.41-.42V.83l.41-.41h5.03l.42.41zm0 16.8v11.69l-.42.42h-5.03l-.41-.42V18.05l.41-.42h5.45z" fill="#934af4" data-name="Layer 2"/></svg>
\ No newline at end of file
index.html
View file @ d7f0bd20
...@@ -17,6 +17,10 @@ ...@@ -17,6 +17,10 @@
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i" <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i"
rel="stylesheet"> rel="stylesheet">
<!--font awesome link-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- Vendor CSS Files --> <!-- Vendor CSS Files -->
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/vendor/icofont/icofont.min.css" rel="stylesheet"> <link href="assets/vendor/icofont/icofont.min.css" rel="stylesheet">
...@@ -28,13 +32,30 @@ ...@@ -28,13 +32,30 @@
<!-- Template Main CSS File --> <!-- Template Main CSS File -->
<link href="assets/css/style.css" rel="stylesheet"> <link href="assets/css/style.css" rel="stylesheet">
<!-- links for the timeine--> <script src="assets/vendor/jquery/jquery.min.js"></script>
<!-- links for the timeline-->
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet" <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet"
id="bootstrap-css"> id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<link rel="stylesheet" href="assets/css/timeline.css"> <link rel="stylesheet" href="assets/css/timeline.css">
<style>
th.diagonalFalling {
background: linear-gradient(to right top, #ffffff 0%, #ffffff 49.9%, #000000 50%, #000000 51%, #ffffff 51.1%, #ffffff 100%);
}
.fa-check {
color: green;
}
.fa-times {
color: red;
}
</style>
<!-- ======================================================= <!-- =======================================================
* Template Name: Bocor - v2.1.0 * Template Name: Bocor - v2.1.0
* Template URL: https://bootstrapmade.com/bocor-bootstrap-template-nice-animation/ * Template URL: https://bootstrapmade.com/bocor-bootstrap-template-nice-animation/
...@@ -74,8 +95,7 @@ ...@@ -74,8 +95,7 @@
<section id="hero"> <section id="hero">
<div class="container"> <div class="container">
<div class="row d-flex align-items-center" <div class="row d-flex align-items-center">
">
<div class=" col-lg-6 py-5 py-lg-0 order-2 order-lg-1" data-aos="fade-right"> <div class=" col-lg-6 py-5 py-lg-0 order-2 order-lg-1" data-aos="fade-right">
<h1>Taking the classroom monitoring to the next level with SLPES</h1> <h1>Taking the classroom monitoring to the next level with SLPES</h1>
<h2>We are team of talanted designers making websites with Bootstrap</h2> <h2>We are team of talanted designers making websites with Bootstrap</h2>
...@@ -94,64 +114,630 @@ ...@@ -94,64 +114,630 @@
<main id="main"> <main id="main">
<!-- ======= Clients Section ======= --> <!-- ======= Research Scope Section ======= -->
<section id="researchScope" class="researchScope section-bg"> <section id="researchScope" class="researchScope section-bg">
<div class="container"> <div class="container">
<div class="row no-gutters clients-wrap clearfix wow fadeInUp"> <div class="section-title">
<h2 data-aos="fade-in">Research Project Scope</h2>
<!-- <p data-aos="fade-in">Magnam dolores commodi suscipit. Necessitatibus eius consequatur ex aliquid fuga eum quidem. Sit sint consectetur velit. Quisquam quos quisquam cupiditate. Et nemo qui impedit suscipit alias ea. Quia fugiat sit in iste officiis commodi quidem hic quas.</p>-->
</div>
<!--nav tabs-->
<ul class="nav nav-tabs nav-fill" id="nav_bar" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="lit-survey-tab" data-toggle="tab" href="#lit_survey" role="tab"
aria-controls="lit_survey" aria-selected="false">Literature Survey</a>
</li>
<li class="nav-item">
<a class="nav-link" id="research-gap-tab" data-toggle="tab" href="#research_gap"
role="tab" aria-controls="research_gap" aria-selected="false">Research Gap</a>
</li>
<li class="nav-item">
<a class="nav-link" id="research-problem-tab" data-toggle="tab" href="#research_problem"
role="tab" aria-controls="research_problem" aria-selected="false">Research Problem</a>
</li>
<li class="nav-item">
<a class="nav-link" id="research-objectives-tab" data-toggle="tab" href="#research_objectives"
role="tab" aria-controls="research_objectives" aria-selected="false">Research Objectives</a>
</li>
<li class="nav-item">
<a class="nav-link" id="methodology-tab" data-toggle="tab" href="#methodology"
role="tab" aria-controls="methodology" aria-selected="false">Methodology</a>
</li>
<li class="nav-item">
<a class="nav-link" id="technologies-used-tab" data-toggle="tab" href="#technologies_used"
role="tab" aria-controls="technologies_used" aria-selected="false">Technologies used</a>
</li>
</ul>
<!--tab content-->
<div class="tab-content" id="tabContentDetails">
<!--literature_survey-->
<div class="tab-pane fade in active" id="lit_survey" role="tabpanel">
<h2>Literature Survey</h2>
<!--1st row-->
<div class="row">
<!--1st column-->
<div class="col-lg-6">
<div class="card m-4" data-aos="fade-right">
<div class="card-header text-white bg-secondary">
<h4 class="font-weight-bold">ClassDojo</h4>
</div>
<div class="card-body">
<p class="card-text">Software that encourages positive classroom behavior by
awarding points for
participation</p>
<h5 class="font-weight-bold">Best For: </h5>
<ul type="square">
<li>Teachers</li>
<li>School leaders</li>
<li>Families</li>
</ul>
<h5 class="font-weight-bold">Features</h5>
<p class="card-text">
Useful for
classrooms, Real-time chat facility.
</p>
</div>
</div>
</div>
<!--end of 1st column-->
<div class="col-lg-2 p-4" data-aos="fade-right">
<img src="assets/img/literature_survey/class_dojo.jpg" alt="">
</div>
</div>
<!--end of 1st row-->
<!--2nd row-->
<div class="row">
<div class="col-lg-6"></div>
<div class="col-lg-4">
<div class="card m-4" data-aos="fade-left">
<div class="card-header text-white bg-secondary">
<h4 class="font-weight-bold">TopHat</h4>
</div>
<div class="card-body">
<p class="card-text">The Top Hat app motivates students to engage with course
content, participate in
class and ultimately master your material.
</p>
<p class="card-text">
Run discussions in your classroom, assign interactive readings and quiz for
understanding, all with one easy-to-use interface.
</p>
<h5 class="font-weight-bold">Features</h5>
<ul type="square">
<li>Get real-time feedback on student progress.</li>
<li>Leverage students' devices in class to increase participation.</li>
<li>Upload your slides easily and add interactive questions.</li>
<li>Take attendance effortlessly and prevent absent students from bending the
rules.
</li>
<li>Launch real-time polls to gauge student understanding.</li>
</ul>
</div>
</div>
</div>
<div class="col-lg-2 p-4" data-aos="fade-left">
<img src="assets/img/literature_survey/tophat_logo.svg" alt="">
</div>
</div>
<!--end of 2nd row-->
<!--3rd row-->
<div class="row">
<div class="col-lg-6">
<div class="card m-4" data-aos="fade-right">
<div class="card-header text-white bg-secondary">
<h4 class="font-weight-bold">AI-enabled classrooms in China</h4>
</div>
<div class="card-body">
<p class="card-text">
A High School in Hangzhou, China has installed cameras which are designed to
mark attendance automatically and track activities that students are engaging
in,
including reading, writing or listening.
</p>
<p class="card-text">
In addition, students’ real-time emotions such as fear, happiness, sadness,
surprise, disgust, anger and neutral are also tracked.
</p>
</div>
</div>
</div>
<div class="col-lg-2 p-4" data-aos="fade-right">
<img src="assets/img/literature_survey/AI_china.jpg" alt="">
</div>
</div>
<!--end of 3rd row-->
<!--4th row-->
<div class="row">
<div class="col-lg-6"></div>
<div class="col-lg-4">
<div class="card m-4" data-aos="fade-left">
<div class="card-header text-white bg-secondary">
<h4 class="font-weight-bold">EduSense: Practical Classroom Sensing at Scale</h4>
</div>
<div class="card-body">
<p class="card-text">
EduSense is a comprehensive, open source, sensing system that produces a
plethora of theoretically-motivated visual and audio features correlated with
effective instruction, which can feed professional development tools in much the
same way as a Fitbit sensor reports step count to an end user app
</p>
<p class="card-text">
The system consists of 3 main components as follows.
</p>
<ul type="disc">
<li>Body Segmentation, Keypoints and Interframe tracking</li>
<li>Facial Landmarks</li>
<li>Speech Detection</li>
</ul>
</div>
</div>
</div>
<div class="col-lg-2 p-4" data-aos="fade-left">
<img src="assets/img/literature_survey/edusense.PNG" alt="">
</div>
</div>
<!--end of 4th row-->
</div>
<!-- end of literature_survey-->
<!--research gap-->
<div class="tab-pane fade" id="research_gap" role="tabpanel">
<h2>Research Gap</h2>
<!--research gap table-->
<table class="table table-striped">
<thead>
<tr>
<th class="diagonalFalling"></th>
<th>AI Systems in China</th>
<th>TopHat</th>
<th>ClassDojo</th>
<th>EduSense</th>
<th>SLPES</th>
</tr>
</thead>
<tbody>
<tr>
<td>Attendance Register</td>
<td>
<i class="fa fa-check fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-check fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-check fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-times fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-check fa-3x" aria-hidden="true"></i>
</td>
</tr>
<tr>
<td>Monitoring Student Behavior</td>
<td>
<i class="fa fa-check fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-times fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-times fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-times fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-check fa-3x" aria-hidden="true"></i>
</td>
</tr>
<tr>
<td>Lecture Summarizing</td>
<td>
<i class="fa fa-times fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-check fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-times fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-check fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-check fa-3x" aria-hidden="true"></i>
</td>
</tr>
<tr>
<td>Monitoring Lecturer Performance</td>
<td>
<i class="fa fa-times fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-times fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-times fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-times fa-3x" aria-hidden="true"></i>
</td>
<td>
<i class="fa fa-check fa-3x" aria-hidden="true"></i>
</td>
</tr>
</tbody>
</table>
<!--end of research gap table-->
</div>
<!-- end of research gap-->
<!--research problem-->
<div class="tab-pane fade" id="research_problem" role="tabpanel">
<h2>Research Problem</h2>
<ul class="list-group">
<li class="mx-4">
“What is the optimum way of tracking student attendance in a much efficient way
and how does the lecturer analyze reasons for student absenteeism?” (Q1).
</li>
<li class="mx-4">
“Does a correlation exist between lecturing style and student behavior in the
classroom and how can Computer Vision and Artificial Intelligence be
incorporated in determining this relationship?” (Q2).
</li>
<li class="mx-4">
“How to summarize the lecture content to enable students to pay more attention
to the lecture and reduce time spent for taking notes?” (Q3).
</li>
<li class="mx-4">
“How to evaluate lecture performance by tracking their behavior during a lecture
and analyzing the quality of the lecture content which is delivered by the
lecturer?” (Q4).
</li>
</ul>
</div>
<!-- end of research problem-->
<!--research objectives-->
<div class="tab-pane fade" id="research_objectives" role="tabpanel">
<h2>Research Objectives</h2>
<!--1st row-->
<div class="row" data-aos="fade-right">
<div class="col-lg-8">
<div class="card shadow-lg">
<div class="card-header text-white bg-primary">
<h2>Main Objectives</h2>
</div>
<div class="card-body">
<div class="row">
<div class="col-lg-10">
<span class="font-weight-bold" style="text-align: justify">
Tracking student attendance using facial detection and facial recognition,
notify
and getting opinion from the students who are absent and students who are
leaving
the lecture in the during a specified time period.
</span>
</div>
<div class="col-lg-2">
<img src="assets/img/objectives/face_recognition.jpg" alt="" height="100" width="100">
</div>
</div>
<hr style="border: 2px solid black">
<div class="row">
<div class="col-lg-10">
<span class="font-weight-bold" style="text-align: justify">
Monitoring student behavior within the classroom during lecture periods to
identify potential problem areas in retaining student attention and adapting
the
lecturing styles to suit the student needs.
</span>
</div>
<div class="col-lg-2">
<img src="assets/img/objectives/monitoring.jpg" alt="" height="100" width="100">
</div>
</div>
<hr style="border: 2px solid black">
<div class="row">
<div class="col-lg-10">
<span class="font-weight-bold" style="text-align: justify">
Summarize the converted text and present as a document and identify the
important points of the lecture to display them highlighted.
</span>
</div>
<div class="col-lg-2">
<img src="assets/img/objectives/speech_to_text.png" alt="" height="100" width="100">
</div>
</div>
<hr style="border: 2px solid black">
<div class="row">
<div class="col-lg-10">
<span class="font-weight-bold" style="text-align: justify">
Monitoring lecturers’ behavior by analyzing the lecture audio data recorded
in a
lecture hall during lecture hours.
</span>
</div>
<div class="col-lg-2">
<img src="assets/img/objectives/dashboard.jpg" alt="" height="100" width="100">
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4"></div>
</div>
<!--end of 1st row-->
<!--2nd row-->
<div class="row mt-4" data-aos="fade-right">
<div class="col-lg-4"></div>
<div class="col-lg-8">
<div class="card shadow-lg">
<div class="card-header text-white bg-success">
<h2>Specific Objectives</h2>
</div>
<div class="card-body">
<p>Hello</p>
</div>
</div>
</div>
</div>
<!--end of 2nd row-->
</div>
<!-- end of research objectives-->
<!--methodology-->
<div class="tab-pane fade" id="methodology" role="tabpanel">
<h2>Methodology</h2>
<div class="row no-gutters">
<!--diagram column-->
<div class="col-lg-4">
<img src="assets/img/methodology/system_diagram.jpg" alt="system diagram" height="400" width="300">
</div>
<!--end of diagram column-->
<!--description column-->
<div class="col-lg-8">
<div class="card shadow-lg bg-white">
<div class="card-body">
<p class="card-text" style="font-size: 20px; text-align: justify">
As mentioned in the System Diagram, this system will mainly consist of a mobile
and web
application.
When the students and the lecturer enter the classroom, their behavior will be
monitored
by two separate video-cameras and a microphone. The collected data will transmit
to the
server through local machine and stores the gathered data in the MongoDB cloud
database
service.
</p>
<p class="card-text" style="font-size: 20px; text-align: justify">
While the video camera tracks both facial expression and body
movements, the
microphone will record the lecture for further analysis. The student attendance
will
register by capturing facial identity using deep learning and computer vision
mechanisms.
Students will be monitored by capturing their facial and body movements by
Computer
Vision and Deep Learning algorithms.
</p>
<p class="card-text" style="font-size: 20px; text-align: justify">
The lecturer audio and video details will
be
gathered and stored for analyzing as such lecture summarizing and monitoring
lecturer
performance using machine learning, deep learning, and computer vision
technologies.
While the students have access to the mobile application, the lecturers and the
higher
management have the authority to manage the web-application. Frontend components
will communicate with the backend using Django REST API.
</p>
</div>
</div>
</div>
<!--end of description column-->
</div>
</div>
<!-- end of methodology-->
<!--technologies used-->
<div class="tab-pane fade" id="technologies_used" role="tabpanel">
<h2>Domains</h2>
<!-- logos of the domains used-->
<div class="row no-gutters clients-wrap clearfix wow fadeInUp mt-4" data-aos="fade-right">
<div class="col-lg-3 col-md-4 col-6">
<div class="client-logo">
<img src="assets/img/technologies/deep_learning.jpg" class="img-fluid" alt=""
data-aos="flip-right">
<span>Deep Learning</span>
</div>
</div>
<div class="col-lg-3 col-md-4 col-6">
<div class="client-logo">
<img src="assets/img/technologies/computer_vision.jpg" class="img-fluid" alt=""
data-aos="flip-right" data-aos-delay="400">
<span>Computer Vision</span>
</div>
</div>
<div class="col-lg-3 col-md-4 col-6">
<div class="client-logo">
<img src="assets/img/technologies/machine_learning.jpg" class="img-fluid" alt=""
data-aos="flip-right" data-aos-delay="100">
<span>Machine Learning</span>
</div>
</div>
<div class="col-lg-3 col-md-4 col-6">
<div class="client-logo">
<img src="assets/img/technologies/nlp.jpg" class="img-fluid" alt=""
data-aos="flip-right" data-aos-delay="200">
<span>Natural Language Processing</span>
</div>
</div>
</div>
<!--end of domains-->
<h2>Tools</h2>
<!-- logos of the technologies used-->
<div class="row no-gutters clients-wrap clearfix wow fadeInUp mt-4" data-aos="fade-left">
<div class="col-lg-2 col-md-4 col-6"> <div class="col-lg-2 col-md-4 col-6">
<div class="researchScope-logo"> <div class="client-logo">
<img src="assets/img/clients/client-1.png" class="img-fluid" alt="" data-aos="flip-right"> <img src="assets/img/technologies/django.png" class="img-fluid" alt=""
data-aos="flip-right">
</div> </div>
</div> </div>
<div class="col-lg-2 col-md-4 col-6"> <div class="col-lg-2 col-md-4 col-6">
<div class="researchScope-logo"> <div class="client-logo">
<img src="assets/img/clients/client-2.png" class="img-fluid" alt="" data-aos="flip-right" <img src="assets/img/technologies/djangorestframework.png" class="img-fluid" alt=""
data-aos-delay="100"> data-aos="flip-right" data-aos-delay="400">
</div> </div>
</div> </div>
<div class="col-lg-2 col-md-4 col-6"> <div class="col-lg-2 col-md-4 col-6">
<div class="client-logo"> <div class="client-logo">
<img src="assets/img/clients/client-3.png" class="img-fluid" alt="" data-aos="flip-right" <img src="assets/img/technologies/mongo.png" class="img-fluid" alt=""
data-aos-delay="200"> data-aos="flip-right" data-aos-delay="100">
</div> </div>
</div> </div>
<div class="col-lg-2 col-md-4 col-6"> <div class="col-lg-2 col-md-4 col-6">
<div class="client-logo"> <div class="client-logo">
<img src="assets/img/clients/client-4.png" class="img-fluid" alt="" data-aos="flip-right" <img src="assets/img/technologies/opencv.png" class="img-fluid" alt=""
data-aos-delay="300"> data-aos="flip-right" data-aos-delay="200">
</div> </div>
</div> </div>
<div class="col-lg-2 col-md-4 col-6"> <div class="col-lg-2 col-md-4 col-6">
<div class="client-logo"> <div class="client-logo">
<img src="assets/img/clients/client-5.png" class="img-fluid" alt="" data-aos="flip-right" <img src="assets/img/technologies/tensorflow.png" class="img-fluid" alt=""
data-aos-delay="400"> data-aos="flip-right" data-aos-delay="300">
</div> </div>
</div> </div>
<div class="col-lg-2 col-md-4 col-6"> <div class="col-lg-2 col-md-4 col-6">
<div class="client-logo"> <div class="client-logo">
<img src="assets/img/clients/client-6.png" class="img-fluid" alt="" data-aos="flip-right" <img src="assets/img/technologies/flutter.png" class="img-fluid" alt=""
data-aos-delay="500"> data-aos="flip-right" data-aos-delay="400">
</div> </div>
</div> </div>
</div> </div>
<!--end of logos-->
</div>
<!-- end of technologies used-->
</div>
<!--end of tab content-->
</div> </div>
</section><!-- End Clients Section --> </section>
<!-- End Research Scope Section -->
<!-- ======= Research Milestones Section ======= --> <!-- ======= Research Milestones Section ======= -->
<section id="researchMilestone" class="researchMilestone section-bg"> <section id="researchMilestone" class="researchMilestone section-bg">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-xl-7 pl-0 pl-lg-5 pr-lg-1 d-flex align-items-stretch"> <div class="col-xl-7 pl-0 pl-lg-5 pr-lg-1 d-flex align-items-stretch" data-aos="fade-right">
<div class="content d-flex flex-column justify-content-center"> <div class="content d-flex flex-column justify-content-center">
<h2 data-aos="fade-in" data-aos-delay="100" class="font-weight-bold">Research Project <h2 data-aos="fade-in" data-aos-delay="100" class="font-weight-bold">Research Project
Milestones</h2> Milestones</h2>
...@@ -164,7 +750,7 @@ ...@@ -164,7 +750,7 @@
<!-- </div>--> <!-- </div>-->
<ul class="timeline"> <ul class="timeline">
<!--timeline - 1--> <!--timeline - 1-->
<li> <li data-aos="fade-right">
<div class="timeline-badge"><i class="glyphicon glyphicon-check"></i></div> <div class="timeline-badge"><i class="glyphicon glyphicon-check"></i></div>
<div class="timeline-panel"> <div class="timeline-panel">
<div class="timeline-heading"> <div class="timeline-heading">
...@@ -180,7 +766,7 @@ ...@@ -180,7 +766,7 @@
<!--end of timeline - 1--> <!--end of timeline - 1-->
<!--timeline - 2--> <!--timeline - 2-->
<li class="timeline-inverted"> <li class="timeline-inverted" data-aos="fade-left">
<div class="timeline-badge warning"><i class="glyphicon glyphicon-credit-card"></i></div> <div class="timeline-badge warning"><i class="glyphicon glyphicon-credit-card"></i></div>
<div class="timeline-panel"> <div class="timeline-panel">
<div class="timeline-heading"> <div class="timeline-heading">
...@@ -194,7 +780,7 @@ ...@@ -194,7 +780,7 @@
<!--end of timeline - 2--> <!--end of timeline - 2-->
<!--timeline - 3--> <!--timeline - 3-->
<li> <li data-aos="fade-right">
<div class="timeline-badge danger"><i class="glyphicon glyphicon-credit-card"></i></div> <div class="timeline-badge danger"><i class="glyphicon glyphicon-credit-card"></i></div>
<div class="timeline-panel"> <div class="timeline-panel">
<div class="timeline-heading"> <div class="timeline-heading">
...@@ -208,7 +794,7 @@ ...@@ -208,7 +794,7 @@
<!--end of timeline - 3--> <!--end of timeline - 3-->
<!--timeline - 4--> <!--timeline - 4-->
<li class="timeline-inverted"> <li class="timeline-inverted" data-aos="fade-left">
<div class="timeline-panel"> <div class="timeline-panel">
<div class="timeline-heading"> <div class="timeline-heading">
<h4 class="timeline-title">Demo (Camera-ready Poster)</h4> <h4 class="timeline-title">Demo (Camera-ready Poster)</h4>
...@@ -221,7 +807,7 @@ ...@@ -221,7 +807,7 @@
<!--end of timeline - 4--> <!--end of timeline - 4-->
<!--timeline - 5--> <!--timeline - 5-->
<li> <li data-aos="fade-right">
<div class="timeline-badge info"><i class="glyphicon glyphicon-floppy-disk"></i></div> <div class="timeline-badge info"><i class="glyphicon glyphicon-floppy-disk"></i></div>
<div class="timeline-panel"> <div class="timeline-panel">
<div class="timeline-heading"> <div class="timeline-heading">
...@@ -249,7 +835,7 @@ ...@@ -249,7 +835,7 @@
<!--end of timeline - 5--> <!--end of timeline - 5-->
<!--timeline - 6--> <!--timeline - 6-->
<li> <li data-aos="fade-right">
<div class="timeline-panel"> <div class="timeline-panel">
<div class="timeline-heading"> <div class="timeline-heading">
<h4 class="timeline-title">Viva</h4> <h4 class="timeline-title">Viva</h4>
...@@ -999,7 +1585,7 @@ ...@@ -999,7 +1585,7 @@
<a href="#" class="back-to-top"><i class="icofont-simple-up"></i></a> <a href="#" class="back-to-top"><i class="icofont-simple-up"></i></a>
<!-- Vendor JS Files --> <!-- Vendor JS Files -->
<script src="assets/vendor/jquery/jquery.min.js"></script> <!--<script src="assets/vendor/jquery/jquery.min.js"></script>-->
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script> <script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/jquery.easing/jquery.easing.min.js"></script> <script src="assets/vendor/jquery.easing/jquery.easing.min.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script> <script src="assets/vendor/php-email-form/validate.js"></script>
...@@ -1008,6 +1594,8 @@ ...@@ -1008,6 +1594,8 @@
<script src="assets/vendor/venobox/venobox.min.js"></script> <script src="assets/vendor/venobox/venobox.min.js"></script>
<script src="assets/vendor/aos/aos.js"></script> <script src="assets/vendor/aos/aos.js"></script>
<!--<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>-->
<!-- Template Main JS File --> <!-- Template Main JS File -->
<script src="assets/js/main.js"></script> <script src="assets/js/main.js"></script>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment