From 6855537975064efc1ce9287c89f1537072b4fad8 Mon Sep 17 00:00:00 2001
From: shafaat <shafaatali10@gmail.com>
Date: Wed, 11 Dec 2024 16:10:00 +0300
Subject: [PATCH] UBS Changes

---
 index.html | 182 ++++++++++++++++++++++++++++-------------------------
 1 file changed, 95 insertions(+), 87 deletions(-)

diff --git a/index.html b/index.html
index 16a9272..bd6427b 100644
--- a/index.html
+++ b/index.html
@@ -36,10 +36,11 @@
           <div class="collapse navbar-collapse" id="navbarSupportedContent">
             <ul class="navbar-nav ms-auto me-2">
               <li class="nav-item"><a class="nav-link" href="#about">About</a></li>
-              <li class="nav-item"><a class="nav-link" href="#services">Services</a></li>
+              <li class="nav-item"><a class="nav-link" href="#services">Capabilities</a></li>
               <li class="nav-item"><a class="nav-link" href="#skills">Skills</a></li>
               <li class="nav-item"><a class="nav-link" href="#portfolio">Portfolio</a></li>
               <li class="nav-item"><a class="nav-link" href="#experience">Experience</a></li>
+              <li class="nav-item"><a class="nav-link" href="#ubs">UBS Projects</a></li>
               <li class="nav-item"><a class="nav-link" href="#contact">Contact</a></li>
             </ul>
           </div>
@@ -48,7 +49,7 @@
     </header>
     <div class="page-content">
       <div id="content">
-<header>  
+<header>
   <div class="cover bg-light">
     <div class="container px-3">
       <div class="row">
@@ -57,11 +58,8 @@
           <div class="mt-5">
             <p class="lead text-uppercase mb-1">Hello!</p>
             <h1 class="intro-title marker" data-aos="fade-left" data-aos-delay="50">I’m Shafaat Khan</h1>
-            <!-- <p class="lead fw-normal mt-3" data-aos="fade-up" data-aos-delay="100">Lead Full-Stack Developer, Solution Architect & Freelancer (to be..)</p> -->
-            <!-- <div class="type-container lead fw-normal mt-3" data-aos="fade-up">
-              <p> iam> <span class="typed-text"></span><span class="cursor">&nbsp;  </span>/iam></p>
-            </div> -->
-            
+
+
             <div class="fakeTerminal">
             <div class=fakeMenu>
               <div class="fakeButtons fakeClose"></div>
@@ -70,13 +68,9 @@
             </div>
             <div class="fakeScreen">
               <p class="line1">> <span class="typed-text"></span><span class="cursor"></span><span class="cursor4">_</span></p>
-              <!-- <p class="line2">MyRole> yo gulp-webapp<span class="cursor4">_</span></p> -->
-              <!-- <p class="line2">Out of the box I include HTML5 Boilerplate, jQuery, and a gulpfile.js to build your app.<span class="cursor2">_</span></p>
-              <p class="line3">[?] What more would you like? (Press space to select)<span class="cursor3">_</span></p>
-              <p class="line4">><span class="cursor4">_</span></p> -->
             </div>
           </div>
-            <div class="social-nav" data-aos="fade-up" data-aos-delay="200">
+            <div class="social-nav" data-aos="fade-up" data-aos-delay="200" style="display: none">
               <nav role="navigation">
                 <ul class="nav justify-content-left">
                   <!-- <li class="nav-item"><a class="nav-link" href="https://twitter.com/templateflip" title="Twitter"><i class="fab fa-twitter"></i><span class="menu-title sr-only">Twitter</span></a></li> -->
@@ -90,7 +84,7 @@
             </div>
             <div class="mt-3" data-aos="fade-up" data-aos-delay="200"><a class="btn btn-primary shadow-sm mt-1 hover-effect" href="#contact">Get In Touch <i class="fas fa-arrow-right"></i></a></div>
           </div>
-        </div>  
+        </div>
       </div>
     </div>
   </div>
@@ -113,7 +107,7 @@
             <div class="pb-1">Email:</div>
           </div>
           <div class="col-sm-10">
-            <div class="pb-1 fw-bolder">shafaatali10@gmail.com</div>
+            <div class="pb-1 fw-bolder">shafaat.khan@ubs.com</div>
           </div>
           <!-- <div class="col-sm-2">
             <div class="pb-1">Skype:</div>
