general enhancements

components/about.html

@@ -2,7 +2,7 @@
   <div class="container">
     <div class="row">
       <div class="col-lg-6 col-12">
-        <img src="images/DreamShaper_v7_A_group_of_people_from_different_backgrounds_an_2.jpg" class="about-image img-fluid" alt="" />
+        <img src="images/DreamShaper_v7_A_group_of_people_from_different_backgrounds_an_2.jpg" class="about-image img-fluid object-fit-cover" alt="" />
       </div>
 
       <div class="col-lg-6 col-12 mt-5 mt-lg-0">
@@ -15,36 +15,68 @@
           <h3 class="pt-2 mb-3">A little bit about Mohammed</h3>
 
           <p>
-            👋 Greetings I'm Mohammed, a dedicated software engineer with a passion for creating innovative solutions. 
+            👋 Greetings! I'm Mohammed, a Results-oriented Senior Frontend Engineer with 5+ years of experience building enterprise-scale web applications (Banking, ERP, Legal), specializing in React, Next.js, Angular, and TypeScript.
+            <br>
+            <br>
             My journey in the field of Information Technology began at the Arab International University
             in 2016, where I pursued a Bachelor's Degree in Computer Software Engineering, 
             graduating in 2021.
             <br>
-            <h5> BPro Story </h5>   
+            <br>
-            Upon completion of my studies, I embarked on a project to develop an Enterprise Resource Planning (ERP) system. This
+            <h5> Dataline - Law Firm (Current) </h5>
-            comprehensive system encompasses seven core components: Inventory Management,
+            <strong>Frontend Developer (Full-time) | [31/08/2025 - Current] | Qatar</strong>
-            Purchasing, Sales, Customer Relationship Management (CRM), Finance, Payments, and
+            <br>
-            Resources
+            • Led the design and development of a full-scale law firm management system
+            <br>
+            • Built interactive dashboards, reusable CRUD templates, and automated reporting
+            <br>
+            • Implemented Azure AD authentication using MSAL
+            <br>
+            • Integrated Microsoft 365 services (SharePoint, Microsoft Graph)
+            <br>
+            • Designed role-based access control for sensitive legal data
+            <br>
+            • Managed CI/CD and production deployment using Firebase Hosting
+            <br>
+            <a href="https://dataline-qa.com/" target="_blank">Website: dataline-qa.com</a>
             <br>
             <br>
-            <h5> Almuthafar Story </h5>
+            <h5> Easy-pay - ERP System </h5>
-            For <a href="https://www.bayantechnologies.com/"> Bayan Digital Hub </a> (Kuwaiti AWS startup, Oracle Partner ): Develop a platform for
+            <strong>Frontend Developer (Full-time) | [06/2024 - 06/2025] | Damascus</strong>
-            managing and tracking law case processes, clients, lawyers, and the administration processes, producing
+            <br>
-            the results as PDF reports, and making sure that the case processes run smoothly and
+            • Developed ERP features for reservations, invoicing, and inventory management
-            organized.
+            <br>
+            • Implemented government tax integration and financial reporting
+            <br>
+            • Built dashboards for sales, inventory, payments, and accounting logs
+            <br>
+            • Collaborated with backend teams to ensure data accuracy and consistency
             <br>
             <br>
-            <h5> Big-dash Story </h5>
+            <h5> Big-dash - Banking System </h5>
-            Engaging in developing a comprehensive banking system ( for <a href="https://moneyout.com.tr"> Moneyout Elektronik Para ve
+            <strong>Frontend Developer (Full-time) | [09/2023 - 11/2024] | Turkey</strong>
-            Ödeme Hizmetleri A.Ş </a>) aimed at facilitating financial transactions across various branches,
+            <br>
-            incorporating digital wallet functionalities, and supporting transactions executed in
+            • Developed an enterprise banking system supporting multi-currency transactions and digital wallets
-            multiple currencies.
+            <br>
+            • Built user-friendly interfaces using Angular and Angular Material
+            <br>
+            • Managed complex application state using NgRx
+            <br>
+            • Implemented theme customization and reusable UI components
+            <br>
+            <a href="https://big-dash.tu" target="_blank">Website: big-dash.tu</a>
             <br>
             <br>
