Spaces:

JAYASWAROOP
/

portfolio

Running

App Files Files Community

JAYASWAROOP commited on Jul 11, 2024

Commit

4f23d85

verified ·

1 Parent(s): f474453

Update index.html

Browse files

Files changed (1) hide show

index.html +85 -50

index.html CHANGED Viewed

@@ -8,15 +8,98 @@
     <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
     <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
     <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
-    <script src="background.js"></script>
     <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" rel="stylesheet">
-    <link rel="stylesheet" href="style.css">
   <style>
     .project{
       border-top-left-radius: 8px;
       border-top-right-radius: 8px;
 }
   </style>
 </head>
 <body>
@@ -261,14 +344,6 @@
                         </div>
                     </div>
                 </div>
-              <div class="col" data-aos="zoom-in">
-                    <div class="card mb-4">
-                        <div class="card-body">
-                            <h5 class="card-title">SQL</h5>
-                            <p class="card-text">SQL is used for managing and querying relational databases💡📊</p>
-                        </div>
-                    </div>
-                </div>
             </div>
         </div>
     </section>
@@ -353,9 +428,7 @@
                 <label for="message">Message</label>
                 <textarea class="form-control" id="message" rows="5" placeholder="Your message"></textarea>
             </div>
             <button type="submit" class="btn btn-primary mt-3">Submit</button>
         </form>
     </div>
 </section>
@@ -377,44 +450,6 @@
       easing: 'ease', // Easing option
       once: true // Only animate elements once
     });
-const form = document.querySelector('form');
-form.addEventListener('submit', (event) => {
-  event.preventDefault(); // Prevent default form submission
-  const name = document.getElementById('name').value;
-  const email = document.getElementById('email').value;
-  const message = document.getElementById('message').value;
-  // Construct email content
-  const body = `
-    Name: ${name}\n
-    Email: ${email}\n
-    Message:\n
-    ${message}
-  `;
-  // Optional: Add validation for name, email, and message
-  // Send email using a dedicated library or service
-  // Example using a hypothetical library:
-  sendEmail({
-    to: '[email protected]',
-    subject: 'New Contact Form Submission',
-    body: body,
-  })
-    .then(() => {
-      // Clear form fields and display a success message
-      form.reset();
-      alert('Message sent successfully!');
-    })
-    .catch((error) => {
-      console.error('Error sending email:', error);
-      alert('An error occurred while sending the message. Please try again.');
-    });
-});
   </script>
 </body>
 </html>

     <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
     <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
     <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
     <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" rel="stylesheet">
   <style>
     .project{
       border-top-left-radius: 8px;
       border-top-right-radius: 8px;
 }
+body {
+            font-family: 'Arial', sans-serif;
+            line-height: 1.6;
+        }
+        .bg-image {
+            background-image: url('https://idearocketanimation.com/app/uploads/2019/01/laptop-in-darkness.jpg');
+            height: 85vh;
+            background-position: center;
+            background-repeat: no-repeat;
+            background-size: cover;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            text-align: center;
+        }
+        .hero-text {
+            color: #ffffff;
+        }
+        .btn-outline-light {
+            border-color: #ffffff;
+            color: #ffffff;
+        }
+        .btn-outline-light:hover {
+            background-color: #ffffff;
+            color: #3498db;
+        }
+        .card {
+            border-radius: 10px;
+            transition: transform 0.3s ease-in-out;
+        }
+        .card:hover {
+            transform: translateY(-5px);
+        }
+        .footer {
+            background-color: #2c3e50;
+            color: #ffffff;
+            text-align: center;
+        }
+        .profile-pic {
+            max-width: 300px;
+            max-height: 300px;
+            border-radius: 50%;
+            margin-left: 85px;
+        }
+        .profile-pic1 {
+            max-width: 220px;
+            max-height: 220px;
+            border-radius: 50%;
+        }
+        .description {
+            font-size: 1.2rem;
+        }
+        .img1{
+            height: 55px;
+            width: 55px;
+            border-radius: 50px;
+        }
+        .social-icons {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        gap: 20px;
+        margin-top: 20px;
+    }
+    .social-icon {
+        color: #fff;
+        font-size: 28px;
+        border-radius: 50%;
+        width: 55px;
+        height: 55px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        transition: all 0.3s ease;
+    }
+    .social-icon:hover {
+        transform: translateY(-3px);
+        box-shadow: 0px 4px 10px rgba(226, 251, 85, 0.3);
+        color: #81e7fc;
+        text-decoration: none;
+    }
   </style>
 </head>
 <body>
                         </div>
                     </div>
                 </div>
             </div>
         </div>
     </section>
                 <label for="message">Message</label>
                 <textarea class="form-control" id="message" rows="5" placeholder="Your message"></textarea>
             </div>
             <button type="submit" class="btn btn-primary mt-3">Submit</button>
         </form>
     </div>
 </section>
       easing: 'ease', // Easing option
       once: true // Only animate elements once
     });
   </script>
 </body>
 </html>