From bf91de08274313d83941f614d3cebf0a0d2deb8e Mon Sep 17 00:00:00 2001
From: Mozamel Jawad <mozameljawad@gmail.com>
Date: Sun, 3 Mar 2024 19:55:44 +0430
Subject: [PATCH 1/8] add new services section

---
 index.html | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index f1da625..4c1b56b 100644
--- a/index.html
+++ b/index.html
@@ -226,8 +226,10 @@ <h3>Full-stack Web Developer!</h3>
           </div>
         </div>
       </section>
+
+    <!-- Services section  -->
     
-    <!-- contact section design -->
+    <!-- contact section  -->
     <section class="contact" id="contact">
       <h2 class="heading">Contact <span>Me!</span> </h2>
       <form action="https://formspree.io/f/meqwyeoe" method="POST">

From a911fa705b566e7ab0ba95e655add196f9a290c6 Mon Sep 17 00:00:00 2001
From: Mozamel Jawad <mozameljawad@gmail.com>
Date: Mon, 4 Mar 2024 17:51:51 +0430
Subject: [PATCH 2/8] add style for services section

---
 style.css | 61 +++++++++++++++++++++++++++++++++++++++++++++++--------
 1 file changed, 52 insertions(+), 9 deletions(-)

diff --git a/style.css b/style.css
index 5855004..4caec2a 100644
--- a/style.css
+++ b/style.css
@@ -12,10 +12,10 @@
 }
 
 :root {
-  --bg-color: #00509d;
-  --seocond-bg-color: #00296b;
-  --text-color: #fff;
-  --main-color: #0ef;
+  --bg-color: #003f88;
+  --seocond-bg-color: #00509d;
+  --text-color: #FFF;
+  --main-color: #0ee;
 }
 
 html {
@@ -197,7 +197,7 @@ span {
   justify-content: center;
   align-items: center;
   gap: 2rem;
-  background: var(--bg-color);
+  background: var(--seocond-bg-color);
   padding: 2rem 20%;
   text-align: center;
 }
@@ -396,11 +396,54 @@ span {
   cursor: pointer;
 }
 
+/* services Section */
+
+.services h2 {
+  margin-bottom: 5rem;
+}
+
+.services-container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 2rem;
+}
+
+.services-container .services-box {
+  flex: 1 1 30rem;
+  background: var(--seocond-bg-color);
+  padding: 3rem 2rem 4rem;
+  border-radius: 2rem;
+  text-align: center;
+  border: 0.2rem solid var(--bg-color);
+  transition: 0.5s ease;
+}
+
+.services-container .services-box:hover {
+  border-color: var(--main-color);
+  transform: scale(1.02);
+}
+
+.services-box i {
+  font-size: 7rem;
+  color: var(--main-color);
+}
+
+.services-box h3 {
+  font-size: 2.6rem;
+}
+
+.services-box p {
+  font-size: 1.6rem;
+  margin: 1rem 0 3rem;
+}
+
 /* Contact Section */
 
