-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathportPeoplecounter.html
138 lines (99 loc) · 5.58 KB
/
portPeoplecounter.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>Portfolio Details - Personal Bootstrap Template</title>
<meta content="" name="description">
<meta content="" name="keywords">
<!-- Favicons -->
<link href="assets/img/favicon.png" rel="icon">
<link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">
<!-- Google Fonts -->
<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">
<!-- Vendor CSS Files -->
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
<link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
<link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
<link href="assets/vendor/remixicon/remixicon.css" rel="stylesheet">
<link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">
<!-- Template Main CSS File -->
<link href="assets/css/style.css" rel="stylesheet">
<!-- =======================================================
* Template Name: Personal
* Template URL: https://bootstrapmade.com/personal-free-resume-bootstrap-template/
* Updated: Mar 17 2024 with Bootstrap v5.3.3
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
======================================================== -->
</head>
<body>
<main id="main">
<!-- ======= Portfolio Details ======= -->
<div id="portfolio-details" class="portfolio-details">
<div class="container">
<div class="row">
<div class="col-lg-8">
<h2 class="portfolio-title">The People Counter App</h2>
<div class="portfolio-details-slider swiper">
<div class="swiper-wrapper align-items-center">
<div class="swiper-slide">
<img src="assets/img/peoplecounter.png" style="width: 100%; height: auto; object-fit: contain;">
</div>
</div>
<div class="swiper-pagination"></div>
</div>
</div>
<div class="col-lg-4 portfolio-info">
<h3>Project information</h3>
<ul>
<li><strong>Category</strong>: App Development</li>
<!-- <li><strong>Client</strong>: ASU Company</li>
<li><strong>Project date</strong>: 01 March, 2020</li> -->
<li><strong>Github URL</strong>: <a href="https://github.com/Blessy-B-Sherin/The-People-Counter">GitHub Repository</a></li>
<li><strong>Netlify URL</strong>: <a href="https://thepeoplecounterhub.netlify.app/">Browser Preview</a></li>
</ul>
<p>
The People Counter is a web application designed for tracking and managing counts of people. Drawing inspiration from the childhood habit of counting people or things wherever we go, this app provides a practical tool for doing so more effectively. This project modernizes the experience of counting people or things, providing an efficient and easy-to-use tool for managing counts.
<h6 style="text-decoration: underline;">Features</h6>
<ul>
<li><b>Real-Time Counting:</b> Click the "Increment" button to increase the count.</li>
<li><b>Save and View Entries: </b>Save your current count and view a history of previous counts.</li>
<li><b>legant and Responsive Design: </b>Adaptable to various screen sizes with a clean, modern interface.</li>
</ul>
<h6 style="text-decoration: underline;">Technologies Used</h6>
<ul>
<li><b>HTML:</b> Structure of the application</li>
<li><b>CSS:</b> Styling and layout</li>
<li><b>JavaScript: </b>Interactive functionality</li>
</ul>
<h6 style="text-decoration: underline;">Usage</h6>
<ul>
<li>Click the "Increment" button to add to the current count.</li>
<li>Click the "Save" button to log the current count. The previous entries will be displayed below.</li>
</ul>
</p>
</div>
</div>
</div>
</div><!-- End Portfolio Details -->
</main><!-- End #main -->
<div class="credits">
<!-- All the links in the footer should remain intact. -->
<!-- You can delete the links only if you purchased the pro version. -->
<!-- Licensing information: https://bootstrapmade.com/license/ -->
<!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/personal-free-resume-bootstrap-template/ -->
</div>
<!-- Vendor JS Files -->
<script src="assets/vendor/purecounter/purecounter_vanilla.js"></script>
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
<script src="assets/vendor/waypoints/noframework.waypoints.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>
<!-- Template Main JS File -->
<script src="assets/js/main.js"></script>
</body>
</html>