Skip to content

Commit 010ab46

Browse files
Add files via upload
1 parent fb13489 commit 010ab46

File tree

2 files changed

+191
-5
lines changed

2 files changed

+191
-5
lines changed

index.html

Lines changed: 51 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,7 @@ <h2>I'm a passionate <span>Software Engineer</span> from Kerala, India</h2>
5757
<li><a class="nav-link" href="#resume">Resume</a></li>
5858
<li><a class="nav-link" href="#services">Certificates</a></li>
5959
<li><a class="nav-link" href="#portfolio">Portfolio</a></li>
60+
<li><a class="nav-link" href="#blog">Blog</a></li>
6061
<li><a class="nav-link" href="#contact">Contact</a></li>
6162
</ul>
6263
<i class="bi bi-list mobile-nav-toggle"></i>
@@ -698,13 +699,28 @@ <h2>Portfolio</h2>
698699

699700
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
700701
<div class="portfolio-wrap">
701-
<img src="assets/img/peoplecounter.png" class="img-fluid" alt="" style="width: 600px; height: 300px; border: 1px solid #18d26e; opacity: 0.3;">
702+
<img src="assets/img/basketball.png" class="img-fluid" alt="" style="width: 600px; height: 300px; border: 1px solid #18d26e; opacity: 0.3;">
703+
<div class="portfolio-info">
704+
<h4>Basketball ScoreBoard</h4>
705+
<p>App</p>
706+
<div class="portfolio-links">
707+
708+
<a href="./assets/img/basketball.png" data-gallery="portfolioGallery" class="portfolio-lightbox" title="The People Counter Ap"><i class="bx bx-plus"></i></a>
709+
<a href="portBasket.html" data-gallery="portfolioDetailsGallery" data-glightbox="type: external" class="portfolio-details-lightbox" title="Portfolio Details"><i class="bx bx-link"></i></a>
710+
</div>
711+
</div>
712+
</div>
713+
</div>
714+
715+
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
716+
<div class="portfolio-wrap">
717+
<img src="assets/img/blog1.png" class="img-fluid" alt="" style="width: 600px; height: 300px; border: 1px solid #18d26e; opacity: 0.3;">
702718
<div class="portfolio-info">
703719
<h4>The People Counter App</h4>
704720
<p>App</p>
705721
<div class="portfolio-links">
706722

707-
<a href="assets/img/peoplecounter.png" data-gallery="portfolioGallery" class="portfolio-lightbox" title="The People Counter Ap"><i class="bx bx-plus"></i></a>
723+
<a href="assets/img/blog1.png" data-gallery="portfolioGallery" class="portfolio-lightbox" title="The People Counter Ap"><i class="bx bx-plus"></i></a>
708724
<a href="portPeoplecounter.html" data-gallery="portfolioDetailsGallery" data-glightbox="type: external" class="portfolio-details-lightbox" title="Portfolio Details"><i class="bx bx-link"></i></a>
709725
</div>
710726
</div>
@@ -843,6 +859,36 @@ <h4>Web 3</h4>
843859
</div>
844860
</section><!-- End Portfolio Section -->
845861

862+
<!-- ======= Blog Section ======= -->
863+
<section id="blog" class="blog">
864+
<div class="container">
865+
<div class="section-title">
866+
<h2>Blog</h2>
867+
<p>Read My Latest Articles</p>
868+
</div>
869+
<div class="row">
870+
<div class="col-lg-4 col-md-6">
871+
<div class="blog-item">
872+
<img src="./assets/img/blog1.png" alt="Blog Image" class="img-fluid blog-img">
873+
<div class="blog-content">
874+
<h3 class="blog-title">Building "The People Counter": A Journey from Childhood Counting to Modern Website</h3>
875+
<div class="blog-meta">
876+
<!-- <span><i class="bi bi-person"></i> John Ashley</span>
877+
<span><i class="bi bi-calendar"></i> 29 September, 2018</span>
878+
<span><i class="bi bi-chat"></i> 134 Comments</span>
879+
<span><i class="bi bi-tags"></i> Plant, Trees, Water, Recycling</span> -->
880+
<span><i class="bi bi-hash"></i>JavaScript</span>
881+
</div>
882+
<p>Ever find yourself counting people or objects just for fun? I certainly did as a child, whether it was the number of cars passing by or how many people were in a room. This simple habit sparked the idea behind my project: The People Counter.</p>
883+
<a href="https://dev.to/blessy-b-sherin/building-the-people-counter-a-journey-from-childhood-counting-to-modern-website-5bhb" class="read-more-btn">Read Post</a>
884+
</div>
885+
</div>
886+
</div>
887+
<!-- Repeat the above .col-lg-4 col-md-6 block for more blog posts -->
888+
</div>
889+
</div>
890+
</section><!-- End Blog Section -->
891+
846892
<!-- ======= Contact Section ======= -->
847893
<section id="contact" class="contact">
848894
<div class="container">
@@ -886,11 +932,11 @@ <h3>Email Me</h3>
886932

887933
<div class="col-md-6 mt-4 d-flex align-items-stretch">
888934
<div class="info-box">
889-
<i class="bx bx-envelope"></i>
935+
<i class="bx bx-news"></i>
890936
<h3>My Blog</h3>
891937
<div class="social-links">
892938

893-
<a href="https://dev.to/blessy-b-sherin" class="linkedin"><i class="fa-brands fa-dev"></i></a>
939+
<a href="https://dev.to/blessy-b-sherin" class="linkedin"><i class="bi bi-code-slash">Dev Community</i></a>
894940
</div>
895941
</div>
896942
</div>
@@ -945,4 +991,4 @@ <h3>My Blog</h3>
945991