-            <h5> Easy-pay Story </h5>
+            <h5> Almuthafar - Law Office Management System </h5>
-            For <a href="https://www.facebook.com/MONALISA.SYRIA"> Monalisa restaurant in Damascus </a>, the system includes managing reservations, tables,
+            <strong>Frontend Developer (Freelance) | [03/2023 - 06/2023] | Kuwait</strong>
-            products, invoices, government tax integration, debits, and producing different types of reports like
+            <br>
-            sales and logs of payments.
+            For <a href="https://almuthafargroup.com/" target="_blank">Bayan Digital Hub</a> (Kuwaiti AWS startup, Oracle Partner): Developed a platform for managing and tracking law case processes, clients, lawyers, and the administration processes, producing the results as PDF reports, and making sure that the case processes run smoothly and organized.
+            <br>
+            <br>
+            <h5> BPro - ERP System </h5>
+            <strong>Frontend Developer (Full-time) | [03/2021 - 10/2023] | Dubai, UAE</strong>
+            <br>
+            Developed an Enterprise Resource Planning (ERP) system encompassing seven core components: Inventory Management, Purchasing, Sales, Customer Relationship Management (CRM), Finance, Payments, and Resources. Responsibilities included designing intuitive interfaces using the Antd UI library, ensuring secure financial calculations through Big.js library, and end-to-end testing utilizing Cypress.
           </p>
         </div>
       </div>

components/contact.html

@@ -10,7 +10,7 @@
     </div>
 
     <div class="row justify-content-center">
-      <div class="col-lg-10 col-md-12 col-12">
+      <div class="col-lg-12 col-md-12 col-12">
         <div class="contact-wrapper">
           <div class="row">
             <!-- Contact Info Cards -->
@@ -32,7 +32,7 @@
                   </div>
                   <div class="contact-info-content">
                     <h4>Email</h4>
-                    <p><a href="mailto:hello@company.com">hello@company.com</a></p>
+                    <p><a href="mailto:mohammed.o.alyaseen@gmail.com">mohammed.o.alyaseen@gmail.com</a></p>
                   </div>
                 </div>
 
@@ -42,7 +42,7 @@
                   </div>
                   <div class="contact-info-content">
                     <h4>Phone</h4>
-                    <p><a href="tel:010-020-0340">010-020-0340</a></p>
+                    <p><a href="tel:+963-962-469-482">+963-962-469-482</a></p>
                   </div>
                 </div>
 
@@ -52,12 +52,12 @@
                   </div>
                   <div class="contact-info-content">
                     <h4>Name</h4>
-                    <p>Mohammed</p>
+                    <p>Mohammed Al-yaseen</p>
                   </div>
                 </div>
 
                 <!-- Company Ad -->
-                <div class="tech-masters-ad">
+                <!-- <div class="tech-masters-ad">
                   <div class="ad-content">
                     <div class="ad-icon">
                       <i class="bi bi-cpu"></i>
@@ -66,27 +66,22 @@
                     <p>Your Trusted Partner in Digital Innovation</p>
                     <a href="#" class="ad-link">Learn More <i class="bi bi-arrow-right"></i></a>
                   </div>
-                </div>
+                </div> -->
 
                 <div class="contact-social">
                   <h4>Follow Me</h4>
                   <div class="social-icon">
                     <ul class="list-inline">
                       <li class="list-inline-item">
-                        <a href="#" class="social-icon-link">
+                        <a href="https://www.linkedin.com/in/mohammed-al-yaseen-79b056161/" class="social-icon-link" target="_blank">
                           <i class="bi bi-linkedin"></i>
                         </a>
                       </li>
                       <li class="list-inline-item">
-                        <a href="#" class="social-icon-link">
+                        <a href="https://github.com/mohammed-alyaseen" class="social-icon-link" target="_blank">
                           <i class="bi bi-github"></i>
                         </a>
                       </li>
-                      <li class="list-inline-item">
-                        <a href="#" class="social-icon-link">
-                          <i class="bi bi-twitter"></i>
-                        </a>
-                      </li>
                     </ul>
                   </div>
                 </div>