-.contact {
+/* .contact {
   background-color: var(--seocond-bg-color);
-}
+} */
 
 .contact h2 {
   margin-bottom: 3rem;
@@ -425,7 +468,7 @@ span {
   padding: 1.5rem;
   font-size: 1.6rem;
   color: var(--text-color);
-  background: var(--bg-color);
+  background: var(--seocond-bg-color);
   border-radius: 0.8rem;
   margin: 0.7rem 0;
 }
@@ -447,7 +490,7 @@ span {
   align-items: center;
   flex-wrap: wrap;
   padding: 2rem 9%;
-  background: var(--bg-color);
+  background: var(--seocond-bg-color);
 }
 
 .footer-text p {

From 208d6d29c422b302a4632f73b2c8053522b5d64d Mon Sep 17 00:00:00 2001
From: Mozamel Jawad <mozameljawad@gmail.com>
Date: Mon, 4 Mar 2024 17:52:11 +0430
Subject: [PATCH 3/8] add new services section

---
 index.html | 37 +++++++++++++++++++++++++++++++++++--
 1 file changed, 35 insertions(+), 2 deletions(-)

diff --git a/index.html b/index.html
index 4c1b56b..9920037 100644
--- a/index.html
+++ b/index.html
@@ -20,6 +20,7 @@
       <nav class="navbar">
         <a href="#home" class="active">Home</a>
         <a href="#portfolio">Portfolio</a>
+        <a href="#services">Services</a>
         <a href="#about">About</a>
         <a href="#contact">Contact</a>
       </nav>
@@ -196,6 +197,39 @@ <h4>Techlife Summit</h4>
       </div>
     </section>
 
+
+    <!-- Services section  -->
+
+    <section class="services" id="services">
+      <h2 class="heading">Our <span>Services</span> </h2>
+
+      <div class="services-container">
+
+        <div class="services-box">
+          <i class="bx bx-code-alt"></i>
+          <h3>Full-stack Development</h3>
+          <p>I offer comprehensive full-stack development services, combining front-end and back-end technologies to deliver seamless and feature-rich web applications that meet your business requirements.</p>
+          <a href="#services" class="btn">Read More</a>
+        </div>
+
+        <div class="services-box">
+          <i class='bx bx-minus-front' ></i>
+          <h3>Front-end Development</h3>
+          <p>With a focus on front-end development, I specialize in creating visually captivating and interactive user interfaces that enhance user engagement and provide a superior browsing experience.</p>
+          <a href="#services" class="btn">Read More</a>
+        </div>
+
+        <div class="services-box">
+          <i class='bx bx-data' ></i>
+          <h3>Database Development</h3>
+          <p>As a skilled database developer, I excel in designing and optimizing databases for efficient data storage, retrieval, and management, ensuring superior application performance and scalability.</p>
+          <a href="#services" class="btn">Read More</a>
+        </div>
+
+      </div>
+    </section>
+    
+
       <!-- about section design -->
       <section class="about" id="about">
         <div class="about-content">
@@ -213,6 +247,7 @@ <h3>Full-stack Web Developer!</h3>
             <button type="button" class="skill-btn">React</button>
             <button type="button" class="skill-btn">Redux</button>
             <button type="button" class="skill-btn">Figma</button>
+            <button type="button" class="skill-btn">Php</button>
             <button type="button" class="skill-btn">Ruby</button>
             <button type="button" class="skill-btn">Rails</button>
             <button type="button" class="skill-btn">Rspec</button>
@@ -227,8 +262,6 @@ <h3>Full-stack Web Developer!</h3>
         </div>
       </section>
 
-    <!-- Services section  -->
-    
     <!-- contact section  -->
     <section class="contact" id="contact">
       <h2 class="heading">Contact <span>Me!</span> </h2>

From 50e1b7c62c44bbe36bfa3fd0bf7ee74220909ff7 Mon Sep 17 00:00:00 2001
From: Mozamel Jawad <mozameljawad@gmail.com>
Date: Tue, 5 Mar 2024 18:51:28 +0430
Subject: [PATCH 4/8] add new changes

---
 index.html | 1 -
 1 file changed, 1 deletion(-)

diff --git a/index.html b/index.html
index 9920037..91c4f47 100644
--- a/index.html
+++ b/index.html
@@ -229,7 +229,6 @@ <h3>Database Development</h3>
       </div>
     </section>
     
-
       <!-- about section design -->
       <section class="about" id="about">
         <div class="about-content">

From 7359636fc7d788e16cc4104e3b185e1af1ca2f08 Mon Sep 17 00:00:00 2001
From: Mozamel Jawad <mozameljawad@gmail.com>
Date: Thu, 7 Mar 2024 16:24:58 +0430
Subject: [PATCH 5/8] add chnages

---
 index.html | 1 -
 1 file changed, 1 deletion(-)

diff --git a/index.html b/index.html
index 91c4f47..7107467 100644
--- a/index.html
+++ b/index.html
@@ -274,7 +274,6 @@ <h2 class="heading">Contact <span>Me!</span> </h2>
       </form>
     </section>
   
-
     <!-- footer design -->
     <footer class="footer">
       <div class="footer-text">

From f76b863769e468d8f9efd48aa207ac1d46b64fec Mon Sep 17 00:00:00 2001
From: Mozamel Jawad <mozameljawad@gmail.com>
Date: Thu, 7 Mar 2024 16:30:55 +0430
Subject: [PATCH 6/8] solve style linter errors

---
 style.css | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/style.css b/style.css
index 4caec2a..18dd887 100644
--- a/style.css
+++ b/style.css
@@ -14,7 +14,7 @@
 :root {
   --bg-color: #003f88;
   --seocond-bg-color: #00509d;
-  --text-color: #FFF;
+  --text-color: #fff;
   --main-color: #0ee;
 }
 
@@ -150,6 +150,10 @@ section {
   font-size: 2.6rem;
 }
 
+.services-box h3 {
+  font-size: 2.6rem;
+}
+
 .home-content h3:nth-of-type(2) {
   margin-bottom: 2rem;
 }
@@ -202,6 +206,11 @@ span {
   text-align: center;
 }
 
+.services-box i {
+  font-size: 7rem;
+  color: var(--main-color);
+}
+
 .about-content a i {
   font-size: 2.5rem;
   color: var(--seocond-bg-color);
@@ -425,15 +434,6 @@ span {
   transform: scale(1.02);
 }
 
-.services-box i {
-  font-size: 7rem;
-  color: var(--main-color);
-}
-
-.services-box h3 {
-  font-size: 2.6rem;
-}
-
 .services-box p {
   font-size: 1.6rem;
   margin: 1rem 0 3rem;

From 67988c2092544c8a3179e27327585a93537d3e26 Mon Sep 17 00:00:00 2001
From: Mozamel Jawad <mozameljawad@gmail.com>
Date: Thu, 7 Mar 2024 16:52:47 +0430
Subject: [PATCH 7/8] add image icon to browser tab

---
 index.html | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/index.html b/index.html
index 7107467..5291e1d 100644
--- a/index.html
+++ b/index.html
@@ -5,6 +5,9 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <meta name="theme-color" content="#00509d"/>
+
+    <link rel="icon" type="image/x-icon" href="assets/background/jawadphoto.avif">
+    
     <title>Mozamel Jawad | Portfolio</title>
     <!-- box icons -->
     <link href="https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css" rel="stylesheet" />

From 966149b6280b1bba599c04631d616e1ac7443bff Mon Sep 17 00:00:00 2001
From: Mozamel Jawad <mozameljawad@gmail.com>
Date: Thu, 7 Mar 2024 20:38:51 +0430
Subject: [PATCH 8/8] add comment to code

---
 index.html | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/index.html b/index.html
index 5291e1d..a393726 100644
--- a/index.html
+++ b/index.html
@@ -6,9 +6,11 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <meta name="theme-color" content="#00509d"/>
 
+    <!-- Add icon to browser title bar -->
     <link rel="icon" type="image/x-icon" href="assets/background/jawadphoto.avif">
     
     <title>Mozamel Jawad | Portfolio</title>
+    
     <!-- box icons -->
     <link href="https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css" rel="stylesheet" />
     <!-- custom css -->