@@ -148,10 +142,7 @@
 <div class="section px-3 px-lg-4 pt-5" id="services">
   <div class="container-narrow">
     <div class="text-center mb-5">
-      <h2 class="marker marker-center">My Services</h2>
-    </div>
-    <div class="text-center">
-      <p class="mx-auto mb-3" style="max-width:600px"> I offer services for any applications requiring full-stack development. </p>
+      <h2 class="marker marker-center">My Capabilities</h2>
     </div>
     <div class="row py-3">
       <div class="col-md-3 text-center" data-aos="fade-up" data-aos-delay="200"><img class="mb-2" src="images/services/frontend.png" width="96" height="96" alt="Frontend"/>
@@ -265,14 +256,14 @@
           </figure></a></div>
       <div class="grid-item"><a href="https://dash.com.sg/">
           <figure class="portfolio-item"><img src="images/portfolio/dash-small.png" data-bp="images/portfolio/dash.png" data-caption="Example of an optional caption."/>
-            <figcaption> 
+            <figcaption>
               <h4 class="h5 mb-0">Fullstack Development</h4>
               <div>Visit link here</div>
             </figcaption>
           </figure></a></div>
       <div class="grid-item"><a href="https://www.abeeway.com/orange-business-services-implements-a-cutting-edge-covid-safety-solution-in-singapore-with-actility-abeeway/">
           <figure class="portfolio-item"><img src="images/portfolio/facial-recog-small.png" data-bp="images/portfolio/facial-recog.png" data-caption="Example of an optional caption."/>
-            <figcaption> 
+            <figcaption>
               <h4 class="h5 mb-0">Fullstack Development</h4>
               <div>Visit link here</div>
             </figcaption>
@@ -317,10 +308,6 @@
               </div><img src="images/experience/ubs.png" width="auto" height="34"/>
             </div>
           </div>
-          <!-- <div class="card-body px-3 py-2">
-            <p>Leverage agile frameworks to provide a robust synopsis for high level overviews. Iterative approaches to corporate strategy foster collaborative thinking to further the overall value proposition.</p>
-            <p>Organically grow the holistic world view of disruptive innovation via workplace diversity and empowerment.</p>
-          </div> -->
         </div>
       </div>
       <div class="col-md-6">
@@ -361,7 +348,7 @@
             <div class="d-flex justify-content-between">
               <div>
                 <h3 class="h5 mb-1">Senior Software Engineer</h3>
-                <div class="text-muted text-small">NCS. <small>(2020-2021)</small></div>                
+                <div class="text-muted text-small">NCS. <small>(2020-2021)</small></div>
               </div><img src="images/experience/ncs.png" width="auto" height="34"/>
             </div>
           </div>
@@ -410,7 +397,7 @@
               <div>
                 <h3 class="h5 mb-1">Senior Software Engineer</h3>
                 <div class="text-muted text-small">Orange Business Services. <small>(2014-2016)</small></div>
-              </div><img src="images/experience/obs.png" width="auto" height="48"/>             
+              </div><img src="images/experience/obs.png" width="auto" height="48"/>
             </div>
           </div>
           <!-- <div class="card-body px-3 py-2">
@@ -443,7 +430,7 @@
                 <h3 class="h5 mb-1">Programmer Analyst</h3>
                 <div class="text-muted text-small">Cognizant Technology Solutions. <small>(2011-2014)</small></div>
               </div><img src="images/experience/cts.png" width="auto" height="24"/>
-              
+
             </div>
           </div>
           <!-- <div class="card-body px-3 py-2">
@@ -462,60 +449,81 @@
               </div><img src="images/experience/css.png" width="auto" height="30"/>
             </div>
           </div>
-          <!-- <div class="card-body px-3 py-2">
-            <p>Leverage agile frameworks to provide a robust synopsis for high level overviews. Iterative approaches to corporate strategy foster collaborative thinking to further the overall value proposition.</p>
-            <p>Organically grow the holistic world view of disruptive innovation via workplace diversity and empowerment.</p>
-          </div> -->
         </div>
       </div>
     </div>
   </div>
 </div>
