# All files / components/windows ContactContent.tsx

10.41% Statements 5/48
100% Branches 0/0
0% Functions 0/1
10.41% Lines 5/48

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    751x

    1x
    1x
    1x

    1x

     "use client"

    import type React from "react"

    import { personalInfo } from "@/data/apps" // Updated import path
    import styles from "@/components/windows/WindowContent.module.css"
    import { Mail, Phone, Linkedin, Github } from "lucide-react"

    export default function ContactContent() {
      const handleSubmit = (e: React.FormEvent) => {
        e.preventDefault()
        alert("Thank you for your message! This is a demo form.")
        // In a real application, you would send this data to a backend API.
      }

      return (
        <div className={styles.windowContent}>
          <section className={styles.contentSection}>
            <h2>Get In Touch</h2>
            <form onSubmit={handleSubmit} className={styles.contactForm}>
              <div className={styles.formGroup}>
                <label htmlFor="name">Name</label>
                <input type="text" id="name" name="name" required />
              </div>
              <div className={styles.formGroup}>
                <label htmlFor="email">Email</label>
                <input type="email" id="email" name="email" required />
              </div>
              <div className={styles.formGroup}>
                <label htmlFor="subject">Subject</label>
                <input type="text" id="subject" name="subject" required />
              </div>
              <div className={styles.formGroup}>
                <label htmlFor="message">Message</label>
                <textarea id="message" name="message" required />
              </div>
              <button type="submit" className={styles.submitButton}>
                Send Message
              </button>
            </form>
          </section>

          <section className={styles.contentSection}>
            <h2>Other Ways to Connect</h2>
            <div className={styles.contactMethods}>
              <div className={styles.methodCard}>
                <Mail size={40} />
                <p>Email Me</p>
                <a href={`mailto:${personalInfo.email}`}>{personalInfo.email}</a>
              </div>
              <div className={styles.methodCard}>
                <Phone size={40} />
                <p>Call Me</p>
                <a href={`tel:${personalInfo.phone}`}>{personalInfo.phone}</a>
              </div>
              <div className={styles.methodCard}>
                <Linkedin size={40} />
                <p>Connect on LinkedIn</p>
                <a href={personalInfo.linkedin} target="_blank" rel="noopener noreferrer">
                  Mohamed Gamal
                </a>
              </div>
              <div className={styles.methodCard}>
                <Github size={40} />
                <p>Follow on GitHub</p>
                <a href={personalInfo.github} target="_blank" rel="noopener noreferrer">
                  mohamed-gamal
                </a>
              </div>
            </div>
          </section>
        </div>
      )
    }