File manager

File manager - Edit - /home/webapp69.cm.in.th/u69319090030/69319090030/index.html

Back
<!DOCTYPE html> <html lang="th"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>กุมภาพันธ์ กาวี \| Resume Portfolio</title> <meta name="description" content="แฟ้มสะสมผลงาน (Resume) ของ กุมภาพันธ์ กาวี นักศึกษาแผนกวิชาอิเล็กทรอนิกส์ วิทยาลัยเทคนิคเชียงใหม่"> <!-- Google Fonts --> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=Sarabun:wght@300;400;500;600;700&display=swap" rel="stylesheet"> <!-- Font Awesome Icons --> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> <!-- Custom CSS --> <link rel="stylesheet" href="style.css?v=1.2"> </head> <body> <!-- Header / Navigation Bar --> <header class="header" id="header"> <div class="nav-container"> <a href="#home" class="logo"> <span>Gumphaphan</span>.dev </a> <nav class="nav-menu" id="nav-menu"> <ul class="nav-list"> <li class="nav-item"> <a href="#home" class="nav-link active-link">Home</a> </li> <li class="nav-item"> <a href="#about" class="nav-link">About</a> </li> <li class="nav-item"> <a href="#projects" class="nav-link">Projects</a> </li> <li class="nav-item"> <a href="#contact" class="nav-link">Contact</a> </li> </ul> </nav> <div class="header-actions"> <button class="theme-toggle-btn header-theme-toggle" id="header-theme-toggle" aria-label="Toggle Theme"> <i class="fa-solid fa-moon"></i> </button> <button class="nav-toggle" id="nav-toggle" aria-label="Toggle Navigation Menu"> <span class="hamburger-bar"></span> <span class="hamburger-bar"></span> <span class="hamburger-bar"></span> </button> </div> </div> </header> <main class="main-content"> <!-- Hero Section --> <section class="hero-section section" id="home"> <div class="hero-container container"> <div class="hero-data"> <span class="hero-subtitle">ยินดีต้อนรับสู่พื้นที่ส่วนตัวของฉัน</span> <h1 class="hero-title">สวัสดีครับ <span>ผมชื่อกุมภาพันธ์</span></h1> <h2 class="hero-profession">นักศึกษาแผนกวิชาอิเล็กทรอนิกส์</h2> <p class="hero-description"> ชีวิตประจำวันชอบเล่นเกม ดูหนัง ฟังเพลง อ่านหนังสือ และออกกำลังกาย ตอนนี้กำลังศึกษาอยู่ที่วิทยาลัยเทคนิคเชียงใหม่ สายตรงแผนกอิเล็กทรอนิกส์ เลขที่ 30 </p> <div class="hero-buttons"> <a href="#about" class="btn btn-primary">รู้จักฉันมากขึ้น <i class="fa-solid fa-arrow-right"></i></a> <a href="#contact" class="btn btn-secondary">ติดต่อฉัน <i class="fa-regular fa-envelope"></i></a> </div> </div> <div class="hero-img-wrapper"> <div class="hero-blob"> <img src="assets/profile.jpg" alt="Gumphaphan Profile" class="hero-img"> </div> <div class="hero-badge badge-1"> <i class="fa-solid fa-bolt text-gradient"></i> <div> <h4>Electronics</h4> <p>Chiang Mai Tech</p> </div> </div> <div class="hero-badge badge-2"> <i class="fa-solid fa-gamepad text-gradient"></i> <div> <h4>Gaming</h4> <p>Hobbies & Activities</p> </div> </div> </div> </div> <!-- Background lights decoration --> <div class="glow-orb orb-1"></div> <div class="glow-orb orb-2"></div> </section> <!-- About Me Section --> <section class="about-section section" id="about"> <div class="container"> <h2 class="section-title">เกี่ยวกับตัวฉัน</h2> <span class="section-subtitle">ประวัติส่วนตัวและข้อมูลครอบครัว</span> <div class="about-grid"> <div class="about-info-box"> <h3 class="about-heading"><i class="fa-solid fa-user text-gradient"></i> ข้อมูลส่วนตัว</h3> <ul class="about-details-list" style="list-style: none; padding: 0; line-height: 2.2; margin-bottom: 2rem;"> <li><i class="fa-solid fa-id-card text-gradient" style="margin-right: 10px; width: 20px;"></i> <strong>ชื่อ-สกุล:</strong> กุมภาพันธ์ กาวี</li> <li><i class="fa-solid fa-ghost text-gradient" style="margin-right: 10px; width: 20px;"></i> <strong>ชื่อเล่น:</strong> เกม</li> <li><i class="fa-solid fa-calendar-days text-gradient" style="margin-right: 10px; width: 20px;"></i> <strong>วัน-เดือน-ปีเกิด:</strong> 23 กุมภาพันธ์ 2551</li> <li><i class="fa-solid fa-clock text-gradient" style="margin-right: 10px; width: 20px;"></i> <strong>อายุ:</strong> 18 ปี</li> <li><i class="fa-solid fa-user-tie text-gradient" style="margin-right: 10px; width: 20px;"></i> <strong>อาชีพ:</strong> นักศึกษา (เลขที่ 30)</li> </ul> <h3 class="about-heading"><i class="fa-solid fa-users text-gradient"></i> ข้อมูลครอบครัว</h3> <ul class="about-details-list" style="list-style: none; padding: 0; line-height: 2.2;"> <li><i class="fa-solid fa-person-breastfeeding text-gradient" style="margin-right: 10px; width: 20px;"></i> <strong>มารดา:</strong> วันใหม่ กาวี (พนักงาน)</li> <li><i class="fa-solid fa-phone text-gradient" style="margin-right: 10px; width: 20px;"></i> <strong>โทรศัพท์ (มารดา):</strong> <a href="tel:+66970021843" style="color: var(--text-main); font-weight: 500;">097-002-1843</a></li> <li><i class="fa-solid fa-envelope text-gradient" style="margin-right: 10px; width: 20px;"></i> <strong>Gmail:</strong> <a href="mailto:totk5268@gmail.com" style="color: var(--text-main); font-weight: 500;">totk5268@gmail.com</a></li> </ul> </div> <div class="skills-box"> <div class="education-timeline" style="margin-bottom: 2.5rem;"> <h3 class="about-heading"><i class="fa-solid fa-graduation-cap text-gradient"></i> ประวัติการศึกษา</h3> <div class="timeline-item"> <div class="timeline-dot"></div> <span class="timeline-date">ปัจจุบัน</span> <h4 class="timeline-title">วิทยาลัยเทคนิคเชียงใหม่</h4> <p class="timeline-desc">สายตรง แผนกวิชาอิเล็กทรอนิกส์</p> </div> </div> <div class="hobbies-activities-container" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 2rem;"> <div class="activities-box"> <h3 class="about-heading" style="font-size: 1.1rem; margin-bottom: 1rem;"><i class="fa-solid fa-star text-gradient"></i> กิจกรรมที่ชอบ</h3> <ul style="list-style: none; padding: 0; line-height: 2.2;"> <li><i class="fa-solid fa-gamepad text-gradient" style="margin-right: 8px;"></i> เล่นเกม</li> <li><i class="fa-solid fa-utensils text-gradient" style="margin-right: 8px;"></i> ชอบกิน</li> <li><i class="fa-solid fa-camera text-gradient" style="margin-right: 8px;"></i> ถ่ายรูป</li> <li><i class="fa-solid fa-book-open text-gradient" style="margin-right: 8px;"></i> อ่านหนังสือ</li> <li><i class="fa-solid fa-film text-gradient" style="margin-right: 8px;"></i> ดูหนัง</li> </ul> </div> <div class="hobbies-box"> <h3 class="about-heading" style="font-size: 1.1rem; margin-bottom: 1rem;"><i class="fa-solid fa-heart text-gradient"></i> งานอดิเรก</h3> <ul style="list-style: none; padding: 0; line-height: 2.2;"> <li><i class="fa-solid fa-gamepad text-gradient" style="margin-right: 8px;"></i> เล่นเกม</li> <li><i class="fa-solid fa-film text-gradient" style="margin-right: 8px;"></i> ดูหนัง</li> <li><i class="fa-solid fa-music text-gradient" style="margin-right: 8px;"></i> ฟังเพลง</li> <li><i class="fa-solid fa-dumbbell text-gradient" style="margin-right: 8px;"></i> ออกกำลังกาย</li> </ul> </div> </div> </div> </div> </div> </section> <!-- Projects Section --> <section class="projects-section section" id="projects"> <div class="container"> <h2 class="section-title">ผลงานและความสนใจ</h2> <span class="section-subtitle">สิ่งที่ฉันสนใจและเทคโนโลยีการเรียนรู้</span> <div class="projects-grid"> <!-- Project Card 1 --> <article class="project-card"> <div class="project-img-container"> <img src="assets/project1.png" alt="Mockup Dashboard Project" class="project-img"> <span class="project-tag">Electronics & IoT</span> </div> <div class="project-content"> <h3 class="project-title">โครงงานอิเล็กทรอนิกส์พื้นฐาน</h3> <p class="project-description"> การประกอบและทดสอบวงจรอิเล็กทรอนิกส์ การวัดค่าด้วยมัลติมิเตอร์ และการเรียนรู้ระบบสมองกลฝังตัว </p> <div class="project-tech"> <span>Electronics</span> <span>IoT</span> <span>Multimeter</span> <span>Arduino</span> </div> </div> </article> <!-- Project Card 2 --> <article class="project-card"> <div class="project-img-container"> <div class="project-img-fallback grad-orange"> <i class="fa-solid fa-gamepad"></i> </div> <span class="project-tag">Gaming Community</span> </div> <div class="project-content"> <h3 class="project-title">การวิเคราะห์และเล่นเกมอย่างมืออาชีพ</h3> <p class="project-description"> ศึกษาระบบ กลไกของเกม (Game Mechanics) และความคุ้นเคยกับการใช้เทคโนโลยียุคใหม่ในชีวิตประจำวัน </p> <div class="project-tech"> <span>E-Sports</span> <span>Strategy</span> <span>Teamwork</span> </div> </div> </article> <!-- Project Card 3 --> <article class="project-card"> <div class="project-img-container"> <div class="project-img-fallback grad-blue"> <i class="fa-solid fa-camera"></i> </div> <span class="project-tag">Photography & Media</span> </div> <div class="project-content"> <h3 class="project-title">งานอดิเรกถ่ายภาพนิ่ง</h3> <p class="project-description"> การจัดองค์ประกอบภาพ แสง เงา และการบันทึกภาพถ่ายด้วยกล้องมือถือ/กล้องดิจิทัลเพื่อเก็บบรรทึกความทรงจำ </p> <div class="project-tech"> <span>Photography</span> <span>Lighting</span> <span>Composition</span> </div> </div> </article> </div> </div> </section> <!-- Contact Section --> <section class="contact-section section" id="contact"> <div class="container"> <h2 class="section-title">ช่องทางการติดต่อ</h2> <span class="section-subtitle">สามารถส่งข้อความหรือติดต่อผ่านช่องทางด้านล่างนี้ได้เลยครับ!</span> <div class="contact-grid"> <div class="contact-info"> <h3 class="about-heading" style="margin-bottom: 1.5rem;">ข้อมูลการติดต่อ</h3> <div class="contact-cards"> <div class="contact-info-card"> <i class="fa-solid fa-phone text-gradient font-large"></i> <div> <h4>เบอร์โทรศัพท์</h4> <a href="tel:+66957715056">095-771-5056</a> </div> </div> <div class="contact-info-card"> <i class="fa-solid fa-envelope text-gradient font-large"></i> <div> <h4>อีเมล (Gmail)</h4> <a href="mailto:totk5268@gmail.com">totk5268@gmail.com</a> </div> </div> <div class="contact-info-card"> <i class="fa-solid fa-user text-gradient font-large"></i> <div> <h4>ชื่อผู้ติดต่อ (Facebook/Line)</h4> <span>กุมภาพันธ์ กาวี</span> </div> </div> <div class="contact-info-card"> <i class="fa-solid fa-location-dot text-gradient font-large"></i> <div> <h4>สถาบันการศึกษา</h4> <span>วิทยาลัยเทคนิคเชียงใหม่</span> </div> </div> </div> </div> <div class="contact-form-box"> <h3 class="about-heading" style="margin-bottom: 1.5rem;">ส่งข้อความด่วน</h3> <form id="contact-form" class="contact-form"> <div class="input-group"> <input type="text" id="name" name="name" required placeholder=" "> <label for="name">ชื่อของคุณ</label> <span class="input-line"></span> </div> <div class="input-group"> <input type="email" id="email" name="email" required placeholder=" "> <label for="email">อีเมลของคุณ</label> <span class="input-line"></span> </div> <div class="input-group"> <textarea id="message" name="message" required placeholder=" " rows="4"></textarea> <label for="message">รายละเอียดข้อความ</label> <span class="input-line"></span> </div> <button type="submit" class="btn btn-primary submit-btn"> <span>ส่งข้อความ</span> <i class="fa-regular fa-paper-plane"></i> </button> </form> </div> </div> </div> </section> </main> <!-- Footer --> <footer class="footer"> <div class="container footer-container"> <p class="footer-copy">© 2026 Gumphaphan.dev. สงวนลิขสิทธิ์ทั้งหมด.</p> <div class="footer-socials"> <a href="#"><i class="fa-brands fa-facebook-f"></i></a> <a href="#"><i class="fa-brands fa-instagram"></i></a> <a href="#"><i class="fa-brands fa-twitter"></i></a> </div> </div> </footer> <!-- Sticky Bottom Navigation Menu --> <nav class="bottom-nav" id="bottom-nav"> <ul class="bottom-nav-list"> <li class="bottom-nav-item"> <a href="#home" class="bottom-nav-link active-link" data-target="home"> <i class="fa-solid fa-house"></i> <span class="bottom-nav-text">Home</span> </a> </li> <li class="bottom-nav-item"> <a href="#about" class="bottom-nav-link" data-target="about"> <i class="fa-solid fa-user"></i> <span class="bottom-nav-text">About</span> </a> </li> <li class="bottom-nav-item"> <a href="#projects" class="bottom-nav-link" data-target="projects"> <i class="fa-solid fa-briefcase"></i> <span class="bottom-nav-text">Projects</span> </a> </li> <li class="bottom-nav-item"> <a href="#contact" class="bottom-nav-link" data-target="contact"> <i class="fa-solid fa-envelope"></i> <span class="bottom-nav-text">Contact</span> </a> </li> <li class="bottom-nav-item"> <button class="theme-toggle-btn" id="theme-toggle-btn" aria-label="Toggle Theme"> <i class="fa-solid fa-moon"></i> </button> </li> </ul> </nav> <!-- Toast Notification Container --> <div id="toast-container" class="toast-container"></div> <!-- Script File --> <script src="script.js?v=1.1"></script> </body> </html>

| ver. 1.4 | Github | . | PHP 7.4.33 | Generation time: 0.32 | proxy | phpinfo | Settings