dasaCoder · SGDilakshan · May 8, 2025
diff --git a/Images/Logo/docker.png b/Images/Logo/docker.png
diff --git a/Images/Logo/excel.png b/Images/Logo/excel.png
diff --git a/Images/Logo/fastapi.png b/Images/Logo/fastapi.png
diff --git a/Images/Logo/google-sheets.png b/Images/Logo/google-sheets.png
diff --git a/Images/Logo/hadoop.png b/Images/Logo/hadoop.png
diff --git a/Images/Logo/huggingface.png b/Images/Logo/huggingface.png
diff --git a/Images/Logo/java.png b/Images/Logo/java.png
diff --git a/Images/Logo/keras.png b/Images/Logo/keras.png
diff --git a/Images/Logo/kubernetes.png b/Images/Logo/kubernetes.png
diff --git a/Images/Logo/lightgbm.png b/Images/Logo/lightgbm.png
diff --git a/Images/Logo/matplotlib.png b/Images/Logo/matplotlib.png
diff --git a/Images/Logo/mongodb.png b/Images/Logo/mongodb.png
diff --git a/Images/Logo/mysql.png b/Images/Logo/mysql.png
diff --git a/Images/Logo/nltk.png b/Images/Logo/nltk.png
diff --git a/Images/Logo/numpy.png b/Images/Logo/numpy.png
diff --git a/Images/Logo/opencv.png b/Images/Logo/opencv.png
diff --git a/Images/Logo/pandas.png b/Images/Logo/pandas.png
diff --git a/Images/Logo/postgresql.png b/Images/Logo/postgresql.png
diff --git a/Images/Logo/power-bi.png b/Images/Logo/power-bi.png
diff --git a/Images/Logo/python.png b/Images/Logo/python.png
diff --git a/Images/Logo/pytorch.png b/Images/Logo/pytorch.png
diff --git a/Images/Logo/r.png b/Images/Logo/r.png
diff --git a/Images/Logo/scikit-learn.png b/Images/Logo/scikit-learn.png
diff --git a/Images/Logo/seaborn.png b/Images/Logo/seaborn.png
diff --git a/Images/Logo/spacy.png b/Images/Logo/spacy.png
diff --git a/Images/Logo/spark.png b/Images/Logo/spark.png
diff --git a/Images/Logo/sql.png b/Images/Logo/sql.png
diff --git a/Images/Logo/tableau.png b/Images/Logo/tableau.png
diff --git a/Images/Logo/tensorflow-cv.png b/Images/Logo/tensorflow-cv.png
diff --git a/Images/Logo/tensorflow.png b/Images/Logo/tensorflow.png
diff --git a/Images/Logo/xgboost.png b/Images/Logo/xgboost.png
diff --git a/Images/Projects/project1.jpg b/Images/Projects/project1.jpg
diff --git a/Images/Projects/project2.jpg b/Images/Projects/project2.jpg
diff --git a/Images/Projects/project3.jpg b/Images/Projects/project3.jpg
diff --git a/Images/Projects/project4.jpg b/Images/Projects/project4.jpg
diff --git a/Images/Projects/project5.jpg b/Images/Projects/project5.jpg
diff --git a/Images/Projects/project6.jpg b/Images/Projects/project6.jpg
diff --git a/Images/about.jpg b/Images/about.jpg
diff --git a/Images/profile.jpeg b/Images/profile.jpeg
diff --git a/Sivanathan Dilakshan CV.pdf b/Sivanathan Dilakshan CV.pdf
diff --git a/index.html b/index.html
@@ -0,0 +1,290 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
+    <link rel="stylesheet" href="style.css" class="rel">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+
+    <title>Sivanathan Dilakshan</title>
+</head>
+
+<body>
+    <!-- Header section code -->
+    <header class="header">
+        <a href="#home" class="logo">Sivanathan Dilakshan</a>
+
+        <i class='bx bx-menu' id="menu-icon"></i>
+
+        <nav class="navbar">
+            <a href="#home">Home</a>
+            <a href="#about">About</a>
+            <a href="#skills">Skills</a>
+            <a href="#projects">Projects</a>
+            <a href="#contact">Contact</a>
+        </nav>
+    </header>
+
+    <!-- Home Section Code-->
+    <section class="home" id="home">
+        <div class="home-img">
+            <img src="Images/profile.jpeg" alt="Profile-Img">
+        </div>
+        <div class="home-content">
+            <h3>👋 Hello, I'm</h3>
+            <h1>Sivanathan Dilakshan</h1>
+            <h3>And I'm Aspiring <span class="multiple-text">Data Scientist</span></h3>
+            <p> I build end-to-end ML solutions, create interactive AI dashboards, and lead Pi Code - Tamil to make Math
+                and Programming simple in Tamil.</p>
+
+            <div class="social-media">
+                <a href="https://www.linkedin.com/in/sivanathandilakshan"><i class="bx bxl-linkedin"></i></a>
+                <a href="https://github.com/SGDilakshan"><i class="bx bxl-github"></i></a>
+                <a href="https://medium.com/@sivanathandilakshan"><i class="bx bxl-medium"></i></a>
+                <a href="https://www.facebook.com/SGDilakshan"><i class='bx bxl-facebook'></i></a>
+            </div>
+            <a href="Sivanathan Dilakshan CV.pdf" class="btn">Download CV</a>
+        </div>
+    </section>
+
+    <!-- About Section Code -->
+    <section class="about" id="about">
+        <div class="about-content">
+            <h2 class="heading">👨‍💻 About <span>Me</span></h2>
+            <p>I’m an aspiring Data Scientist and Machine Learning Engineer with a Software Engineering background from
+                the University of Kelaniya. I enjoy solving real-world problems using data, building predictive models,
+                and deploying intelligent systems. My academic and project experiences have shaped my ability to think
+                analytically and deliver solutions with impact.</p>
+            <p>
+                I specialize in data preprocessing, visualization, and model building using Python, Pandas,
+                scikit-learn, and deep learning frameworks like TensorFlow and PyTorch. I’m skilled in NLP, time series
+                forecasting, and interactive dashboarding with Streamlit and Power BI. I'm also learning cloud tools and
+                big data technologies to build scalable systems.</p>
+            <p>
+                Beyond technical work, I lead Pi Code Tamil, an initiative that simplifies math, programming, and AI for
+                Tamil-speaking learners. Whether collaborating on AI projects or sharing knowledge with students, I
+                believe technology is most powerful when it’s inclusive, meaningful, and shared for good.
+            </p>
+            <a href="https://github.com/SGDilakshan" class="btn">Read More</a>
+        </div>
+
+        <div class="about-img">
+            <img src="Images/about.jpg" alt="About Image">
+        </div>
+    </section>
+
+    <!-- Skills Section Code -->
+    <section class="skills" id="skills">
+        <h2 class="heading">🧠 My <span>Skills</span></h2>
+        <div class="skills-container">
+
+            <!-- Programming Languages -->
+            <div class="skills-box">
+                <i class="bx bxl-python"></i>
+                <h3>Programming Languages</h3>
+                <div class="icon-row">
+                    <img src="Images/Logo/python.png" alt="Python Logo">
+                    <img src="Images/Logo/r.png" alt="R Logo">
+                    <img src="Images/Logo/sql.png" alt="SQL Logo">
+                    <img src="Images/Logo/java.png" alt="Java Logo">
+                </div>
+            </div>
+
+            <!-- Data Science & Analysis Tools -->
+            <div class="skills-box">
+                <i class="bx bx-bar-chart-alt"></i>
+                <h3>Data Science & Analysis Tools</h3>
+                <div class="icon-row">
+                    <img src="Images/Logo/pandas.png" alt="Pandas Logo">
+                    <img src="Images/Logo/numpy.png" alt="NumPy Logo">
+                    <img src="Images/Logo/matplotlib.png" alt="Matplotlib Logo">
+                    <img src="Images/Logo/seaborn.png" alt="Seaborn Logo">
+                </div>
+            </div>
+
+            <!-- Machine Learning Tools -->
+            <div class="skills-box">
+                <i class="fas fa-robot"></i>
+                <h3>Machine Learning Tools</h3>
+                <div class="icon-row">
+                    <img src="Images/Logo/scikit-learn.png" alt="Scikit-learn Logo">
+                    <img src="Images/Logo/tensorflow.png" alt="TensorFlow Logo">
+                    <img src="Images/Logo/pytorch.png" alt="PyTorch Logo">
+                    <img src="Images/Logo/xgboost.png" alt="XGBoost Logo">
+                </div>
+            </div>
+
+            <!-- Data Visualization Tools -->
+            <div class="skills-box">
+                <i class="bx bx-pie-chart"></i>
+                <h3>Data Visualization Tools</h3>
+                <div class="icon-row">
+                    <img src="Images/Logo/matplotlib.png" alt="Matplotlib Logo">
+                    <img src="Images/Logo/seaborn.png" alt="Seaborn Logo">
+                    <img src="Images/Logo/tableau.png" alt="Tableau Logo">
+                    <img src="Images/Logo/power-bi.png" alt="Power BI Logo">
+                </div>
+            </div>
+
+            <!-- Databases -->
+            <div class="skills-box">
+                <i class="fas fa-database"></i>
+                <h3>Databases</h3>
+                <div class="icon-row">
+                    <img src="Images/Logo/mysql.png" alt="MySQL Logo">
+                    <img src="Images/Logo/postgresql.png" alt="PostgreSQL Logo">
+                    <img src="Images/Logo/mongodb.png" alt="MongoDB Logo">
+                </div>
+            </div>
+
+            <!-- Model Deployment & MLOps Tools -->
+            <div class="skills-box">
+                <i class="bx bx-cloud"></i>
+                <h3>Model Deployment & MLOps Tools</h3>
+                <div class="icon-row">
+                    <img src="Images/Logo/docker.png" alt="Docker Logo">
+                    <img src="Images/Logo/kubernetes.png" alt="Kubernetes Logo">
+                    <img src="Images/Logo/fastapi.png" alt="FastAPI Logo">
+                </div>
+            </div>
+
+            <!-- Big Data Tools -->
+            <div class="skills-box">
+                <i class="bx bx-data"></i>
+                <h3>Big Data Tools</h3>
+                <div class="icon-row">
+                    <img src="Images/Logo/spark.png" alt="Apache Spark Logo">
+                    <img src="Images/Logo/hadoop.png" alt="Hadoop Logo">
+                </div>
+            </div>
+
+            <!-- Natural Language Processing (NLP) Tools -->
+            <div class="skills-box">
+                <i class="bx bx-chat"></i>
+                <h3>Natural Language Processing Tools</h3>
+                <div class="icon-row">
+                    <img src="Images/Logo/nltk.png" alt="NLTK Logo">
+                    <img src="Images/Logo/spacy.png" alt="spaCy Logo">
+                    <img src="Images/Logo/huggingface.png" alt="Hugging Face Logo">
+                </div>
+            </div>
+
+            <!-- Computer Vision Tools -->
+            <div class="skills-box">
+                <i class="bx bx-image"></i>
+                <h3>Computer Vision Tools</h3>
+                <div class="icon-row">
+                    <img src="Images/Logo/opencv.png" alt="OpenCV Logo">
+                    <img src="Images/Logo/tensorflow-cv.png" alt="TensorFlow CV Logo">
+                </div>
+            </div>
+
+        </div>
+    </section>
+
+    <!-- Project Section -->
+    <section class="projects" id="projects">
+        <div class="projects-box">
+            <h2 class="heading">📂 My<span> Projects</span></h2>
+
+            <div class="wrapper">
+                <!-- Project 1 -->
+                <div class="projects-item">
+                    <img src="Images/Projects/project1.jpg" alt="Traffic Optimization">
+                    <h2>Smart Traffic Flow Optimization</h2>
+                    <p>Real-time system using Deep Q-Learning to reduce signal wait times by 47%.</p>
+                    <a href="https://github.com/SGDilakshan/Smart-Traffic-Flow-Optimization-with-Reinforcement-Learning.git"
+                        class="btn">View on GitHub</a>
+                </div>
+
+                <!-- Project 2 -->
+                <div class="projects-item">
+                    <img src="Images/Projects/project2.jpg" alt="Fake News Detector">
+                    <h2>Fake News Detection System</h2>
+                    <p>AI-powered web app using NLP (TF-IDF & PassiveAggressiveClassifier) to detect fake news articles
+                        in real-time.</p>
+                    <a href="https://github.com/SGDilakshan/Fake-News-Detection-System.git" class="btn">View on
+                        GitHub</a>
+                </div>
+
+
+                <!-- Project 3 -->
+                <div class="projects-item">
+                    <img src="Images/Projects/project3.jpg" alt="Emotion AI">
+                    <h2>Voice-to-Emotion AI Assistant</h2>
+                    <p>Real-time emotion detection using BERT + CNNs for mental health alerts.</p>
+                    <a href="https://github.com/SGDilakshan/Voice-to-Emotion-AI-Assistant.git" class="btn">View on
+                        GitHub</a>
+                </div>
+
+                <!-- Project 4 -->
+                <div class="projects-item">
+                    <img src="Images/Projects/project4.jpg" alt="Stock Analyzer">
+                    <h2>Real-time Stock Analyzer</h2>
+                    <p>Price & sentiment forecasting using ARIMA, Prophet, and Twitter NLP.</p>
+                    <a href="https://github.com/SGDilakshan/Real-time-Stock-Analyzer.git" class="btn">View on GitHub</a>
+                </div>
+
+                <!-- Project 5 -->
+                <div class="projects-item">
+                    <img src="Images/Projects/project5.jpg" alt="Resume Bot">
+                    <h2>Autonomous Resume Bot</h2>
+                    <p>ATS-ready resume screener using TF-IDF, BERT, and XGBoost deployed via Flask.</p>
+                    <a href="https://github.com/SGDilakshan/Autonomous-Resume-Bot.git" class="btn">View on GitHub</a>
+                </div>
+
+                <!-- Project 6 -->
+                <div class="projects-item">
+                    <img src="Images/Projects/project6.jpg" alt="AI Dashboard">
+                    <h2>AI Dashboard with Streamlit</h2>
+                    <p>End-to-end ML deployment with interactive dashboards and real-time insights.</p>
+                    <a href="https://github.com/SGDilakshan/AI-Dashboard-with-Streamlit.git" class="btn">View on
+                        GitHub</a>
+                </div>
+
+            </div>
+
+            <div class="read-more-btn">
+                <a href="https://github.com/SGDilakshan?tab=repositories" class="btn-more">🔗 View More Projects</a>
+            </div>
+        </div>
+    </section>
+
+    <!-- Contact section code -->
+    <section class="contact" id="contact">
+        <h2 class="heading">📧 Contact <span>Me</span></h2>
+        <form action="#">
+            <div class="input-box">
+                <input type="text" placeholder="Full Name">
+                <input type="email" name="email" placeholder="Email Address">
+            </div>
+            <div class="input-box">
+                <input type="number" placeholder="Phone Number">
+                <input type="text" placeholder="Email Subject">
+            </div>
+            <textarea name="message" id="" cols="30" rows="10" placeholder="Your Message"></textarea>
+            <input type="submit" value="Send Message" class="btn">
+        </form>
+
+    </section>
+
+    <!-- Footer Section Code-->
+    <footer class="footer">
+        <div class="social">
+            <a href="https://www.linkedin.com/in/sivanathandilakshan"><i class="bx bxl-linkedin"></i></a>
+            <a href="https://github.com/SGDilakshan"><i class="bx bxl-github"></i></a>
+            <a href="https://medium.com/@sivanathandilakshan"><i class="bx bxl-medium"></i></a>
+            <a href="https://www.facebook.com/SGDilakshan"><i class='bx bxl-facebook'></i></a>
+        </div>
+        <p class="copyright">
+            &copy; 2025 Sivanathan Dilakshan - All Rights Reserved
+        </p>
+    </footer>
+
+    <script src="https://unpkg.com/typed.js@2.1.0/dist/typed.umd.js"></script>
+    <script src="script.js"></script>
+</body>
+
+</html>
diff --git a/script.js b/script.js
@@ -0,0 +1,20 @@
+let menu = document.querySelector("#menu-icon");
+let navbar = document.querySelector(".navbar");
+
+menu.onclick = () =>{
+    menu.classList.toggle("bx-x");
+    navbar.classList.toggle("active");
+}
+
+window.onscroll = () =>{
+    menu.classList.remove("bx-x");
+    navbar.classList.remove("active");
+}
+
+const typed = new Typed('.multiple-text', {
+    strings: ['Data Analyst', 'Data Scientist','ML Engineer'],
+    typeSpeed: 80,
+    backSpeed: 80,
+    backDelay: 600,
+    loop: true,
+  });