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