946992
</body>
947993

948-
</html>
994+
</html>

portBasket.html

Lines changed: 140 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,140 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="utf-8">
6+
<meta content="width=device-width, initial-scale=1.0" name="viewport">
7+
8+
<title>Portfolio Details</title>
9+
<meta content="" name="description">
10+
<meta content="" name="keywords">
11+
12+
<!-- Favicons -->
13+
<link href="assets/img/favicon.png" rel="icon">
14+
<link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">
15+
16+
<!-- Google Fonts -->
17+
<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">
18+
19+
<!-- Vendor CSS Files -->
20+
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
21+
<link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
22+
<link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
23+
<link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
24+
<link href="assets/vendor/remixicon/remixicon.css" rel="stylesheet">
25+
<link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">
26+
27+
<!-- Template Main CSS File -->
28+
<link href="assets/css/style.css" rel="stylesheet">
29+
30+
<!-- =======================================================
31+
* Template Name: Personal
32+
* Template URL: https://bootstrapmade.com/personal-free-resume-bootstrap-template/
33+
* Updated: Mar 17 2024 with Bootstrap v5.3.3
34+
* Author: BootstrapMade.com
35+
* License: https://bootstrapmade.com/license/
36+
======================================================== -->
37+
</head>
38+
39+
<body>
40+
41+
<main id="main">
42+
43+
<!-- ======= Portfolio Details ======= -->
44+
<div id="portfolio-details" class="portfolio-details">
45+
<div class="container">
46+
47+
<div class="row">
48+
49+
<div class="col-lg-8">
50+
<h2 class="portfolio-title">Basketball ScoreBoard</h2>
51+
52+
<div class="portfolio-details-slider swiper">
53+
<div class="swiper-wrapper align-items-center">
54+
55+
<div class="swiper-slide">
56+
57+
<img src="assets/img/basketball.png" style="width: 100%; height: auto; object-fit: contain;">
58+
</div>
59+
60+
61+
62+
63+
</div>
64+
<div class="swiper-pagination"></div>
65+
</div>
66+
67+
</div>
68+
69+
<div class="col-lg-4 portfolio-info">
70+
<h3>Project information</h3>
71+
<ul>
72+
<li><strong>Category</strong>: App Development</li>
73+
<!-- <li><strong>Client</strong>: ASU Company</li>
74+
<li><strong>Project date</strong>: 01 March, 2020</li> -->
75+
<li><strong>Github URL</strong>: <a href="https://github.com/Blessy-B-Sherin/Basketball-Scoreboard">GitHub Repository</a></li>
76+
<li><strong>Netlify URL</strong>: <a href="https://basketballscorex.netlify.app/">Browser Preview</a></li>
77+
78+
</ul>
79+
80+
<p>
81+
This Basketball Scoreboard is a web application designed to keep track of scores for two teams: Home and Guest. It features a clean and professional UI with interactive elements to update scores, start a new game, and highlight the leading team with trophy icons.
82+
83+
<h6 style="text-decoration: underline;">Features</h6>
84+
<ul>
85+
<li><b>Score Tracking:</b> Increase scores for Home or Guest teams by 1, 2, or 3 points.</li>
86+
<li><b>New Game: </b>Reset scores and hide trophy icons with a single button click.</li>
87+
<li><b>Leading Team Highlight: </b>Automatically display a trophy icon next to the leading team.</li>
88+
<li><b>Tie Detection: </b>Show trophy icons for both teams when scores are tied.</li>
89+
<li><b>Responsive Design: </b>The layout adjusts to fit various screen sizes for better usability on different devices.</li>
90+
</ul>
91+
<h6 style="text-decoration: underline;">Technologies Used</h6>
92+
<ul>
93+
<li><b>HTML:</b> Structure of the application</li>
94+
<li><b>CSS:</b> Styling and layout</li>
95+
<li><b>JavaScript: </b>Interactive functionality</li>
96+
</ul>
97+
<h6 style="text-decoration: underline;">Usage</h6>
98+
<ul>
99+
<li>Click the +1, +2, or +3 buttons under the Home or Guest sections to update the scores.</li>
100+
<li>Click the "START A NEW GAME" button to reset the scores and hide any trophy icons.</li>
101+
<li>The leading team will have a trophy icon displayed next to its name, and in case of a tie, both teams will have the trophy icons displayed.</li>
102+
</ul>
103+
104+
</p>
105+
106+
</div>
107+
108+
</div>
109+
110+
111+
112+
113+
</div>
114+
</div><!-- End Portfolio Details -->
115+
116+
</main><!-- End #main -->
117+
118+
<div class="credits">
119+
<!-- All the links in the footer should remain intact. -->
120+
<!-- You can delete the links only if you purchased the pro version. -->
121+
<!-- Licensing information: https://bootstrapmade.com/license/ -->
122+
<!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/personal-free-resume-bootstrap-template/ -->
123+
124+
</div>
125+
126+
<!-- Vendor JS Files -->
127+
<script src="assets/vendor/purecounter/purecounter_vanilla.js"></script>
128+
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
129+
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
130+
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
131+
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
132+
<script src="assets/vendor/waypoints/noframework.waypoints.js"></script>
133+
<script src="assets/vendor/php-email-form/validate.js"></script>
134+
135+
<!-- Template Main JS File -->
136+
<script src="assets/js/main.js"></script>
137+
138+
</body>
139+
140+
</html>

0 commit comments

Comments
 (0)