chore: removed commented line on index.html and add readme

Author: killflex

.gitignore

@@ -0,0 +1,108 @@
+# killflex's Portfolio
+
+![Portfolio Preview](web-preview.png)
+
+## 🎨 About
+
+A stunning personal portfolio website showcasing the work of **Ferry Hasan (killflex)**, a talented 3D Motion Graphic Designer and 3D Artist based in Surabaya, Indonesia. This portfolio features beautiful 3D artwork, illustrations, and motion graphics created with industry-standard tools.
+
+## ✨ Features
+
+- **Responsive Design** - Fully responsive layout that works seamlessly across all devices
+- **Modern UI/UX** - Clean, professional interface with smooth animations
+- **Interactive Gallery** - Lightbox integration for viewing artwork in detail
+- **Contact Form** - Integrated contact form for job inquiries and collaborations
+- **Social Media Integration** - Direct links to Instagram, Twitter, GitHub, and more
+- **Smooth Scrolling** - Enhanced user experience with scroll reveal animations
+
+## 🛠️ Technologies Used
+
+- **HTML5** - Semantic markup structure
+- **CSS3** - Custom styling with modern CSS features
+- **JavaScript** - Interactive functionality and animations
+- **Libraries & Frameworks:**
+  - [Normalize.css](https://necolas.github.io/normalize.css/) - CSS reset
+  - [Font Awesome](https://fontawesome.com/) - Icon library
+  - [Boxicons](https://boxicons.com/) - Additional icon set
+  - [Lightbox2](https://lokeshdhakar.com/projects/lightbox2/) - Image gallery
+  - [ScrollReveal](https://scrollrevealjs.org/) - Scroll animations
+  - [Bootstrap](https://getbootstrap.com/) - Grid system and utilities
+  - [jQuery](https://jquery.com/) - DOM manipulation
+
+## 📂 Project Structure
+
+```
+killflex.github.io/
+├── assets/
+│   ├── css/           # Stylesheets
+│   ├── img/           # Images and visual assets
+│   ├── js/            # JavaScript files
+│   └── library/       # Third-party libraries
+├── index.html         # Main portfolio page
+├── success.html       # Form submission success page
+├── web-preview.png    # Portfolio preview image
+└── README.md          # Project documentation
+```
+
+## 🎯 Sections
+
+1. **Home** - Eye-catching hero section with introduction
+2. **About** - Personal background and professional journey
+3. **Works** - Portfolio gallery featuring 3D art and illustrations
+4. **Contact** - Contact form for inquiries and collaborations
+
+## 🚀 Getting Started
+
+### Prerequisites
+
+- A modern web browser (Chrome, Firefox, Safari, Edge)
+- Basic understanding of HTML/CSS/JS (for customization)
+
+### Installation
+
+1. Clone the repository:
+```bash
+git clone https://github.com/killflex/killflex.github.io.git
+```
+
+2. Navigate to the project directory:
+```bash
+cd killflex.github.io
+```
+
+3. Open `index.html` in your browser or use a local development server:
+```bash
+# Using Python 3
+python -m http.server 8000
+
+# Using Node.js (with http-server)
+npx http-server
+```
+
+4. Visit `http://localhost:8000` in your browser
+
+## 🎨 Featured Works
+
+The portfolio showcases various 3D projects created with:
+- **Blender** - 3D modeling and rendering
+- **Cinema 4D** - Motion graphics and animation
+- **ZBrush** - Digital sculpting
+- **Adobe After Effects** - Post-processing and effects
+- **Adobe Photoshop** - Image editing and compositing
+- **Octane/Cycles/Arnold** - Advanced rendering engines
+
+## 📧 Contact
+
+- **Email:** killflexediting@gmail.com
+- **Instagram:** [@killflex](https://www.instagram.com/killflex)
+- **Twitter:** [@fleksipi](https://twitter.com/fleksipi)
+- **GitHub:** [killflex](https://github.com/killflex)
+- **Linktree:** [killflex](https://linktr.ee/killflex)
+
+## 📄 License
+
+Copyright © 2021 killflex. All Rights Reserved.
+
+---
+
+<p align="center">Made with ❤️ by killflex</p>

README.md

@@ -13,7 +13,6 @@
     <link href="./assets/library/lightbox2-dev/dist/css/lightbox.min.css" rel="stylesheet" />
     <link rel="stylesheet" href="assets/css/styles.css">
     <link rel="shortcut icon" type="image" href="./assets/img/favicon2.png">
-    <!-- <link rel="shortcut icon" type="image" href="https://encrypted-tbn3.gstatic.com/favicon-tbn?q=tbn:ANd9GcQTJU8h7787Bm3hkhYh-yxu7C3oLc-8uBknyS8X6jw8ze_U2kQv7o3hTk5a6cubcBrP0-eXDzYnP5dEv2o"> -->
 </head>
 <body>
     <!-- header -->
@@ -26,9 +25,7 @@
             <div class="nav__menu" id="nav-menu">
                 <ul class="nav__list">
                     <li class="nav__item"><a href="#home" class="nav__link"><i class="fas fa-home nav__icon"></i> Home</a></li>
-                    <!-- <li class="nav__item"><a href="#home" class="nav__link active"><i class="fas fa-home nav__icon"></i> Home</a></li> -->
                     <li class="nav__item"><a href="#about" class="nav__link"><i class="fas fa-user nav__icon"></i> About</a></li>
-                    <!-- <li class="nav__item"><a href="#skills" class="nav__link"><i class="fas fa-clipboard-list nav__icon"></i> Skills</a></li> -->
                     <li class="nav__item"><a href="#works" class="nav__link"><i class="fas fa-image nav__icon"></i> Works</a></li>
                     <li class="nav__item"><a href="#contact" class="nav__link"><i class="fas fa-envelope-open-text nav__icon"></i> Contact</a></li>
                 </ul>
@@ -95,98 +92,6 @@ <h2 class="about__subtitle">Hi there!</h1>
         </section>
         <!-- /about -->
 
-        <!-- skills -->
-        <!-- <section class="skills section" id="skills">
-            <h2 class="section-title">Skills</h2>
-
-            <div class="skills__container bd-grid">
-                <div>
-                    <h2 class="skills__subtitle">Softskills</h2>
-                    <p class="skills__text">This softskills percentage isn't necessarily correct, xD. It's all just according to my instintcs and experience. Only you who can estimate how good is my skills <i class="far fa-grin-squint"></i>.</p>                    
-
-                    <div class="skills__data">
-                        <div class="skills__names">
-                            <img src="assets/img/ae.png" alt="after effects mini icon" width="20px" class="skills__icon">
-                            <span class="skills_name">Adobe After Effects</span>
-                        </div>
-
-                        <div>
-                            <span class="skills__percentage">86%</span>
-                        </div>
-
-                        <div class="skills__bar skills__ae"></div>
-                    </div>
-                    <div class="skills__data">
-                        <div class="skills__names">
-                            <img src="assets/img/pr.png" alt="premier pro mini icon" width="20px" class="skills__icon">
-                            <span class="skills_name">Adobe Premiere Pro</span>
-                        </div>
-
-                        <div>
-                            <span class="skills__percentage">80%</span>
-                        </div>
-
-                        <div class="skills__bar skills__pr"></div>
-                    </div>
-                    <div class="skills__data">
-                        <div class="skills__names">
-                            <img src="assets/img/ps.png" alt="photoshop mini icon" width="20px" class="skills__icon">
-                            <span class="skills_name">Adobe Photoshop</span>
-                        </div>
-
-                        <div>
-                            <span class="skills__percentage">78%</span>
-                        </div>
-
-                        <div class="skills__bar skills__ps"></div>
-                    </div>
-                    <div class="skills__data">
-                        <div class="skills__names">
-                            <img src="assets/img/br.png" alt="blender mini icon" width="20px" class="skills__icon">
-                            <span class="skills_name">Blender</span>
-                        </div>
-
-                        <div>
-                            <span class="skills__percentage">82%</span>
-                        </div>
-
-                        <div class="skills__bar skills__br"></div>
-                    </div>
-                    
-                </div>
-                
-                <div>
-                    <img src="assets/img/skills.svg" alt="softskills" class="skills__img">
-                </div>
-            </div>
-        </section> -->
-
-            <!-- <div class="skills__data">
-                    <div class="skills__names">
-                        <img src="assets/img/html5.png" alt="" width="20px" class="skills__icon">
-                        <span class="skills_name">HTML 5</span>
-                    </div>
-
-                    <div>
-                        <span class="skills__percentage">30%</span>
-                    </div>
-
-                    <div class="skills__bar skills__h5"></div>
-                </div>
-                <div class="skills__data">
-                    <div class="skills__names">
-                        <img src="assets/img/css3.png" alt="" width="20px" class="skills__icon">
-                        <span class="skills_name">CSS 3</span>
-                    </div>
-
-                    <div>
-                        <span class="skills__percentage">20%</span>
-                    </div>
-
-                    <div class="skills__bar skills__c3"></div>
-                </div> -->
-        <!-- /skills -->
-
         <!-- visuals -->
         <section class="visuals section" id="works">
             <h2 class="section-title">Works</h2>
@@ -266,62 +171,6 @@ <h3 class="visuals__subs bd-grid">3D Art & Illustration</h3>
                     <h5>more works</h5>
                 </a>
             </div>
-                
-            <!-- <h3 class="visuals__subs bd-grid">Motion Graphics</h3> -->
-            <div class="visuals__container bd-grid">
-
-                <!-- <div class="visuals__img">
-                    <video controls poster="assets/img/visuals/idk.jpg">
-                        <source src="assets/videos/idk.mp4" type="video/mp4">
-                    </video>
-                </div>
-                <div class="visuals__img">
-                    <video controls poster="assets/img/visuals/simulation.jpg">
-                        <source src="assets/videos/minekrep_simulation.mp4" type="video/mp4">
-                    </video>
-                </div>
-                <div class="visuals__img">
-                    <video controls poster="assets/img/visuals/robot.jpg">
-                        <source src="assets/videos/robot.mp4" type="video/mp4">
-                    </video>
-                </div>
-                <div class="visuals__img">
-                    <video controls poster="assets/img/visuals/galaxy.jpg">
-                        <source src="assets/videos/hd_wallpaper.mp4" type="video/mp4">
-                    </video>
-                </div>
-                <div class="visuals__img">
-                    <video controls poster="assets/img//visuals/galaxy2.png">
-                        <source src="assets/videos/galaxy_phone.mp4" type="video/mp4">
-                    </video>
-                </div>
-                <div class="visuals__img">
-                    <video controls poster="assets/img/visuals/pone.png">
-                        <source src="assets/videos/RTX_pone.mp4" type="video/mp4">
-                    </video>
-                </div> -->
-                <!-- <div class="visuals__img">
-                    <video controls poster="assets/img/resonance.jpg">
-                        <source src="assets/videos/resonance.mp4" type="video/mp4">
-                    </video>
-                </div>
-                <div class="visuals__img">
-                    <video controls poster="assets/img/bustdown.jpg">
-                        <source src="assets/videos/bustdown.mp4" type="video/mp4">
-                    </video>
-                </div>
-                <div class="visuals__img">
-                    <video controls poster="assets/img/tour.jpg">
-                        <source src="assets/videos/tour.mp4" type="video/mp4">
-                    </video>
-                </div>-->
-            </div> 
-
-            <!-- <div class="visuals__more">
-                <a href="https://www.instagram.com/killflex" target="_blank">
-                    <h5>more works...</h5>
-                </a>
-            </div>  -->
         </section>
         <!-- /visuals -->