-<!-- <div class="section px-3 px-lg-4 pt-5" id="testimonials">
-  <div class="container-narrow">
-    <div class="text-center mb-5">
-      <h2 class="marker marker-center">Client Testimonials</h2>
-    </div>
-    <div class="row"> 
-      <div class="col-md-6 mb-5" data-aos="fade-right" data-aos-delay="100">
-        <div class="d-flex ms-md-3"><span><i class="fas fa-2x fa-quote-left"></i></span><span class="m-2">Walter displays exemplary professionalism and is able to take on challenges. He learns quickly and is an asset to any team.</span></div>
-        <div class="d-flex justify-content-end align-items-end">
-          <div class="text-end me-2">
-            <div class="fw-bolder">Aiyana</div>
-            <div class="text-small">CEO / Web Design Company</div>
-          </div><img class="me-md-3 rounded" src="images/testimonials/client1.jpg" width="96" height="96" alt="client 1"/>
-        </div>
-      </div>
-      <div class="col-md-6 mb-5" data-aos="fade-left" data-aos-delay="300">
-        <div class="d-flex ms-md-3"><span><i class="fas fa-2x fa-quote-left"></i></span><span class="m-2">Walter displays exemplary professionalism and is able to take on challenges. He learns quickly and is an asset to any team.</span></div>
-        <div class="d-flex justify-content-end align-items-end">
-          <div class="text-end me-2">
-            <div class="fw-bolder">Alexander</div>
-            <div class="text-small">CEO / Web Design Company</div>
-          </div><img class="me-md-3 rounded" src="images/testimonials/client2.jpg" width="96" height="96" alt="client 1"/>
-        </div>
-      </div>
-      <div class="col-md-6 mb-5" data-aos="fade-right" data-aos-delay="200">
-        <div class="d-flex ms-md-3"><span><i class="fas fa-2x fa-quote-left"></i></span><span class="m-2">Walter is a great co-worker and problem solver. He is quick to extend his helping hand and makes a good team player.</span></div>
-        <div class="d-flex justify-content-end align-items-end">
-          <div class="text-end me-2">
-            <div class="fw-bolder">Ariya</div>
-            <div class="text-small">Web Developer</div>
-          </div><img class="me-md-3 rounded" src="images/testimonials/client3.jpg" width="96" height="96" alt="client 1"/>
-        </div>
-      </div>
-      <div class="col-md-6 mb-5" data-aos="fade-left" data-aos-delay="400">
-        <div class="d-flex ms-md-3"><span><i class="fas fa-2x fa-quote-left"></i></span><span class="m-2">Walter is a great co-worker and problem solver. He is quick to extend his helping hand and makes a good team player.</span></div>
-        <div class="d-flex justify-content-end align-items-end">
-          <div class="text-end me-2">
-            <div class="fw-bolder">Braiden</div>
-            <div class="text-small">Web Designer</div>
-          </div><img class="me-md-3 rounded" src="images/testimonials/client4.jpg" width="96" height="96" alt="client 1"/>
-        </div>
-      </div>
-    </div>
-  </div>
-</div> -->
+          <div class="section px-3 px-lg-4 pt-5" id="ubs">
+              <div class="container-narrow">
+                  <div class="text-center mb-5">
+                      <h2 class="marker marker-center">UBS Projects</h2>
+                  </div>
+                  <div class="row py-3">
+                      <div class="col-md-6">
+                          <div class="card mb-3" data-aos="fade-right" data-aos-delay="100">
+                              <div class="card-header px-3 py-2">
+                                  <div class="d-flex justify-content-between">
+                                      <div>
+                                          <h3 class="h5 mb-1">Enterprise Architect</h3>
+                                          <div class="text-muted text-small">DevOps Engineering Team<small> [Automating Infra]</small></div>
+                                      </div>
+                                  </div>
+                              </div>
+                          </div>
+                      </div>
+                      <div class="col-md-6">
+                          <div class="card mb-3" data-aos="fade-right" data-aos-delay="100">
+                              <div class="card-header px-3 py-2">
+                                  <div class="d-flex justify-content-between">
+                                      <div>
+                                          <h3 class="h5 mb-1">Release Reporting</h3>
+                                          <div class="text-muted text-small">DevOps Engineering Team<small> [Automating Infra]</small></div>
+                                      </div>
+                                  </div>
+                              </div>
+                          </div>
+                      </div>
+                      <div class="col-md-6">
+                          <div class="card mb-3" data-aos="fade-right" data-aos-delay="100">
+                              <div class="card-header px-3 py-2">
+                                  <div class="d-flex justify-content-between">
+                                      <div>
+                                          <h3 class="h5 mb-1">Web DB Client</h3>
+                                          <div class="text-muted text-small">WMPC Marketplace Initiative<small> [Idea Owner, Fullstack Development]</small></div>
+                                      </div>
+                                  </div>
+                              </div>
+                          </div>
+                      </div>
+                      <div class="col-md-6">
+                          <div class="card mb-3" data-aos="fade-right" data-aos-delay="100">
+                              <div class="card-header px-3 py-2">
+                                  <div class="d-flex justify-content-between">
+                                      <div>
+                                          <h3 class="h5 mb-1">TDMS</h3>
+                                          <div class="text-muted text-small"><small> [Fullstack Development]</small></div>
+                                      </div>
+                                  </div>
+                              </div>
+                          </div>
+                      </div>
+                      <div class="col-md-6">
+                          <div class="card mb-3" data-aos="fade-right" data-aos-delay="100">
+                              <div class="card-header px-3 py-2">
+                                  <div class="d-flex justify-content-between">
+                                      <div>
+                                          <h3 class="h5 mb-1">TUM, XaaS</h3>
+                                          <div class="text-muted text-small"><small> [Fullstack Development]</small></div>
+                                      </div>
+                                  </div>
+                              </div>
+                          </div>
+                      </div>
+                  </div>
+              </div>
+          </div>
+
 <div class="section px-2 px-lg-4 pb-4 pt-5 mb-5" id="contact">
   <div class="container-narrow">
     <div class="text-center mb-5">