components/featured.html

@@ -30,8 +30,8 @@
             <div class="profile-info-item">
               <span class="profile-small-title">Email</span>
               <span class="profile-value">
-                <a href="mailto:mohammed.alyaseen.it@gmail.com" class="profile-link">
+                <a href="mailto:mohammed.o.alyaseen@gmail.com" class="profile-link">
-                  <i class="bi bi-envelope-fill me-2"></i>mohammed.alyaseen.it@gmail.com
+                  <i class="bi bi-envelope-fill me-2"></i>mohammed.o.alyaseen@gmail.com
                 </a>
               </span>
             </div>
@@ -39,7 +39,16 @@
             <div class="profile-info-item">
               <span class="profile-small-title">Location</span>
               <span class="profile-value">
-                <i class="bi bi-geo-alt-fill me-2"></i>Istanbul, Turkey
+                <i class="bi bi-geo-alt-fill me-2"></i>Damascus, Syria
+              </span>
+            </div>
+
+            <div class="profile-info-item">
+              <span class="profile-small-title">Website</span>
+              <span class="profile-value">
+                <a href="https://tech-masters.guru/portfolio/mohammed-alyaseen" class="profile-link" target="_blank">
+                  <i class="bi bi-globe me-2"></i>tech-masters.guru/portfolio/mohammed-alyaseen
+                </a>
               </span>
             </div>
 
@@ -64,9 +73,9 @@
       <div class="col-lg-6 col-12 mt-5 mt-lg-0">
         <div class="about-thumb">
           <div class="row">
-            <div class="col-lg-6 col-6 featured-border-bottom py-3">
+            <div class="col-lg-6 col-6 featured-border-bottom pb-4">
               <div class="featured-item">
-                <strong class="featured-numbers">4+</strong>
+                <strong class="featured-numbers">5+</strong>
                 <p class="featured-text">Years of Experience</p>
                 <div class="featured-icon">
                   <i class="bi bi-briefcase-fill"></i>
@@ -74,7 +83,7 @@
               </div>
             </div>
 
-            <div class="col-lg-6 col-6 featured-border-start featured-border-bottom ps-5 py-3">
+            <div class="col-lg-6 col-6 featured-border-start featured-border-bottom pb-4">
               <div class="featured-item">
                 <strong class="featured-numbers">5+</strong>
                 <p class="featured-text">Happy Customers</p>
@@ -94,7 +103,7 @@
               </div>
             </div>
 
-            <div class="col-lg-6 col-6 featured-border-start ps-5 pt-4">
+            <div class="col-lg-6 col-6 featured-border-start pt-4">
               <div class="featured-item">
                 <strong class="featured-numbers">7+</strong>
                 <p class="featured-text">Digital Awards</p>

components/footer.html

@@ -4,8 +4,8 @@
       <div class="col-lg-12 col-12">
         <div class="copyright-text-wrap">
           <p class="mb-0">
-            <span class="copyright-text">Copyright © 2024 <a href="#">Mohammed</a> Company. All rights reserved.</span>
+            <span class="copyright-text">Copyright © 2026 <a href="#">Mohammed Al-yaseen</a>. All rights reserved.</span>
-            <span class="copyright-text">Design: <a href="https://templatemo.com" target="_blank">TemplateMo</a></span>
+            <!-- <span class="copyright-text">Design: <a href="https://templatemo.com" target="_blank">TemplateMo</a></span> -->
           </p>
         </div>
       </div>

components/header.html

@@ -20,7 +20,7 @@
       <span class="navbar-toggler-icon"></span>
     </button>
 
-    <a href="index.html" class="navbar-brand mx-auto mx-lg-0">First</a>
+    <a href="index.html" class="navbar-brand mx-auto mx-lg-0">M</a>
 
     <div class="d-flex align-items-center d-lg-none">
       <i class="navbar-icon bi-telephone-plus me-3"></i>

components/hero.html

@@ -8,7 +8,7 @@
             <h5 class="hero-title ms-3 mb-0">Hello friend!</h5>
           </div>
 
