Spaces:
Running
Running
| <html lang="en" class="scroll-smooth"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Manideep Reddy - Data Sage</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <link href="https://fonts.googleapis.com/css2?family=Tangerine:wght@400;700&family=Raleway:wght@300;400;600;700&display=swap" rel="stylesheet"> | |
| <script> | |
| tailwind.config = { | |
| darkMode: 'class', | |
| theme: { | |
| extend: { | |
| fontFamily: { | |
| 'sanskrit': ['Tangerine', 'cursive'], | |
| 'content': ['Raleway', 'sans-serif'] | |
| }, | |
| colors: { | |
| 'saffron': '#FF9933', | |
| 'royal-blue': '#4169E1', | |
| 'ancient-gold': '#D4AF37', | |
| 'indigo': '#4B0082', | |
| 'ivory': '#FFFFF0', | |
| 'dark-cloth': '#1A1A2E' | |
| }, | |
| animation: { | |
| 'fade-in': 'fadeIn 0.5s ease-in-out', | |
| 'slide-up': 'slideUp 0.5s ease-out', | |
| 'float': 'float 3s ease-in-out infinite', | |
| 'scroll-text': 'scrollText 20s linear infinite' | |
| }, | |
| keyframes: { | |
| fadeIn: { | |
| '0%': { opacity: '0' }, | |
| '100%': { opacity: '1' }, | |
| }, | |
| slideUp: { | |
| '0%': { transform: 'translateY(20px)', opacity: '0' }, | |
| '100%': { transform: 'translateY(0)', opacity: '1' }, | |
| }, | |
| float: { | |
| '0%, 100%': { transform: 'translateY(0)' }, | |
| '50%': { transform: 'translateY(-10px)' }, | |
| }, | |
| scrollText: { | |
| '0%': { transform: 'translateX(100%)' }, | |
| '100%': { transform: 'translateX(-100%)' } | |
| } | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| <style> | |
| body { | |
| font-family: 'content', sans-serif; | |
| background-color: #FFFFF0; | |
| color: #333; | |
| } | |
| .dark body { | |
| background-color: #1A1A2E; | |
| color: #EEE; | |
| } | |
| .page-border { | |
| border: 15px solid transparent; | |
| border-image: url('https://i.imgur.com/J4gX5bH.png') 30 round; | |
| } | |
| .mahabharat-bg { | |
| background-image: url('https://i.imgur.com/d0Qm9uL.jpg'); | |
| background-size: cover; | |
| background-position: center; | |
| background-attachment: fixed; | |
| } | |
| .sanskrit-text { | |
| font-family: 'sanskrit', cursive; | |
| } | |
| .palm-leaf { | |
| background-color: #F5F5DC; | |
| border: 1px solid #D2B48C; | |
| box-shadow: 0 0 10px rgba(0,0,0,0.1); | |
| position: relative; | |
| } | |
| .palm-leaf::before { | |
| content: ""; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| height: 30px; | |
| background: linear-gradient(to bottom, #D2B48C, transparent); | |
| } | |
| .palm-leaf::after { | |
| content: ""; | |
| position: absolute; | |
| bottom: 0; | |
| left: 0; | |
| right: 0; | |
| height: 30px; | |
| background: linear-gradient(to top, #D2B48C, transparent); | |
| } | |
| .ancient-border { | |
| border: 8px solid transparent; | |
| border-image: url('https://i.imgur.com/J4gX5bH.png') 30 round; | |
| } | |
| .scroll-text-container { | |
| overflow: hidden; | |
| white-space: nowrap; | |
| } | |
| .scroll-text { | |
| display: inline-block; | |
| padding-left: 100%; | |
| animation: scrollText 20s linear infinite; | |
| } | |
| </style> | |
| </head> | |
| <body class="dark:bg-dark-cloth dark:text-ivory transition-colors duration-500"> | |
| <!-- Ancient Scroll Header --> | |
| <div class="bg-saffron text-indigo py-2 scroll-text-container hidden md:block"> | |
| <div class="scroll-text sanskrit-text text-2xl font-bold"> | |
| ॐ मणिदीप रेड्डी - दत्ता विश्लेषक | Data Sage harnessing the power of Drona's wisdom | संख्यात्मक ज्ञान से अर्जुन की तरह सटीक | माणिक्य की तरह दुर्लभ कौशल | | |
| </div> | |
| </div> | |
| <!-- Navigation - Like a Warrior's Armor --> | |
| <nav class="fixed w-full bg-ivory/90 dark:bg-indigo/90 backdrop-blur-md z-50 shadow-lg border-b-2 border-ancient-gold"> | |
| <div class="container mx-auto px-6 py-3"> | |
| <div class="flex justify-between items-center"> | |
| <a href="#home" class="text-2xl font-bold text-indigo dark:text-saffron flex items-center sanskrit-text"> | |
| <span class="mr-2">मणिदीप</span> | |
| <i class="fas fa-database text-sm"></i> | |
| </a> | |
| <div class="hidden md:flex space-x-8"> | |
| <a href="#home" class="nav-link font-semibold text-indigo dark:text-saffron hover:text-royal-blue dark:hover:text-ancient-gold transition-colors">Home</a> | |
| <a href="#experience" class="nav-link font-semibold text-indigo dark:text-saffron hover:text-royal-blue dark:hover:text-ancient-gold transition-colors">Experience</a> | |
| <a href="#skills" class="nav-link font-semibold text-indigo dark:text-saffron hover:text-royal-blue dark:hover:text-ancient-gold transition-colors">Skills</a> | |
| <a href="#education" class="nav-link font-semibold text-indigo dark:text-saffron hover:text-royal-blue dark:hover:text-ancient-gold transition-colors">Education</a> | |
| <a href="#projects" class="nav-link font-semibold text-indigo dark:text-saffron hover:text-royal-blue dark:hover:text-ancient-gold transition-colors">Projects</a> | |
| <a href="#contact" class="nav-link font-semibold text-indigo dark:text-saffron hover:text-royal-blue dark:hover:text-ancient-gold transition-colors">Contact</a> | |
| </div> | |
| <div class="flex items-center space-x-4"> | |
| <button id="theme-toggle" class="p-2 rounded-full hover:bg-royal-blue/20 dark:hover:bg-saffron/20 transition"> | |
| <i class="fas fa-moon dark:hidden text-indigo"></i> | |
| <i class="fas fa-sun hidden dark:block text-saffron"></i> | |
| </button> | |
| <button id="mobile-menu-button" class="md:hidden p-2 rounded-full hover:bg-royal-blue/20 dark:hover:bg-saffron/20 transition"> | |
| <i class="fas fa-bars text-indigo dark:text-saffron"></i> | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Mobile menu --> | |
| <div id="mobile-menu" class="hidden md:hidden mt-3 pb-2"> | |
| <a href="#home" class="block py-2 px-4 hover:bg-royal-blue/10 dark:hover:bg-saffron/10 rounded">Home</a> | |
| <a href="#experience" class="block py-2 px-4 hover:bg-royal-blue/10 dark:hover:bg-saffron/10 rounded">Experience</a> | |
| <a href="#skills" class="block py-2 px-4 hover:bg-royal-blue/10 dark:hover:bg-saffron/10 rounded">Skills</a> | |
| <a href="#education" class="block py-2 px-4 hover:bg-royal-blue/10 dark:hover:bg-saffron/10 rounded">Education</a> | |
| <a href="#projects" class="block py-2 px-4 hover:bg-royal-blue/10 dark:hover:bg-saffron/10 rounded">Projects</a> | |
| <a href="#contact" class="block py-2 px-4 hover:bg-royal-blue/10 dark:hover:bg-saffron/10 rounded">Contact</a> | |
| </div> | |
| </div> | |
| </nav> | |
| <!-- Hero Section - Like Arjuna's Entrance --> | |
| <section id="home" class="min-h-screen flex items-center pt-20 mahabharat-bg relative"> | |
| <div class="absolute inset-0 bg-black/40 dark:bg-black/60"></div> | |
| <div class="container mx-auto px-6 py-16 md:py-24 relative z-10"> | |
| <div class="flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/2 mb-12 md:mb-0 animate-fade-in"> | |
| <h1 class="text-4xl md:text-6xl font-bold mb-6 sanskrit-text text-saffron"> | |
| नमस्ते, | |
| </h1> | |
| <h1 class="text-4xl md:text-5xl font-bold mb-6 text-ivory"> | |
| I'm <span class="text-ancient-gold">Manideep Reddy</span> | |
| </h1> | |
| <h2 class="text-2xl md:text-3xl font-semibold mb-6 text-ivory/90 sanskrit-text"> | |
| A <span class="text-saffron">Data Sage</span> with skills sharp like Arjuna's arrows | |
| </h2> | |
| <div class="bg-ivory/90 dark:bg-indigo/90 p-6 rounded-lg shadow-lg mb-8 border-l-4 border-saffron"> | |
| <p class="text-lg text-gray-800 dark:text-ivory"> | |
| "Like the great scholars of the Mahabharata who interpreted celestial patterns, | |
| I decipher complex data patterns to uncover strategic insights that drive | |
| business decisions." | |
| </p> | |
| </div> | |
| <div class="flex flex-wrap gap-4"> | |
| <a href="#experience" class="bg-saffron text-indigo px-6 py-3 rounded-lg font-medium hover:bg-opacity-90 transition flex items-center"> | |
| <i class="fas fa-scroll mr-2"></i> My Journey | |
| </a> | |
| <a href="#contact" class="border-2 border-ancient-gold text-ancient-gold px-6 py-3 rounded-lg font-medium hover:bg-ancient-gold/10 transition flex items-center"> | |
| <i class="fas fa-envelope mr-2"></i> Send Message | |
| </a> | |
| <a href="https://linkedin.com/in/manideep-reddy" target="_blank" class="border-2 border-royal-blue text-royal-blue px-6 py-3 rounded-lg font-medium hover:bg-royal-blue/10 transition flex items-center"> | |
| <i class="fab fa-linkedin-in mr-2"></i> LinkedIn | |
| </a> | |
| </div> | |
| </div> | |
| <div class="md:w-1/2 flex justify-center animate-float"> | |
| <div class="relative w-64 h-64 md:w-80 md:h-80"> | |
| <div class="absolute inset-0 rounded-full bg-saffron/20 backdrop-blur-sm border-4 border-ancient-gold shadow-xl"></div> | |
| <div class="absolute inset-4 rounded-full bg-indigo/20 backdrop-blur-sm border-2 border-saffron animate-spin-slow"></div> | |
| <img src="https://i.imgur.com/JG5XqQm.jpg" alt="Manideep Reddy" class="absolute inset-4 rounded-full object-cover border-2 border-ivory shadow-lg"> | |
| <div class="absolute -bottom-4 -right-4 bg-indigo dark:bg-saffron text-ivory dark:text-indigo p-3 rounded-full shadow-lg"> | |
| <i class="fas fa-database text-2xl"></i> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Quick Info - Like Krishna's Sudarshan Chakra --> | |
| <div class="bg-indigo text-ivory py-6"> | |
| <div class="container mx-auto px-6"> | |
| <div class="flex flex-wrap justify-center gap-8 md:gap-16"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-envelope text-saffron mr-3 text-xl"></i> | |
| <div> | |
| <div class="font-semibold">Email</div> | |
| <div>manideepreddy.work@gmail.com</div> | |
| </div> | |
| </div> | |
| <div class="flex items-center"> | |
| <i class="fas fa-phone-alt text-saffron mr-3 text-xl"></i> | |
| <div> | |
| <div class="font-semibold">Phone</div> | |
| <div>(415)-902-1124</div> | |
| </div> | |
| </div> | |
| <div class="flex items-center"> | |
| <i class="fas fa-map-marker-alt text-saffron mr-3 text-xl"></i> | |
| <div> | |
| <div class="font-semibold">Location</div> | |
| <div>San Francisco, CA</div> | |
| </div> | |
| </div> | |
| <div class="flex items-center"> | |
| <i class="fas fa-graduation-cap text-saffron mr-3 text-xl"></i> | |
| <div> | |
| <div class="font-semibold">Degree</div> | |
| <div>MS in Data Science</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Professional Summary - Like Vyasa's Wisdom --> | |
| <section class="py-16 bg-ivory dark:bg-dark-cloth"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-12"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-4 sanskrit-text text-indigo dark:text-saffron">Professional Dharmic Path</h2> | |
| <div class="w-24 h-1 bg-ancient-gold mx-auto mb-6"></div> | |
| </div> | |
| <div class="max-w-4xl mx-auto bg-white dark:bg-indigo/10 p-8 rounded-xl shadow-md border-t-4 border-saffron animate-slide-up"> | |
| <div class="flex items-start"> | |
| <div class="hidden md:block mr-6"> | |
| <div class="bg-saffron/10 p-4 rounded-full border border-saffron/30"> | |
| <i class="fas fa-brain text-saffron text-3xl"></i> | |
| </div> | |
| </div> | |
| <div> | |
| <p class="text-lg mb-4 text-gray-700 dark:text-ivory/90"> | |
| Like the wise <span class="font-semibold text-indigo dark:text-saffron">Dronaacharya</span> who imparted strategic knowledge to the Pandavas, | |
| I bring <span class="font-semibold text-indigo dark:text-saffron">3+ years</span> of experience in <span class="font-semibold text-indigo dark:text-saffron">data analysis</span>, wielding powerful tools like | |
| <span class="font-semibold text-indigo dark:text-saffron">Python, SQL, R, and TensorFlow</span> to extract meaningful insights from complex data. | |
| </p> | |
| <p class="text-lg mb-4 text-gray-700 dark:text-ivory/90"> | |
| My expertise in <span class="font-semibold text-indigo dark:text-saffron">ETL processes, statistical analysis, and cloud platforms (AWS)</span> | |
| mirrors the <span class="sanskrit-text text-xl text-indigo dark:text-saffron">ऋषि</span> (Rishi) tradition of transforming raw observations into enlightened wisdom. | |
| </p> | |
| <p class="text-lg text-gray-700 dark:text-ivory/90"> | |
| Just as <span class="font-semibold text-indigo dark:text-saffron">Chakravartin Samrat</span> used data-driven strategies to rule vast empires, | |
| I employ <span class="font-semibold text-indigo dark:text-saffron">business process modeling and data mapping</span> to enhance client experiences | |
| and operational efficiency. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Experience - Like the Kurukshetra Battles --> | |
| <section id="experience" class="py-16 bg-gray-100 dark:bg-indigo/10"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-12"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-4 sanskrit-text text-indigo dark:text-saffron">Karma Yogic Journeys</h2> | |
| <p class="text-gray-600 dark:text-ivory/70 max-w-2xl mx-auto"> | |
| My professional battles where I wielded data as my weapon | |
| </p> | |
| <div class="w-24 h-1 bg-ancient-gold mx-auto mb-6"></div> | |
| </div> | |
| <div class="max-w-4xl mx-auto"> | |
| <!-- Experience 1 --> | |
| <div class="mb-12 p-6 bg-white dark:bg-indigo/20 rounded-xl shadow-md border-l-4 border-saffron animate-slide-up"> | |
| <div class="flex flex-col md:flex-row md:items-center justify-between mb-4"> | |
| <h3 class="text-xl md:text-2xl font-bold text-indigo dark:text-saffron">Data Analyst</h3> | |
| <div class="text-royal-blue dark:text-ancient-gold font-semibold">Oct 2024 – Present</div> | |
| </div> | |
| <h4 class="text-lg font-semibold mb-4 text-gray-700 dark:text-ivory/80">ConvoSearch</h4> | |
| <div class="space-y-4"> | |
| <div class="flex"> | |
| <div class="flex-shrink-0 mr-3 mt-1"> | |
| <div class="h-2 w-2 bg-saffron rounded-full"></div> | |
| </div> | |
| <p class="text-gray-700 dark:text-ivory/90"> | |
| Executed comprehensive data mining on large-scale user interaction logs using <span class="font-semibold text-indigo dark:text-saffron">SQL and Python (Pandas, NumPy)</span>, achieving <span class="font-semibold text-indigo dark:text-saffron">30% improvement</span> in search relevance. | |
| </p> | |
| </div> | |
| <div class="flex"> | |
| <div class="flex-shrink-0 mr-3 mt-1"> | |
| <div class="h-2 w-2 bg-saffron rounded-full"></div> | |
| </div> | |
| <p class="text-gray-700 dark:text-ivory/90"> | |
| Leveraged <span class="font-semibold text-indigo dark:text-saffron">AWS S3</span> for scalable storage and access of terabyte-scale data, reducing retrieval latency by <span class="font-semibold text-indigo dark:text-saffron">40%</span>. | |
| </p> | |
| </div> | |
| <div class="flex"> | |
| <div class="flex-shrink-0 mr-3 mt-1"> | |
| <div class="h-2 w-2 bg-saffron rounded-full"></div> | |
| </div> | |
| <p class="text-gray-700 dark:text-ivory/90"> | |
| Created data models that supported feature development contributing to a <span class="font-semibold text-indigo dark:text-saffron">15% increase</span> in user retention. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Experience 2 --> | |
| <div class="mb-12 p-6 bg-white dark:bg-indigo/20 rounded-xl shadow-md border-l-4 border-royal-blue animate-slide-up" style="animation-delay: 0.1s;"> | |
| <div class="flex flex-col md:flex-row md:items-center justify-between mb-4"> | |
| <h3 class="text-xl md:text-2xl font-bold text-indigo dark:text-saffron">Data Scientist</h3> | |
| <div class="text-royal-blue dark:text-ancient-gold font-semibold">Sep 2022 – Sep 2024</div> | |
| </div> | |
| <h4 class="text-lg font-semibold mb-4 text-gray-700 dark:text-ivory/80">Kubota Tractor Corporation</h4> | |
| <div class="space-y-4"> | |
| <div class="flex"> | |
| <div class="flex-shrink-0 mr-3 mt-1"> | |
| <div class="h-2 w-2 bg-royal-blue rounded-full"></div> | |
| </div> | |
| <p class="text-gray-700 dark:text-ivory/90"> | |
| Performed data mining and advanced statistical analysis on sales/financing data, identifying key drivers that <span class="font-semibold text-indigo dark:text-saffron">increased profitability by 15%</span>. | |
| </p> | |
| </div> | |
| <div class="flex"> | |
| <div class="flex-shrink-0 mr-3 mt-1"> | |
| <div class="h-2 w-2 bg-royal-blue rounded-full"></div> | |
| </div> | |
| <p class="text-gray-700 dark:text-ivory/90"> | |
| Conducted EDA using <span class="font-semibold text-indigo dark:text-saffron">Python (Pandas, NumPy)</span> and <span class="font-semibold text-indigo dark:text-saffron">SQL</span> on large datasets to uncover trends and prepare summaries. | |
| </p> | |
| </div> | |
| <div class="flex"> | |
| <div class="flex-shrink-0 mr-3 mt-1"> | |
| <div class="h-2 w-2 bg-royal-blue rounded-full"></div> | |
| </div> | |
| <p class="text-gray-700 dark:text-ivory/90"> | |
| Worked in Agile environment with <span class="font-semibold text-indigo dark:text-saffron">Jira and Git</span>, contributing to <span class="font-semibold text-indigo dark:text-saffron">20% increase</span> in team project throughput. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Experience 3 --> | |
| <div class="p-6 bg-white dark:bg-indigo/20 rounded-xl shadow-md border-l-4 border-ancient-gold animate-slide-up" style="animation-delay: 0.2s;"> | |
| <div class="flex flex-col md:flex-row md:items-center justify-between mb-4"> | |
| <h3 class="text-xl md:text-2xl font-bold text-indigo dark:text-saffron">Data Analyst Intern</h3> | |
| <div class="text-royal-blue dark:text-ancient-gold font-semibold">Mar 2022 – Aug 2022</div> | |
| </div> | |
| <h4 class="text-lg font-semibold mb-4 text-gray-700 dark:text-ivory/80">Cognizant</h4> | |
| <div class="space-y-4"> | |
| <div class="flex"> | |
| <div class="flex-shrink-0 mr-3 mt-1"> | |
| <div class="h-2 w-2 bg-ancient-gold rounded-full"></div> | |
| </div> | |
| <p class="text-gray-700 dark:text-ivory/90"> | |
| Processed, validated, and analyzed over <span class="font-semibold text-indigo dark:text-saffron">5 TB</span> of client transactional data using SQL-based ETL jobs and Python scripts. | |
| </p> | |
| </div> | |
| <div class="flex"> | |
| <div class="flex-shrink-0 mr-3 mt-1"> | |
| <div class="h-2 w-2 bg-ancient-gold rounded-full"></div> | |
| </div> | |
| <p class="text-gray-700 dark:text-ivory/90"> | |
| Reduced data retrieval times by <span class="font-semibold text-indigo dark:text-saffron">30%</span> and boosted reporting accuracy by <span class="font-semibold text-indigo dark:text-saffron">25%</span>. | |
| </p> | |
| </div> | |
| <div class="flex"> | |
| <div class="flex-shrink-0 mr-3 mt-1"> | |
| <div class="h-2 w-2 bg-ancient-gold rounded-full"></div> | |
| </div> | |
| <p class="text-gray-700 dark:text-ivory/90"> | |
| Assisted in business process mapping activities to support operational analysis. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Skills - Like the Astra Collection --> | |
| <section id="skills" class="py-16 bg-ivory dark:bg-dark-cloth"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-12"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-4 sanskrit-text text-indigo dark:text-saffron">Divine Astras</h2> | |
| <p class="text-gray-600 dark:text-ivory/70 max-w-2xl mx-auto"> | |
| The powerful weapons in my arsenal to conquer data challenges | |
| </p> | |
| <div class="w-24 h-1 bg-ancient-gold mx-auto mb-6"></div> | |
| </div> | |
| <!-- Skills Grid --> | |
| <div class="grid grid-cols-2 md:grid-cols-4 gap-6"> | |
| <!-- Column 1: Programming Languages --> | |
| <div class="bg-white dark:bg-indigo/10 p-6 rounded-xl shadow-md border-t-4 border-saffron animate-fade-in"> | |
| <h3 class="font-bold text-lg mb-4 text-indigo dark:text-saffron flex items-center"> | |
| <i class="fas fa-code mr-2"></i> | |
| Programming | |
| </h3> | |
| <div class="space-y-3"> | |
| <div class="flex items-center"> | |
| <div class="w-2 h-2 bg-saffron rounded-full mr-2"></div> | |
| <span>Python</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <div class="w-2 h-2 bg-saffron rounded-full mr-2"></div> | |
| <span>SQL</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <div class="w-2 h-2 bg-saffron rounded-full mr-2"></div> | |
| <span>R</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Column 2: Databases --> | |
| <div class="bg-white dark:bg-indigo/10 p-6 rounded-xl shadow-md border-t-4 border-royal-blue animate-fade-in" style="animation-delay: 0.1s;"> | |
| <h3 class="font-bold text-lg mb-4 text-indigo dark:text-saffron flex items-center"> | |
| <i class="fas fa-database mr-2"></i> | |
| Databases | |
| </h3> | |
| <div class="space-y-3"> | |
| <div class="flex items-center"> | |
| <div class="w-2 h-2 bg-royal-blue rounded-full mr-2"></div> | |
| <span>MySQL</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <div class="w-2 h-2 bg-royal-blue rounded-full mr-2"></div> | |
| <span>PostgreSQL</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <div class="w-2 h-2 bg-royal-blue rounded-full mr-2"></div> | |
| <span>MongoDB</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Column 3: Tools --> | |
| <div class="bg-white dark:bg-indigo/10 p-6 rounded-xl shadow-md border-t-4 border-ancient-gold animate-fade-in" style="animation-delay: 0.2s;"> | |
| <h3 class="font-bold text-lg mb-4 text-indigo dark:text-saffron flex items-center"> | |
| <i class="fas fa-tools mr-2"></i> | |
| Tools | |
| </h3> | |
| <div class="space-y-3"> | |
| <div class="flex items-center"> | |
| <div class="w-2 h-2 bg-ancient-gold rounded-full mr-2"></div> | |
| <span>AWS (S3, Kinesis, SNS)</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <div class="w-2 h-2 bg-ancient-gold rounded-full mr-2"></div> | |
| <span>Power BI</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <div class="w-2 h-2 bg-ancient-gold rounded-full mr-2"></div> | |
| <span>Tableau</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Column 4: ML/Stats --> | |
| <div class="bg-white dark:bg-indigo/10 p-6 rounded-xl shadow-md border-t-4 border-indigo animate-fade-in" style="animation-delay: 0.3s;"> | |
| <h3 class="font-bold text-lg mb-4 text-indigo dark:text-saffron flex items-center"> | |
| <i class="fas fa-brain mr-2"></i> | |
| ML & Stats | |
| </h3> | |
| <div class="space-y-3"> | |
| <div class="flex items-center"> | |
| <div class="w-2 h-2 bg-indigo rounded-full mr-2"></div> | |
| <span>TensorFlow</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <div class="w-2 h-2 bg-indigo rounded-full mr-2"></div> | |
| <span>PyTorch</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <div class="w-2 h-2 bg-indigo rounded-full mr-2"></div> | |
| <span>Statistical Analysis</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Skill Bars --> | |
| <div class="mt-12 max-w-4xl mx-auto animate-slide-up" style="animation-delay: 0.4s;"> | |
| <h3 class="font-bold text-xl mb-6 text-indigo dark:text-saffron text-center">Weapon Proficiency</h3> | |
| <div class="space-y-6"> | |
| <div> | |
| <div class="flex justify-between mb-2"> | |
| <span class="font-medium">Python (Pandas, NumPy)</span> | |
| <span class="text-royal-blue dark:text-ancient-gold font-bold">95%</span> | |
| </div> | |
| <div class="w-full bg-gray-200 dark:bg-indigo/30 rounded-full h-3"> | |
| <div class="bg-saffron h-3 rounded-full" style="width: 95%"></div> | |
| </div> | |
| </div> | |
| <div> | |
| <div class="flex justify-between mb-2"> | |
| <span class="font-medium">SQL (MySQL, PostgreSQL)</span> | |
| <span class="text-royal-blue dark:text-ancient-gold font-bold">90%</span> | |
| </div> | |
| <div class="w-full bg-gray-200 dark:bg-indigo/30 rounded-full h-3"> | |
| <div class="bg-royal-blue h-3 rounded-full" style="width: 90%"></div> | |
| </div> | |
| </div> | |
| <div> | |
| <div class="flex justify-between mb-2"> | |
| <span class="font-medium">Data Visualization (Power BI, Tableau)</span> | |
| <span class="text-royal-blue dark:text-ancient-gold font-bold">85%</span> | |
| </div> | |
| <div class="w-full bg-gray-200 dark:bg-indigo/30 rounded-full h-3"> | |
| <div class="bg-ancient-gold h-3 rounded-full" style="width: 85%"></div> | |
| </div> | |
| </div> | |
| <div> | |
| <div class="flex justify-between mb-2"> | |
| <span class="font-medium">AWS Cloud Services</span> | |
| <span class="text-royal-blue dark:text-ancient-gold font-bold">80%</span> | |
| </div> | |
| <div class="w-full bg-gray-200 dark:bg-indigo/30 rounded-full h-3"> | |
| <div class="bg-indigo h-3 rounded-full" style="width: 80%"></div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Education - Like Gurus' Ashram --> | |
| <section id="education" class="py-16 bg-gray-100 dark:bg-indigo/10"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-12"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-4 sanskrit-text text-indigo dark:text-saffron">Gurukul Learning</h2> | |
| <p class="text-gray-600 dark:text-ivory/70 max-w-2xl mx-auto"> | |
| The knowledge acquired from the great institutions | |
| </p> | |
| <div class="w-24 h-1 bg-ancient-gold mx-auto mb-6"></div> | |
| </div> | |
| <div class="max-w-4xl mx-auto"> | |
| <div class="bg-white dark:bg-indigo/20 p-8 rounded-xl shadow-md border-l-4 border-saffron animate-slide-up"> | |
| <div class="flex flex-col md:flex-row"> | |
| <div class="md:w-1/3 mb-6 md:mb-0 flex justify-center"> | |
| <div class="w-32 h-32 rounded-full bg-indigo/10 dark:bg-saffron/10 border-4 border-saffron/30 flex items-center justify-center"> | |
| <i class="fas fa-university text-indigo dark:text-saffron text-4xl"></i> | |
| </div> | |
| </div> | |
| <div class="md:w-2/3 md:pl-8"> | |
| <h3 class="text-2xl font-bold text-indigo dark:text-saffron mb-2">University of the Pacific</h3> | |
| <div class="text-lg text-royal-blue dark:text-ancient-gold font-medium mb-4">Master of Science in Data Science</div> | |
| <p class="text-gray-700 dark:text-ivory/90 mb-4"> | |
| Like the Pandavas trained in the arts of war, I mastered the skills of data analysis, machine learning, and statistical modeling under the guidance of esteemed professors. | |
| </p> | |
| <div class="text-gray-600 dark:text-ivory/70 font-medium"> | |
| Aug 2022 - May 2024 | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Projects - Like Epic Achievements --> | |
| <section id="projects" class="py-16 bg-ivory dark:bg-dark-cloth"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-12"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-4 sanskrit-text text-indigo dark:text-saffron">Legendary Projects</h2> | |
| <p class="text-gray-600 dark:text-ivory/70 max-w-2xl mx-auto"> | |
| My heroic initiatives that solved complex real-world challenges | |
| </p> | |
| <div class="w-24 h-1 bg-ancient-gold mx-auto mb-6"></div> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-8"> | |
| <!-- Project 1 --> | |
| <div class="bg-white dark:bg-indigo/10 rounded-xl overflow-hidden shadow-lg transition-transform duration-300 hover:scale-105"> | |
| <div class="h-48 bg-gradient-to-r from-indigo-500 to-purple-600 flex items-center justify-center relative"> | |
| <div class="absolute inset-0 bg-black/30"></div> | |
| <i class="fas fa-heartbeat text-white text-6xl relative z-10"></i> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="text-xl font-bold mb-3 text-indigo dark:text-saffron">Wearable Health Insights Platform</h3> | |
| <div class="flex flex-wrap gap-2 mb-4"> | |
| <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">Python</span> | |
| <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">SQL</span> | |
| <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">TensorFlow</span> | |
| <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">AWS S3</span> | |
| </div> | |
| <p class="text-gray-700 dark:text-ivory/90 mb-4"> | |
| Like Dhanvantari's healing knowledge, this platform aggregates multi-source health data, performing data mapping that improved consolidation efficiency by 25%. | |
| </p> | |
| <div class="flex items-center text-sm text-gray-500 dark:text-ivory/70"> | |
| <i class="fas fa-medal text-ancient-gold mr-2"></i> | |
| <span>Improved predictive model accuracy by 20%</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Project 2 --> | |
| <div class="bg-white dark:bg-indigo/10 rounded-xl overflow-hidden shadow-lg transition-transform duration-300 hover:scale-105"> | |
| <div class="h-48 bg-gradient-to-r from-green-600 to-emerald-500 flex items-center justify-center relative"> | |
| <div class="absolute inset-0 bg-black/30"></div> | |
| <i class="fas fa-tractor text-white text-6xl relative z-10"></i> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="text-xl font-bold mb-3 text-indigo dark:text-saffron">Optimization of Agriculture Production</h3> | |
| <div class="flex flex-wrap gap-2 mb-4"> | |
| <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">Python</span> | |
| <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">Pandas</span> | |
| <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">Scikit-learn</span> | |
| <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">TensorFlow</span> | |
| </div> | |
| <p class="text-gray-700 dark:text-ivory/90 mb-4"> | |
| Like the agricultural wisdom of ancient India, this project determines optimal cropping patterns based on soil types and climate conditions, achieving 93% prediction accuracy. | |
| </p> | |
| <div class="flex items-center text-sm text-gray-500 dark:text-ivory/70"> | |
| <i class="fas fa-medal text-ancient-gold mr-2"></i> | |
| <span>Reduced data preprocessing time by 30%</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Contact - Like Sending a Messenger --> | |
| <section id="contact" class="py-16 bg-gray-100 dark:bg-indigo/10"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-12"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-4 sanskrit-text text-indigo dark:text-saffron">Send Your Doota</h2> | |
| <p class="text-gray-600 dark:text-ivory/70 max-w-2xl mx-auto"> | |
| Like messengers in the Mahabharata, send me your inquiries | |
| </p> | |
| <div class="w-24 h-1 bg-ancient-gold mx-auto mb-6"></div> | |
| </div> | |
| <div class="flex flex-col md:flex-row gap-12 max-w-6xl mx-auto"> | |
| <div class="md:w-1/2 animate-slide-up"> | |
| <form class="space-y-6"> | |
| <div> | |
| <label for="name" class="block mb-2 font-medium text-indigo dark:text-saffron">Your Name</label> | |
| <input type="text" id="name" class="w-full px-4 py-3 rounded-lg border border-gray-300 dark:border-indigo/50 bg-white dark:bg-indigo/20 focus:outline-none focus:ring-2 focus:ring-saffron focus:border-transparent"> | |
| </div> | |
| <div> | |
| <label for="email" class="block mb-2 font-medium text-indigo dark:text-saffron">Email Address</label> | |
| <input type="email" id="email" class="w-full px-4 py-3 rounded-lg border border-gray-300 dark:border-indigo/50 bg-white dark:bg-indigo/20 focus:outline-none focus:ring-2 focus:ring-saffron focus:border-transparent"> | |
| </div> | |
| <div> | |
| <label for="subject" class="block mb-2 font-medium text-indigo dark:text-saffron">Subject</label> | |
| <input type="text" id="subject" class="w-full px-4 py-3 rounded-lg border border-gray-300 dark:border-indigo/50 bg-white dark:bg-indigo/20 focus:outline-none focus:ring-2 focus:ring-saffron focus:border-transparent"> | |
| </div> | |
| <div> | |
| <label for="message" class="block mb-2 font-medium text-indigo dark:text-saffron">Message</label> | |
| <textarea id="message" rows="5" class="w-full px-4 py-3 rounded-lg border border-gray-300 dark:border-indigo/50 bg-white dark:bg-indigo/20 focus:outline-none focus:ring-2 focus:ring-saffron focus:border-transparent"></textarea> | |
| </div> | |
| <button type="submit" class="bg-saffron text-indigo px-6 py-3 rounded-lg font-medium hover:bg-opacity-90 transition w-full shadow-md hover:shadow-lg transform hover:-translate-y-1"> | |
| <i class="fas fa-paper-plane mr-2"></i> Send Message | |
| </button> | |
| </form> | |
| </div> | |
| <div class="md:w-1/2 animate-slide-up" style="animation-delay: 0.1s;"> | |
| <div class="bg-white dark:bg-indigo/20 p-8 rounded-xl shadow-md h-full border-t-4 border-saffron"> | |
| <h3 class="text-xl font-bold mb-6 text-indigo dark:text-saffron">Contact Information</h3> | |
| <div class="space-y-6"> | |
| <div class="flex items-start"> | |
| <div class="bg-saffron/10 p-3 rounded-full mr-4 border border-saffron/30"> | |
| <i class="fas fa-map-marker-alt text-saffron"></i> | |
| </div> | |
| <div> | |
| <h4 class="font-semibold mb-1 text-indigo dark:text-saffron">Location</h4> | |
| <p class="text-gray-700 dark:text-ivory/90">San Francisco, CA</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="bg-saffron/10 p-3 rounded-full mr-4 border border-saffron/30"> | |
| <i class="fas fa-envelope text-saffron"></i> | |
| </div> | |
| <div> | |
| <h4 class="font-semibold mb-1 text-indigo dark:text-saffron">Email</h4> | |
| <p class="text-gray-700 dark:text-ivory/90">manideepreddy.work@gmail.com</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="bg-saffron/10 p-3 rounded-full mr-4 border border-saffron/30"> | |
| <i class="fas fa-phone-alt text-saffron"></i> | |
| </div> | |
| <div> | |
| <h4 class="font-semibold mb-1 text-indigo dark:text-saffron">Phone</h4> | |
| <p class="text-gray-700 dark:text-ivory/90">(415)-902-1124</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="bg-saffron/10 p-3 rounded-full mr-4 border border-saffron/30"> | |
| <i class="fas fa-link text-saffron"></i> | |
| </div> | |
| <div> | |
| <h4 class="font-semibold mb-1 text-indigo dark:text-saffron">Links</h4> | |
| <div class="flex space-x-4"> | |
| <a href="https://linkedin.com/in/manideep-reddy" target="_blank" class="text-gray-700 dark:text-ivory/90 hover:text-saffron transition"> | |
| <i class="fab fa-linkedin-in text-xl"></i> | |
| </a> | |
| <a href="https://github.com/manideepreddym" target="_blank" class="text-gray-700 dark:text-ivory/90 hover:text-saffron transition"> | |
| <i class="fab fa-github text-xl"></i> | |
| </a> | |
| <a href="#" class="text-gray-700 dark:text-ivory/90 hover:text-saffron transition"> | |
| <i class="fas fa-globe text-xl"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Footer - Like the End of an Era --> | |
| <footer class="bg-indigo text-ivory py-12"> | |
| <div class="container mx-auto px-6"> | |
| <div class="flex flex-col md:flex-row justify-between items-center"> | |
| <div class="mb-6 md:mb-0 text-center md:text-left"> | |
| <a href="#home" class="text-2xl font-bold flex items-center justify-center md:justify-start sanskrit-text"> | |
| <span class="mr-2">मणिदीप</span> | |
| <i class="fas fa-database text-sm text-saffron"></i> | |
| </a> | |
| <p class="mt-2 text-ivory/70">© 2024 Manideep Reddy. All rights reserved.</p> | |
| </div> | |
| <div class="flex flex-col md:flex-row md:space-x-8 space-y-4 md:space-y-0"> | |
| <a href="#home" class="hover:text-saffron transition">Home</a> | |
| <a href="#experience" class="hover:text-saffron transition">Experience</a> | |
| <a href="#skills" class="hover:text-saffron transition">Skills</a> | |
| <a href="#education" class="hover:text-saffron transition">Education</a> | |
| <a href="#contact" class="hover:text-saffron transition">Contact</a> | |
| </div> | |
| </div> | |
| <div class="border-t border-ivory/20 mt-8 pt-8 text-center"> | |
| <p class="sanskrit-text text-xl text-saffron mb-2">यत्र योगेश्वरः कृष्णो यत्र पार्थो धनुर्धरः।</p> | |
| <p class="text-ivory/70">"Where there is Dharma, there is victory"</p> | |
| </div> | |
| </div> | |
| </footer> | |
| <!-- Back to Top Button - Like Arjuna's Arrow --> | |
| <button id="back-to-top" class="fixed bottom-8 right-8 w-12 h-12 bg-saffron text-indigo rounded-full shadow-lg hidden items-center justify-center transition-all hover:scale-110 hover:shadow-xl"> | |
| <i class="fas fa-arrow-up"></i> | |
| </button> | |
| <script> | |
| // Mobile menu toggle | |
| const mobileMenuButton = document.getElementById('mobile-menu-button'); | |
| const mobileMenu = document.getElementById('mobile-menu'); | |
| mobileMenuButton.addEventListener('click', () => { | |
| mobileMenu.classList.toggle('hidden'); | |
| }); | |
| // Theme toggle | |
| const themeToggle = document.getElementById('theme-toggle'); | |
| const html = document.documentElement; | |
| // Check for saved user preference, if any, on load of the website | |
| if (localStorage.getItem('theme') === 'dark' || (!localStorage.getItem('theme') && window.matchMedia('(prefers-color-scheme: dark)').matches)) { | |
| html.classList.add('dark'); | |
| } else { | |
| html.classList.remove('dark'); | |
| } | |
| themeToggle.addEventListener('click', () => { | |
| html.classList.toggle('dark'); | |
| localStorage.setItem('theme', html.classList.contains('dark') ? 'dark' : 'light'); | |
| }); | |
| // Back to top button | |
| const backToTopButton = document.getElementById('back-to-top'); | |
| window.addEventListener('scroll', () => { | |
| if (window.pageYOffset > 300) { | |
| backToTopButton.classList.remove('hidden'); | |
| backToTopButton.classList.add('flex'); | |
| } else { | |
| backToTopButton.classList.add('hidden'); | |
| backToTopButton.classList.remove('flex'); | |
| } | |
| }); | |
| backToTopButton.addEventListener('click', () => { | |
| window.scrollTo({ top: 0, behavior: 'smooth' }); | |
| }); | |
| // Highlight active nav link | |
| const sections = document.querySelectorAll('section'); | |
| const navLinks = document.querySelectorAll('.nav-link, #mobile-menu a'); | |
| window.addEventListener('scroll', () => { | |
| let current = ''; | |
| sections.forEach(section => { | |
| const sectionTop = section.offsetTop; | |
| const sectionHeight = section.clientHeight; | |
| if (pageYOffset >= sectionTop - 300) { | |
| current = section.getAttribute('id'); | |
| } | |
| }); | |
| navLinks.forEach(link => { | |
| link.classList.remove('active'); | |
| if (link.getAttribute('href') === `#${current}`) { | |
| link.classList.add('active'); | |
| } | |
| }); | |
| }); | |
| // Smooth scrolling for anchor links | |
| document.querySelectorAll('a[href^="#"]').forEach(anchor => { | |
| anchor.addEventListener('click', function(e) { | |
| e.preventDefault(); | |
| const targetId = this.getAttribute('href'); | |
| const targetElement = document.querySelector(targetId); | |
| if (targetElement) { | |
| window.scrollTo({ | |
| top: targetElement.offsetTop - 80, | |
| behavior: 'smooth' | |
| }); | |
| // Close mobile menu if open | |
| if (!mobileMenu.classList.contains('hidden')) { | |
| mobileMenu.classList.add('hidden'); | |
| } | |
| } | |
| }); | |
| }); | |
| </script> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - <a href="https://enzostvs-deepsite.hf.space?remix=manideepreddym/maniportfolio" style="color: #fff;text-decoration: underline;" target="_blank" >🧬 Remix</a></p></body> | |
| </html> |