@@ -524,24 +532,24 @@
     <div class="row">
       <div class="col-md-6" data-aos="zoom-in" data-aos-delay="100">
         <div class="bg-light my-2 p-3 pt-2">
-    <form action="https://apps.shafaat.in/common/form/contact/send-message" method="POST" name="messageForm" id="message-form">
+    <form action="" method="POST" name="messageForm" id="message-form">
     <div class="form-group my-2">
       <label for="name" class="form-label fw-bolder">Name*</label>
-      <input class="form-control" type="text" id="name" name="name" required>
+      <input class="form-control" type="text" id="name" name="name" required disabled>
     </div>
     <div class="form-group my-2">
       <label for="phone" class="form-label fw-bolder">Phone</label>
-      <input class="form-control" type="text" id="phone" name="phone">
+      <input class="form-control" type="text" id="phone" name="phone" disabled>
     </div>
     <div class="form-group my-2">
       <label for="email" class="form-label fw-bolder">Email*</label>
-      <input class="form-control" type="email" id="email" name="email" required>
+      <input class="form-control" type="email" id="email" name="email" required disabled>
     </div>
   <div class="form-group my-2">
     <label for="message" class="form-label fw-bolder">Message*</label>
-    <textarea class="form-control" style="resize: none;" id="message" name="message" rows="4" required></textarea>
+    <textarea class="form-control" style="resize: none;" id="message" name="message" rows="4" required disabled></textarea>
   </div>
-  <button class="btn btn-primary mt-2" type="submit" id="form-button">Send</button>
+  <button class="btn btn-primary mt-2" type="submit" id="form-button" disabled>Send</button>
 </form>
         </div>
       </div>
@@ -554,14 +562,14 @@
           <p>See you!</p>
         </div>
         <div class="mt-53 px-1">
-          <div class="row"> 
+          <div class="row">
             <div class="col-sm-2">
               <div class="pb-1">Email:</div>
             </div>
             <div class="col-sm-10">
-              <div class="pb-1 fw-bolder">shafaatali10@gmail.com</div>
+              <div class="pb-1 fw-bolder">shafaat.khan@ubs.com</div>
             </div>
-            
+
             <div class="col-sm-2">
               <div class="pb-1">Phone:</div>
             </div>
@@ -578,11 +586,11 @@
   <div class="container">
     <div class="my-3">
       <div class="h4">Shafaat Khan</div>
-      <p>Lead Full-Stack Developer & Solution Architect</p>
+      <p>Software Engineer, Authorized Officer, Doha, Qatar</p>
       <div class="social-nav">
         <nav role="navigation">
           <ul class="nav justify-content-center">
-            
+
           </ul>
         </nav>
       </div>