-          <h2 class="mb-4">I'm available for freelance work.</h2>
+          <h2 class="mb-4">Senior Frontend Engineer with 5+ years of experience</h2>
           <p class="mb-4">
             <a class="custom-btn btn custom-link" href="#section_2">Let's begin</a>
           </p>

css/templatemo-first-portfolio-style.css

@@ -550,6 +550,12 @@ strong {
 /*---------------------------------------
   ABOUT              
 -----------------------------------------*/
+
+.object-fit-cover {
+  object-fit: cover;
+  height: 100%;
+}
+
 .profile-thumb {
   background: var(--white-color);
   border-radius: 15px;
@@ -558,11 +564,6 @@ strong {
   transition: all 0.3s ease;
 }
 
-.profile-thumb:hover {
-  transform: translateY(-5px);
-  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
-}
-
 .profile-title {
   margin-bottom: 25px;
   padding-bottom: 15px;
@@ -698,11 +699,11 @@ strong {
   box-shadow: 0 0 20px rgba(255, 255, 255, 0.3);
 }
 
-.about-image:hover {
+/* .about-image:hover {
   transform: scale(1.05);
   filter: brightness(1.3) contrast(1.2) saturate(1.2);
   box-shadow: 0 0 30px rgba(255, 255, 255, 0.4);
-}
+} */
 
 .about-thumb {
   padding-right: 20px;
@@ -746,10 +747,6 @@ strong {
   transition: all ease 0.2s;
 }
 
-.clients-image:hover {
-  transform: scale(1.3);
-}
-
 /*---------------------------------------
   SERVICES              
 -----------------------------------------*/
@@ -1048,10 +1045,10 @@ strong {
   transition: all 0.3s ease;
 }
 
-.contact-info-card:hover {
+/* .contact-info-card:hover {
   transform: translateX(10px);
   background: rgba(255, 255, 255, 0.15);
-}
+} */
 
 .contact-info-icon {
   width: 50px;
@@ -1075,6 +1072,7 @@ strong {
 
 .contact-info-content {
   flex-grow: 1;
+  overflow: hidden;
 }
 
 .contact-info-content h4 {
@@ -1294,7 +1292,7 @@ strong {
 }
 
 .copyright-text {
-  border-right: 1px solid var(--border-color);
+  /* border-right: 1px solid var(--border-color); */
   padding-right: 25px;
   margin-right: 20px;
 }
@@ -1745,9 +1743,9 @@ strong {
     transition: transform 0.3s ease;
 }
 
-.about-image:hover {
+/* .about-image:hover {
     transform: scale(1.05);
-}
+} */
 
 /* Enhance projects section */
 .projects-thumb {

index.html

@@ -32,7 +32,7 @@
 
       <!-- About Section -->
       <section id="about"></section>
-      <aside class="about-ad">
+      <!-- <aside class="about-ad">
         <div class="horizontal-ad-banner">
           <div class="ad-content">
             <div class="ad-icon">
@@ -47,11 +47,11 @@
             ></a>
           </div>
         </div>
-      </aside>
+      </aside> -->
 
       <!-- Featured Section -->
       <section id="featured"></section>
-      <aside class="featured-ad">
+      <!-- <aside class="featured-ad">
         <div class="feature-ad-banner">
           <div class="ad-content">
             <div class="ad-icon">
@@ -64,11 +64,11 @@
             ></a>
           </div>
         </div>
-      </aside>
+      </aside> -->
 
       <!-- Projects Section -->
       <section id="projects"></section>
-      <aside class="projects-ad">
+      <!-- <aside class="projects-ad">
         <div class="horizontal-ad-banner">
           <div class="ad-content">
             <div class="ad-icon">
@@ -83,11 +83,11 @@
             ></a>
           </div>
         </div>
-      </aside>
+      </aside> -->
 
       <!-- Services Section -->
       <section id="services"></section>
-      <aside class="services-ad">
+      <!-- <aside class="services-ad">
         <div class="feature-ad-banner">
           <div class="ad-content">
             <div class="ad-icon">
@@ -100,7 +100,7 @@
             ></a>
           </div>
         </div>
-      </aside>
+      </aside> -->
 
       <!-- Contact Section -->
       <section id="contact"></section>