Spaces:
Running
Running
Download index.html from Sangeethvr/techcommunity: direct link, hf CLI and curl.
- Browser
- Download file 62.6 kB
-
https://huggingface.co/spaces/Sangeethvr/techcommunity/resolve/main/index.html
- Command line
-
hf download hf://spaces/Sangeethvr/techcommunity/index.html
-
curl -L -o index.html https://huggingface.co/spaces/Sangeethvr/techcommunity/resolve/main/index.html
62.6 kB
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>TN TechConnect - Platform for Tamil Nadu Engineering Professionals</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"> | |
| <style> | |
| .gradient-bg { | |
| background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 50%, #1d4ed8 100%); | |
| } | |
| .card-hover:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); | |
| } | |
| .podcast-wave { | |
| background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 320'%3E%3Cpath fill='%23f8fafc' fill-opacity='1' d='M0,256L48,261.3C96,267,192,277,288,261.3C384,245,480,203,576,197.3C672,192,768,224,864,234.7C960,245,1056,235,1152,213.3C1248,192,1344,160,1392,144L1440,128L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z'%3E%3C/path%3E%3C/svg%3E"); | |
| background-repeat: no-repeat; | |
| background-position: bottom; | |
| background-size: cover; | |
| } | |
| .testimonial-card { | |
| background: rgba(255, 255, 255, 0.1); | |
| backdrop-filter: blur(10px); | |
| border: 1px solid rgba(255, 255, 255, 0.2); | |
| } | |
| .animated-underline { | |
| position: relative; | |
| display: inline-block; | |
| } | |
| .animated-underline::after { | |
| content: ''; | |
| position: absolute; | |
| width: 100%; | |
| transform: scaleX(0); | |
| height: 2px; | |
| bottom: 0; | |
| left: 0; | |
| background-color: white; | |
| transform-origin: bottom right; | |
| transition: transform 0.25s ease-out; | |
| } | |
| .animated-underline:hover::after { | |
| transform: scaleX(1); | |
| transform-origin: bottom left; | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-gray-50 font-sans"> | |
| <!-- Navigation --> | |
| <nav class="gradient-bg text-white shadow-lg sticky top-0 z-50"> | |
| <div class="container mx-auto px-6 py-4"> | |
| <div class="flex justify-between items-center"> | |
| <div class="flex items-center space-x-4"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-microchip text-3xl mr-2"></i> | |
| <span class="text-xl font-bold">TN TechConnect</span> | |
| </div> | |
| </div> | |
| <div class="hidden md:flex items-center space-x-8"> | |
| <a href="#home" class="animated-underline">Home</a> | |
| <a href="#internships" class="animated-underline">Internships</a> | |
| <a href="#conferences" class="animated-underline">Tech Events</a> | |
| <a href="#research" class="animated-underline">Research</a> | |
| <a href="#community" class="animated-underline">Community</a> | |
| <a href="#podcasts" class="animated-underline">Podcasts</a> | |
| </div> | |
| <div class="md:hidden"> | |
| <button class="mobile-menu-button p-2 focus:outline-none"> | |
| <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> | |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> | |
| </svg> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Mobile menu --> | |
| <div class="mobile-menu hidden md:hidden gradient-bg pb-4"> | |
| <a href="#home" class="block py-2 px-4 hover:bg-blue-700">Home</a> | |
| <a href="#internships" class="block py-2 px-4 hover:bg-blue-700">Internships</a> | |
| <a href="#conferences" class="block py-2 px-4 hover:bg-blue-700">Tech Events</a> | |
| <a href="#research" class="block py-2 px-4 hover:bg-blue-700">Research</a> | |
| <a href="#community" class="block py-2 px-4 hover:bg-blue-700">Community</a> | |
| <a href="#podcasts" class="block py-2 px-4 hover:bg-blue-700">Podcasts</a> | |
| </div> | |
| </nav> | |
| <!-- Hero Section --> | |
| <section id="home" class="gradient-bg text-white py-20"> | |
| <div class="container mx-auto px-6 flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/2 mb-10 md:mb-0"> | |
| <h1 class="text-4xl md:text-5xl font-bold leading-tight mb-4">Connecting Tamil Nadu's Engineers to Global Tech Opportunities</h1> | |
| <p class="text-xl mb-8">Your premier platform for tech internships, international opportunities, conferences, and collaborative projects.</p> | |
| <div class="flex flex-wrap gap-4"> | |
| <a href="#internships" class="bg-white text-blue-800 hover:bg-gray-100 px-6 py-3 rounded-lg font-semibold transition duration-300">Explore Internships</a> | |
| <a href="#community" class="border border-white text-white hover:bg-white hover:text-blue-800 px-6 py-3 rounded-lg font-semibold transition duration-300">Join Community</a> | |
| </div> | |
| </div> | |
| <div class="md:w-1/2 flex justify-center"> | |
| <img src="https://images.unsplash.com/photo-1622675363311-3e1904dc1885?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Engineering Professionals" class="rounded-lg shadow-2xl max-w-md w-full"> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Stats Section --> | |
| <section class="bg-white py-12"> | |
| <div class="container mx-auto px-6"> | |
| <div class="grid grid-cols-2 md:grid-cols-4 gap-8 text-center"> | |
| <div class="p-4"> | |
| <div class="text-4xl font-bold text-blue-800 mb-2">300+</div> | |
| <div class="text-gray-600">Tech Internships</div> | |
| </div> | |
| <div class="p-4"> | |
| <div class="text-4xl font-bold text-blue-800 mb-2">80+</div> | |
| <div class="text-gray-600">Upcoming Tech Events</div> | |
| </div> | |
| <div class="p-4"> | |
| <div class="text-4xl font-bold text-blue-800 mb-2">1000+</div> | |
| <div class="text-gray-600">Active Members</div> | |
| </div> | |
| <div class="p-4"> | |
| <div class="text-4xl font-bold text-blue-800 mb-2">120+</div> | |
| <div class="text-gray-600">Research Papers</div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Internships Section --> | |
| <section id="internships" class="py-20 bg-gray-50"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Global Internship Opportunities</h2> | |
| <p class="text-xl text-gray-600 max-w-3xl mx-auto">Discover prestigious internship programs at top tech companies with experiences from TN engineers.</p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <!-- Internship Card 1 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-300 card-hover"> | |
| <div class="h-48 bg-blue-100 flex items-center justify-center"> | |
| <i class="fas fa-robot text-6xl text-blue-600"></i> | |
| </div> | |
| <div class="p-6"> | |
| <div class="uppercase tracking-wide text-sm font-semibold text-blue-600">USA • 6 Months</div> | |
| <h3 class="mt-2 text-xl font-semibold text-gray-800">AI Research Intern</h3> | |
| <p class="mt-2 text-gray-600">Work on cutting-edge AI projects at Google's Mountain View campus with mentorship from top researchers.</p> | |
| <div class="mt-4 flex items-center"> | |
| <div class="flex-shrink-0"> | |
| <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/women/42.jpg" alt="Priya"> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm font-medium text-gray-900">Priya, Chennai</p> | |
| <p class="text-sm text-gray-500">Completed 2022</p> | |
| </div> | |
| </div> | |
| <button class="mt-4 w-full bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded-lg transition duration-300"> | |
| View Details & Experiences | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Internship Card 2 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-300 card-hover"> | |
| <div class="h-48 bg-green-100 flex items-center justify-center"> | |
| <i class="fas fa-code text-6xl text-green-600"></i> | |
| </div> | |
| <div class="p-6"> | |
| <div class="uppercase tracking-wide text-sm font-semibold text-green-600">Germany • 1 Year</div> | |
| <h3 class="mt-2 text-xl font-semibold text-gray-800">Software Engineering Intern</h3> | |
| <p class="mt-2 text-gray-600">Develop scalable systems at SAP's Berlin office with exposure to enterprise software development.</p> | |
| <div class="mt-4 flex items-center"> | |
| <div class="flex-shrink-0"> | |
| <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/men/32.jpg" alt="Arjun"> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm font-medium text-gray-900">Arjun, Coimbatore</p> | |
| <p class="text-sm text-gray-500">Completed 2021</p> | |
| </div> | |
| </div> | |
| <button class="mt-4 w-full bg-green-600 hover:bg-green-700 text-white py-2 px-4 rounded-lg transition duration-300"> | |
| View Details & Experiences | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Internship Card 3 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-300 card-hover"> | |
| <div class="h-48 bg-purple-100 flex items-center justify-center"> | |
| <i class="fas fa-bolt text-6xl text-purple-600"></i> | |
| </div> | |
| <div class="p-6"> | |
| <div class="uppercase tracking-wide text-sm font-semibold text-purple-600">Singapore • 8 Months</div> | |
| <h3 class="mt-2 text-xl font-semibold text-gray-800">Hardware Engineering Intern</h3> | |
| <p class="mt-2 text-gray-600">Work on next-gen semiconductor designs at TSMC's Singapore facility with industry experts.</p> | |
| <div class="mt-4 flex items-center"> | |
| <div class="flex-shrink-0"> | |
| <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/women/68.jpg" alt="Meena"> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm font-medium text-gray-900">Meena, Madurai</p> | |
| <p class="text-sm text-gray-500">Completed 2023</p> | |
| </div> | |
| </div> | |
| <button class="mt-4 w-full bg-purple-600 hover:bg-purple-700 text-white py-2 px-4 rounded-lg transition duration-300"> | |
| View Details & Experiences | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="text-center mt-12"> | |
| <a href="#" class="inline-block bg-blue-800 hover:bg-blue-900 text-white px-6 py-3 rounded-lg font-semibold transition duration-300"> | |
| View All Internship Programs <i class="fas fa-arrow-right ml-2"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Tech Events Section --> | |
| <section id="conferences" class="py-20 bg-white"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Upcoming Tech Events & Hackathons</h2> | |
| <p class="text-xl text-gray-600 max-w-3xl mx-auto">Stay updated with the latest tech conferences, workshops, and competitions in your field.</p> | |
| </div> | |
| <div class="flex flex-wrap justify-center mb-8"> | |
| <button class="px-4 py-2 m-1 bg-blue-600 text-white rounded-full">All</button> | |
| <button class="px-4 py-2 m-1 bg-gray-200 hover:bg-gray-300 rounded-full">AI/ML</button> | |
| <button class="px-4 py-2 m-1 bg-gray-200 hover:bg-gray-300 rounded-full">Web Dev</button> | |
| <button class="px-4 py-2 m-1 bg-gray-200 hover:bg-gray-300 rounded-full">IoT</button> | |
| <button class="px-4 py-2 m-1 bg-gray-200 hover:bg-gray-300 rounded-full">Cybersecurity</button> | |
| <button class="px-4 py-2 m-1 bg-gray-200 hover:bg-gray-300 rounded-full">Blockchain</button> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <!-- Event 1 --> | |
| <div class="bg-gray-50 rounded-xl shadow-md overflow-hidden transition duration-300 card-hover"> | |
| <div class="p-6"> | |
| <div class="flex justify-between items-start"> | |
| <div> | |
| <span class="inline-block px-3 py-1 text-sm font-semibold text-blue-800 bg-blue-100 rounded-full">AI/ML</span> | |
| <h3 class="mt-3 text-xl font-semibold text-gray-800">AI Summit Chennai 2023</h3> | |
| <p class="mt-2 text-gray-600">November 15-18, 2023 • Chennai, India</p> | |
| </div> | |
| <div class="text-right"> | |
| <div class="text-2xl font-bold text-blue-800">₹2,999</div> | |
| <div class="text-sm text-gray-500">Early Bird</div> | |
| </div> | |
| </div> | |
| <p class="mt-4 text-gray-700">Premier event for AI professionals featuring cutting-edge research and innovative applications from industry leaders.</p> | |
| <div class="mt-6 flex justify-between items-center"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-users text-gray-500 mr-2"></i> | |
| <span class="text-sm text-gray-600">800+ attendees</span> | |
| </div> | |
| <button class="text-blue-600 hover:text-blue-800 font-medium"> | |
| Register Now <i class="fas fa-arrow-right ml-1"></i> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Event 2 --> | |
| <div class="bg-gray-50 rounded-xl shadow-md overflow-hidden transition duration-300 card-hover"> | |
| <div class="p-6"> | |
| <div class="flex justify-between items-start"> | |
| <div> | |
| <span class="inline-block px-3 py-1 text-sm font-semibold text-green-800 bg-green-100 rounded-full">Web Dev</span> | |
| <h3 class="mt-3 text-xl font-semibold text-gray-800">React Conf India</h3> | |
| <p class="mt-2 text-gray-600">February 7-9, 2024 • Bangalore, India</p> | |
| </div> | |
| <div class="text-right"> | |
| <div class="text-2xl font-bold text-green-800">₹3,500</div> | |
| <div class="text-sm text-gray-500">Standard</div> | |
| </div> | |
| </div> | |
| <p class="mt-4 text-gray-700">Learn from React core team members and industry experts about the future of frontend development.</p> | |
| <div class="mt-6 flex justify-between items-center"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-users text-gray-500 mr-2"></i> | |
| <span class="text-sm text-gray-600">500+ attendees</span> | |
| </div> | |
| <button class="text-green-600 hover:text-green-800 font-medium"> | |
| Register Now <i class="fas fa-arrow-right ml-1"></i> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Event 3 --> | |
| <div class="bg-gray-50 rounded-xl shadow-md overflow-hidden transition duration-300 card-hover"> | |
| <div class="p-6"> | |
| <div class="flex justify-between items-start"> | |
| <div> | |
| <span class="inline-block px-3 py-1 text-sm font-semibold text-purple-800 bg-purple-100 rounded-full">Blockchain</span> | |
| <h3 class="mt-3 text-xl font-semibold text-gray-800">ETHGlobal Chennai</h3> | |
| <p class="mt-2 text-gray-600">December 1-3, 2023 • Chennai, India</p> | |
| </div> | |
| <div class="text-right"> | |
| <div class="text-2xl font-bold text-purple-800">Free</div> | |
| <div class="text-sm text-gray-500">Hackathon</div> | |
| </div> | |
| </div> | |
| <p class="mt-4 text-gray-700">48-hour blockchain hackathon with $50k in prizes and mentorship from Ethereum core developers.</p> | |
| <div class="mt-6 flex justify-between items-center"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-users text-gray-500 mr-2"></i> | |
| <span class="text-sm text-gray-600">300+ participants</span> | |
| </div> | |
| <button class="text-purple-600 hover:text-purple-800 font-medium"> | |
| Apply Now <i class="fas fa-arrow-right ml-1"></i> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="text-center mt-12"> | |
| <a href="#" class="inline-block bg-blue-800 hover:bg-blue-900 text-white px-6 py-3 rounded-lg font-semibold transition duration-300"> | |
| View All Tech Events <i class="fas fa-arrow-right ml-2"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Research Section --> | |
| <section id="research" class="py-20 bg-gray-50"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Engineering Research & Publications</h2> | |
| <p class="text-xl text-gray-600 max-w-3xl mx-auto">Showcasing groundbreaking research by Tamil Nadu engineering professionals.</p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-8 mb-12"> | |
| <!-- Featured Research --> | |
| <div class="bg-white p-8 rounded-xl shadow-lg"> | |
| <div class="flex items-center mb-4"> | |
| <span class="inline-block px-3 py-1 text-sm font-semibold text-blue-800 bg-blue-100 rounded-full">Featured</span> | |
| <span class="ml-3 text-sm text-gray-500">Published: June 2023</span> | |
| </div> | |
| <h3 class="text-2xl font-bold text-gray-800 mb-3">Novel AI Architecture for Tamil Language Processing</h3> | |
| <p class="text-gray-700 mb-4">This research from Anna University presents a breakthrough neural network design specifically optimized for Tamil NLP tasks with 98% accuracy.</p> | |
| <div class="flex items-center"> | |
| <div class="flex-shrink-0"> | |
| <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/men/75.jpg" alt="Dr. Karthik"> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm font-medium text-gray-900">Dr. Karthik, et al.</p> | |
| <p class="text-sm text-gray-500">Nature Machine Intelligence (Impact Factor: 15.5)</p> | |
| </div> | |
| </div> | |
| <div class="mt-6 flex justify-between items-center"> | |
| <div class="flex space-x-4"> | |
| <span class="text-sm text-gray-600"><i class="fas fa-download mr-1"></i> 524 Downloads</span> | |
| <span class="text-sm text-gray-600"><i class="fas fa-quote-right mr-1"></i> 38 Citations</span> | |
| </div> | |
| <a href="#" class="text-blue-600 hover:text-blue-800 font-medium"> | |
| Read Full Paper <i class="fas fa-arrow-right ml-1"></i> | |
| </a> | |
| </div> | |
| </div> | |
| <!-- Research Opportunities --> | |
| <div class="bg-blue-800 text-white p-8 rounded-xl shadow-lg"> | |
| <h3 class="text-2xl font-bold mb-4">Research Collaboration Opportunities</h3> | |
| <p class="mb-6">Connect with international researchers and tech companies for collaborative projects. Find funding opportunities and research positions.</p> | |
| <div class="space-y-4"> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 mt-1"> | |
| <i class="fas fa-microchip text-blue-300"></i> | |
| </div> | |
| <div class="ml-3"> | |
| <h4 class="font-semibold">Google Research India</h4> | |
| <p class="text-blue-200 text-sm">Looking for collaborators in AI for social good projects</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 mt-1"> | |
| <i class="fas fa-atom text-blue-300"></i> | |
| </div> | |
| <div class="ml-3"> | |
| <h4 class="font-semibold">MIT-Tamil Nadu Initiative</h4> | |
| <p class="text-blue-200 text-sm">Grants available for sustainable technology research</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 mt-1"> | |
| <i class="fas fa-brain text-blue-300"></i> | |
| </div> | |
| <div class="ml-3"> | |
| <h4 class="font-semibold">DeepMind Research</h4> | |
| <p class="text-blue-200 text-sm">PhD positions in reinforcement learning at Cambridge</p> | |
| </div> | |
| </div> | |
| </div> | |
| <button class="mt-6 w-full bg-white hover:bg-gray-100 text-blue-800 py-2 px-4 rounded-lg font-medium transition duration-300"> | |
| Explore Research Opportunities | |
| </button> | |
| </div> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-6"> | |
| <!-- Research Card 1 --> | |
| <div class="bg-white rounded-lg shadow-md overflow-hidden transition duration-300 card-hover"> | |
| <div class="p-6"> | |
| <span class="inline-block px-2 py-1 text-xs font-semibold text-green-800 bg-green-100 rounded-full">Renewable Energy</span> | |
| <h3 class="mt-2 text-lg font-semibold text-gray-800">Solar Panel Efficiency Breakthrough</h3> | |
| <p class="mt-2 text-sm text-gray-600">New perovskite solar cell design achieves 32% efficiency in testing at IIT Madras labs.</p> | |
| <div class="mt-4 flex justify-between items-center"> | |
| <span class="text-xs text-gray-500">Dr. Anitha et al. • Science Advances</span> | |
| <a href="#" class="text-green-600 hover:text-green-800 text-sm font-medium"> | |
| View <i class="fas fa-arrow-right ml-1"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Research Card 2 --> | |
| <div class="bg-white rounded-lg shadow-md overflow-hidden transition duration-300 card-hover"> | |
| <div class="p-6"> | |
| <span class="inline-block px-2 py-1 text-xs font-semibold text-purple-800 bg-purple-100 rounded-full">AI/ML</span> | |
| <h3 class="mt-2 text-lg font-semibold text-gray-800">Federated Learning for Healthcare</h3> | |
| <p class="mt-2 text-sm text-gray-600">Privacy-preserving AI model trained across multiple Tamil Nadu hospitals without data sharing.</p> | |
| <div class="mt-4 flex justify-between items-center"> | |
| <span class="text-xs text-gray-500">Dr. Rajesh et al. • Nature Digital Medicine</span> | |
| <a href="#" class="text-purple-600 hover:text-purple-800 text-sm font-medium"> | |
| View <i class="fas fa-arrow-right ml-1"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Research Card 3 --> | |
| <div class="bg-white rounded-lg shadow-md overflow-hidden transition duration-300 card-hover"> | |
| <div class="p-6"> | |
| <span class="inline-block px-2 py-1 text-xs font-semibold text-red-800 bg-red-100 rounded-full">Materials Science</span> | |
| <h3 class="mt-2 text-lg font-semibold text-gray-800">Graphene Production Innovation</h3> | |
| <p class="mt-2 text-sm text-gray-600">Low-cost method for mass production of graphene developed at PSG Tech with commercial applications.</p> | |
| <div class="mt-4 flex justify-between items-center"> | |
| <span class="text-xs text-gray-500">Dr. Malar et al. • Advanced Materials</span> | |
| <a href="#" class="text-red-600 hover:text-red-800 text-sm font-medium"> | |
| View <i class="fas fa-arrow-right ml-1"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="text-center mt-12"> | |
| <a href="#" class="inline-block bg-blue-800 hover:bg-blue-900 text-white px-6 py-3 rounded-lg font-semibold transition duration-300"> | |
| Browse All Publications <i class="fas fa-arrow-right ml-2"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Community Section --> | |
| <section id="community" class="py-20 bg-white"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Tech Community Network</h2> | |
| <p class="text-xl text-gray-600 max-w-3xl mx-auto">Connect with fellow TN engineering professionals, share experiences, and get mentorship.</p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-12"> | |
| <!-- Discussion Forum --> | |
| <div> | |
| <h3 class="text-2xl font-semibold text-gray-800 mb-6">Discussion Forums</h3> | |
| <div class="space-y-6"> | |
| <!-- Forum Topic 1 --> | |
| <div class="bg-gray-50 p-6 rounded-lg shadow-sm"> | |
| <div class="flex justify-between items-start"> | |
| <div> | |
| <span class="inline-block px-2 py-1 text-xs font-semibold text-blue-800 bg-blue-100 rounded-full">Internship</span> | |
| <h4 class="mt-2 font-medium text-gray-800">Google Summer Internship - Application Tips</h4> | |
| </div> | |
| <span class="text-xs text-gray-500">2h ago</span> | |
| </div> | |
| <p class="mt-3 text-sm text-gray-600">Sharing my experience applying to Google STEP internship including resume tips and technical interview preparation.</p> | |
| <div class="mt-4 flex justify-between items-center"> | |
| <div class="flex items-center space-x-4"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-comment-alt text-gray-400 mr-1"></i> | |
| <span class="text-xs text-gray-600">24 comments</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <i class="fas fa-eye text-gray-400 mr-1"></i> | |
| <span class="text-xs text-gray-600">356 views</span> | |
| </div> | |
| </div> | |
| <div class="flex-shrink-0"> | |
| <img class="h-8 w-8 rounded-full" src="https://randomuser.me/api/portraits/men/22.jpg" alt="Suresh"> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Forum Topic 2 --> | |
| <div class="bg-gray-50 p-6 rounded-lg shadow-sm"> | |
| <div class="flex justify-between items-start"> | |
| <div> | |
| <span class="inline-block px-2 py-1 text-xs font-semibold text-green-800 bg-green-100 rounded-full">Career</span> | |
| <h4 class="mt-2 font-medium text-gray-800">Transitioning from Service to Product Companies</h4> | |
| </div> | |
| <span class="text-xs text-gray-500">1d ago</span> | |
| </div> | |
| <p class="mt-3 text-sm text-gray-600">How I moved from TCS to a product startup in 6 months - skills to learn and interview strategies that worked.</p> | |
| <div class="mt-4 flex justify-between items-center"> | |
| <div class="flex items-center space-x-4"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-comment-alt text-gray-400 mr-1"></i> | |
| <span class="text-xs text-gray-600">18 comments</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <i class="fas fa-eye text-gray-400 mr-1"></i> | |
| <span class="text-xs text-gray-600">289 views</span> | |
| </div> | |
| </div> | |
| <div class="flex-shrink-0"> | |
| <img class="h-8 w-8 rounded-full" src="https://randomuser.me/api/portraits/women/33.jpg" alt="Lakshmi"> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Forum Topic 3 --> | |
| <div class="bg-gray-50 p-6 rounded-lg shadow-sm"> | |
| <div class="flex justify-between items-start"> | |
| <div> | |
| <span class="inline-block px-2 py-1 text-xs font-semibold text-purple-800 bg-purple-100 rounded-full">Research</span> | |
| <h4 class="mt-2 font-medium text-gray-800">Seeking Collaborators for AI in Agriculture Project</h4> | |
| </div> | |
| <span class="text-xs text-gray-500">3d ago</span> | |
| </div> | |
| <p class="mt-3 text-sm text-gray-600">Looking for ML engineers and agri-tech specialists across TN to participate in DST-funded research on crop yield prediction.</p> | |
| <div class="mt-4 flex justify-between items-center"> | |
| <div class="flex items-center space-x-4"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-comment-alt text-gray-400 mr-1"></i> | |
| <span class="text-xs text-gray-600">15 comments</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <i class="fas fa-eye text-gray-400 mr-1"></i> | |
| <span class="text-xs text-gray-600">247 views</span> | |
| </div> | |
| </div> | |
| <div class="flex-shrink-0"> | |
| <img class="h-8 w-8 rounded-full" src="https://randomuser.me/api/portraits/men/45.jpg" alt="Karthik"> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <button class="mt-6 w-full bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded-lg font-medium transition duration-300"> | |
| Join Discussion Forum | |
| </button> | |
| </div> | |
| <!-- Mentorship Program --> | |
| <div> | |
| <h3 class="text-2xl font-semibold text-gray-800 mb-6">Mentorship Program</h3> | |
| <div class="bg-blue-50 p-6 rounded-lg mb-8"> | |
| <h4 class="text-lg font-semibold text-blue-800 mb-3">Connect with Experienced Professionals</h4> | |
| <p class="text-gray-700 mb-4">Our mentorship program pairs early-career engineers with senior professionals at top tech companies.</p> | |
| <div class="space-y-4"> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 mt-1"> | |
| <i class="fas fa-laptop-code text-blue-600"></i> | |
| </div> | |
| <div class="ml-3"> | |
| <h4 class="font-medium text-gray-800">One-on-One Guidance</h4> | |
| <p class="text-sm text-gray-600">Personalized advice on career growth, technical skills, and interview preparation.</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 mt-1"> | |
| <i class="fas fa-globe-americas text-blue-600"></i> | |
| </div> | |
| <div class="ml-3"> | |
| <h4 class="font-medium text-gray-800">Global Network</h4> | |
| <p class="text-sm text-gray-600">Access to mentors working at FAANG companies and top startups worldwide.</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 mt-1"> | |
| <i class="fas fa-handshake text-blue-600"></i> | |
| </div> | |
| <div class="ml-3"> | |
| <h4 class="font-medium text-gray-800">Specialty Matching</h4> | |
| <p class="text-sm text-gray-600">Get matched with mentors in your specific tech domain (AI, Web, Cloud, etc.).</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <h4 class="text-lg font-semibold text-gray-800 mb-4">Featured Mentors</h4> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-4"> | |
| <!-- Mentor 1 --> | |
| <div class="bg-white p-4 rounded-lg shadow-sm flex items-center"> | |
| <div class="flex-shrink-0"> | |
| <img class="h-12 w-12 rounded-full" src="https://randomuser.me/api/portraits/women/65.jpg" alt="Deepa"> | |
| </div> | |
| <div class="ml-4"> | |
| <h5 class="font-medium text-gray-800">Deepa</h5> | |
| <p class="text-sm text-gray-600">Senior Engineer • Google (ex-Microsoft)</p> | |
| <div class="mt-1 flex space-x-2"> | |
| <span class="inline-block px-2 py-0.5 text-xs font-medium text-blue-800 bg-blue-100 rounded-full">Mentoring: 3</span> | |
| <span class="inline-block px-2 py-0.5 text-xs font-medium text-green-800 bg-green-100 rounded-full">Available</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Mentor 2 --> | |
| <div class="bg-white p-4 rounded-lg shadow-sm flex items-center"> | |
| <div class="flex-shrink-0"> | |
| <img class="h-12 w-12 rounded-full" src="https://randomuser.me/api/portraits/men/75.jpg" alt="Vijay"> | |
| </div> | |
| <div class="ml-4"> | |
| <h5 class="font-medium text-gray-800">Vijay</h5> | |
| <p class="text-sm text-gray-600">CTO • AI Startup (ex-Apple)</p> | |
| <div class="mt-1 flex space-x-2"> | |
| <span class="inline-block px-2 py-0.5 text-xs font-medium text-blue-800 bg-blue-100 rounded-full">Mentoring: 5</span> | |
| <span class="inline-block px-2 py-0.5 text-xs font-medium text-green-800 bg-green-100 rounded-full">Available</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Mentor 3 --> | |
| <div class="bg-white p-4 rounded-lg shadow-sm flex items-center"> | |
| <div class="flex-shrink-0"> | |
| <img class="h-12 w-12 rounded-full" src="https://randomuser.me/api/portraits/women/42.jpg" alt="Priya"> | |
| </div> | |
| <div class="ml-4"> | |
| <h5 class="font-medium text-gray-800">Priya</h5> | |
| <p class="text-sm text-gray-600">Engineering Manager • Amazon</p> | |
| <div class="mt-1 flex space-x-2"> | |
| <span class="inline-block px-2 py-0.5 text-xs font-medium text-blue-800 bg-blue-100 rounded-full">Mentoring: 2</span> | |
| <span class="inline-block px-2 py-0.5 text-xs font-medium text-yellow-800 bg-yellow-100 rounded-full">Limited</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Mentor 4 --> | |
| <div class="bg-white p-4 rounded-lg shadow-sm flex items-center"> | |
| <div class="flex-shrink-0"> | |
| <img class="h-12 w-12 rounded-full" src="https://randomuser.me/api/portraits/men/32.jpg" alt="Arvind"> | |
| </div> | |
| <div class="ml-4"> | |
| <h5 class="font-medium text-gray-800">Arvind</h5> | |
| <p class="text-sm text-gray-600">Principal Engineer • Microsoft</p> | |
| <div class="mt-1 flex space-x-2"> | |
| <span class="inline-block px-2 py-0.5 text-xs font-medium text-blue-800 bg-blue-100 rounded-full">Mentoring: 4</span> | |
| <span class="inline-block px-2 py-0.5 text-xs font-medium text-green-800 bg-green-100 rounded-full">Available</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <button class="mt-6 w-full bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded-lg font-medium transition duration-300"> | |
| Find a Mentor | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Testimonials Section --> | |
| <section class="py-20 gradient-bg text-white"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-4">Success Stories</h2> | |
| <p class="text-xl max-w-3xl mx-auto">Hear from Tamil Nadu engineers who have pursued global opportunities and advanced their careers.</p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8"> | |
| <!-- Testimonial 1 --> | |
| <div class="testimonial-card rounded-xl p-8 transition duration-300 card-hover"> | |
| <div class="flex items-center mb-6"> | |
| <div class="flex-shrink-0"> | |
| <img class="h-14 w-14 rounded-full" src="https://randomuser.me/api/portraits/women/44.jpg" alt="Sharmila"> | |
| </div> | |
| <div class="ml-4"> | |
| <h4 class="font-bold">Sharmila</h4> | |
| <p class="text-blue-200">AI Engineer at Google</p> | |
| </div> | |
| </div> | |
| <p class="italic mb-6">"The mentorship I received through TN TechConnect was invaluable in securing my internship at Google Zurich. The mock interviews and resume reviews made all the difference in my application process."</p> | |
| <div class="flex items-center"> | |
| <i class="fas fa-star text-yellow-300 mr-1"></i> | |
| <i class="fas fa-star text-yellow-300 mr-1"></i> | |
| <i class="fas fa-star text-yellow-300 mr-1"></i> | |
| <i class="fas fa-star text-yellow-300 mr-1"></i> | |
| <i class="fas fa-star text-yellow-300"></i> | |
| </div> | |
| </div> | |
| <!-- Testimonial 2 --> | |
| <div class="testimonial-card rounded-xl p-8 transition duration-300 card-hover"> | |
| <div class="flex items-center mb-6"> | |
| <div class="flex-shrink-0"> | |
| <img class="h-14 w-14 rounded-full" src="https://randomuser.me/api/portraits/men/54.jpg" alt="Ramesh"> | |
| </div> | |
| <div class="ml-4"> | |
| <h4 class="font-bold">Ramesh</h4> | |
| <p class="text-blue-200">CTO at HealthTech Startup</p> | |
| </div> | |
| </div> | |
| <p class="italic mb-6">"After working at Amazon Seattle for 5 years, I wanted to give back. Through this platform, I've mentored 6 young engineers from Tamil Nadu who are now working at top tech companies globally."</p> | |
| <div class="flex items-center"> | |
| <i class="fas fa-star text-yellow-300 mr-1"></i> | |
| <i class="fas fa-star text-yellow-300 mr-1"></i> | |
| <i class="fas fa-star text-yellow-300 mr-1"></i> | |
| <i class="fas fa-star text-yellow-300 mr-1"></i> | |
| <i class="fas fa-star text-yellow-300"></i> | |
| </div> | |
| </div> | |
| <!-- Testimonial 3 --> | |
| <div class="testimonial-card rounded-xl p-8 transition duration-300 card-hover"> | |
| <div class="flex items-center mb-6"> | |
| <div class="flex-shrink-0"> | |
| <img class="h-14 w-14 rounded-full" src="https://randomuser.me/api/portraits/women/68.jpg" alt="Meena"> | |
| </div> | |
| <div class="ml-4"> | |
| <h4 class="font-bold">Meena</h4> | |
| <p class="text-blue-200">Hardware Engineer at Intel</p> | |
| </div> | |
| </div> | |
| <p class="italic mb-6">"The research collaboration I found through TN TechConnect led to my current position at Intel Oregon. The platform connected me with the right people at the right time in my career."</p> | |
| <div class="flex items-center"> | |
| <i class="fas fa-star text-yellow-300 mr-1"></i> | |
| <i class="fas fa-star text-yellow-300 mr-1"></i> | |
| <i class="fas fa-star text-yellow-300 mr-1"></i> | |
| <i class="fas fa-star text-yellow-300 mr-1"></i> | |
| <i class="fas fa-star-half-alt text-yellow-300"></i> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="text-center mt-12"> | |
| <a href="#" class="inline-block bg-white hover:bg-gray-100 text-blue-800 px-6 py-3 rounded-lg font-semibold transition duration-300"> | |
| Read More Success Stories | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Podcasts Section --> | |
| <section id="podcasts" class="py-20 bg-white podcast-wave"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">TN TechConnect Podcast</h2> | |
| <p class="text-xl text-gray-600 max-w-3xl mx-auto">Listen to conversations with Tamil Nadu engineers who have worked at top global tech companies.</p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <!-- Podcast 1 --> | |
| <div class="bg-white rounded-xl shadow-lg overflow-hidden transition duration-300 card-hover"> | |
| <div class="relative"> | |
| <img src="https://images.unsplash.com/photo-1563986768609-322da13575f3?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Podcast Cover" class="w-full h-48 object-cover"> | |
| <div class="absolute inset-0 bg-blue-800 opacity-20"></div> | |
| <div class="absolute bottom-4 left-4 bg-blue-600 text-white p-2 rounded-full"> | |
| <i class="fas fa-play text-lg"></i> | |
| </div> | |
| </div> | |
| <div class="p-6"> | |
| <div class="flex justify-between items-start mb-2"> | |
| <span class="inline-block px-2 py-1 text-xs font-semibold text-blue-800 bg-blue-100 rounded-full">Episode 23</span> | |
| <span class="text-xs text-gray-500">45 min</span> | |
| </div> | |
| <h3 class="text-xl font-semibold text-gray-800 mb-3">From Coimbatore to Google AI</h3> | |
| <p class="text-gray-600 mb-4">Karthik shares his journey from PSG Tech to leading AI projects at Google's Zurich office.</p> | |
| <div class="flex items-center"> | |
| <div class="flex-shrink-0"> | |
| <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/men/75.jpg" alt="Karthik"> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm font-medium text-gray-900">Karthik</p> | |
| <p class="text-sm text-gray-500">AI Researcher</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Podcast 2 --> | |
| <div class="bg-white rounded-xl shadow-lg overflow-hidden transition duration-300 card-hover"> | |
| <div class="relative"> | |
| <img src="https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Podcast Cover" class="w-full h-48 object-cover"> | |
| <div class="absolute inset-0 bg-green-800 opacity-20"></div> | |
| <div class="absolute bottom-4 left-4 bg-green-600 text-white p-2 rounded-full"> | |
| <i class="fas fa-play text-lg"></i> | |
| </div> | |
| </div> | |
| <div class="p-6"> | |
| <div class="flex justify-between items-start mb-2"> | |
| <span class="inline-block px-2 py-1 text-xs font-semibold text-green-800 bg-green-100 rounded-full">Episode 22</span> | |
| <span class="text-xs text-gray-500">52 min</span> | |
| </div> | |
| <h3 class="text-xl font-semibold text-gray-800 mb-3">Building a Cybersecurity Career</h3> | |
| <p class="text-gray-600 mb-4">Anitha discusses her transition from Chennai to leading security projects at Palo Alto Networks.</p> | |
| <div class="flex items-center"> | |
| <div class="flex-shrink-0"> | |
| <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/women/33.jpg" alt="Anitha"> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm font-medium text-gray-900">Anitha</p> | |
| <p class="text-sm text-gray-500">Security Engineer</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Podcast 3 --> | |
| <div class="bg-white rounded-xl shadow-lg overflow-hidden transition duration-300 card-hover"> | |
| <div class="relative"> | |
| <img src="https://images.unsplash.com/photo-1622675363311-3e1904dc1885?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Podcast Cover" class="w-full h-48 object-cover"> | |
| <div class="absolute inset-0 bg-purple-800 opacity-20"></div> | |
| <div class="absolute bottom-4 left-4 bg-purple-600 text-white p-2 rounded-full"> | |
| <i class="fas fa-play text-lg"></i> | |
| </div> | |
| </div> | |
| <div class="p-6"> | |
| <div class="flex justify-between items-start mb-2"> | |
| <span class="inline-block px-2 py-1 text-xs font-semibold text-purple-800 bg-purple-100 rounded-full">Episode 21</span> | |
| <span class="text-xs text-gray-500">38 min</span> | |
| </div> | |
| <h3 class="text-xl font-semibold text-gray-800 mb-3">From TN to Silicon Valley</h3> | |
| <p class="text-gray-600 mb-4">Suresh reflects on his journey from Anna University to founding a successful AI startup in California.</p> | |
| <div class="flex items-center"> | |
| <div class="flex-shrink-0"> | |
| <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/men/22.jpg" alt="Suresh"> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm font-medium text-gray-900">Suresh</p> | |
| <p class="text-sm text-gray-500">Startup Founder</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="text-center mt-12"> | |
| <a href="#" class="inline-flex items-center bg-blue-800 hover:bg-blue-900 text-white px-6 py-3 rounded-lg font-semibold transition duration-300"> | |
| <i class="fas fa-headphones mr-2"></i> Browse All Episodes | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- CTA Section --> | |
| <section class="py-16 bg-gray-900 text-white"> | |
| <div class="container mx-auto px-6 text-center"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-6">Ready to Advance Your Engineering Career?</h2> | |
| <p class="text-xl mb-8 max-w-3xl mx-auto">Join our growing community of Tamil Nadu engineering professionals accessing global opportunities.</p> | |
| <div class="flex flex-wrap justify-center gap-4"> | |
| <a href="#" class="bg-blue-600 hover:bg-blue-700 text-white px-8 py-4 rounded-lg font-semibold text-lg transition duration-300"> | |
| Create Free Account | |
| </a> | |
| <a href="#" class="border border-white hover:bg-white hover:text-gray-900 text-white px-8 py-4 rounded-lg font-semibold text-lg transition duration-300"> | |
| Learn More | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Footer --> | |
| <footer class="bg-gray-800 text-white pt-12 pb-6"> | |
| <div class="container mx-auto px-6"> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8 mb-8"> | |
| <div> | |
| <h3 class="text-xl font-bold mb-4">TN TechConnect</h3> | |
| <p class="mb-4">Empowering Tamil Nadu's engineering professionals with global opportunities and connections.</p> | |
| <div class="flex space-x-4"> | |
| <a href="#" class="text-gray-400 hover:text-white"> | |
| <i class="fab fa-facebook-f"></i> | |
| </a> | |
| <a href="#" class="text-gray-400 hover:text-white"> | |
| <i class="fab fa-twitter"></i> | |
| </a> | |
| <a href="#" class="text-gray-400 hover:text-white"> | |
| <i class="fab fa-linkedin-in"></i> | |
| </a> | |
| <a href="#" class="text-gray-400 hover:text-white"> | |
| <i class="fab fa-instagram"></i> | |
| </a> | |
| </div> | |
| </div> | |
| <div> | |
| <h4 class="text-lg font-semibold mb-4">Quick Links</h4> | |
| <ul class="space-y-2"> | |
| <li><a href="#" class="hover:text-blue-300">Home</a></li> | |
| <li><a href="#" class="hover:text-blue-300">Internships</a></li> | |
| <li><a href="#" class="hover:text-blue-300">Tech Events</a></li> | |
| <li><a href="#" class="hover:text-blue-300">Research</a></li> | |
| <li><a href="#" class="hover:text-blue-300">Community</a></li> | |
| <li><a href="#" class="hover:text-blue-300">Podcasts</a></li> | |
| </ul> | |
| </div> | |
| <div> | |
| <h4 class="text-lg font-semibold mb-4">Resources</h4> | |
| <ul class="space-y-2"> | |
| <li><a href="#" class="hover:text-blue-300">Internship Guide</a></li> | |
| <li><a href="#" class="hover:text-blue-300">Tech Event Calendar</a></li> | |
| <li><a href="#" class="hover:text-blue-300">Research Grants</a></li> | |
| <li><a href="#" class="hover:text-blue-300">Mentorship Program</a></li> | |
| <li><a href="#" class="hover:text-blue-300">Engineer Directory</a></li> | |
| <li><a href="#" class="hover:text-blue-300">FAQ</a></li> | |
| </ul> | |
| </div> | |
| <div> | |
| <h4 class="text-lg font-semibold mb-4">Contact Us</h4> | |
| <ul class="space-y-2"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-map-marker-alt mt-1 mr-3 text-blue-300"></i> | |
| <span>123 Tech Park, Chennai, Tamil Nadu 600001</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i class="fas fa-phone-alt mr-3 text-blue-300"></i> | |
| <span>+91 98765 43210</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i class="fas fa-envelope mr-3 text-blue-300"></i> | |
| <span>contact@tntechconnect.org</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div class="border-t border-gray-700 pt-6 flex flex-col md:flex-row justify-between items-center"> | |
| <p class="text-gray-400 mb-4 md:mb-0">© 2023 TN TechConnect. All rights reserved.</p> | |
| <div class="flex space-x-6"> | |
| <a href="#" class="text-gray-400 hover:text-white">Privacy Policy</a> | |
| <a href="#" class="text-gray-400 hover:text-white">Terms of Service</a> | |
| <a href="#" class="text-gray-400 hover:text-white">Cookie Policy</a> | |
| </div> | |
| </div> | |
| </div> | |
| </footer> | |
| <script> | |
| // Mobile menu toggle | |
| const mobileMenuButton = document.querySelector('.mobile-menu-button'); | |
| const mobileMenu = document.querySelector('.mobile-menu'); | |
| mobileMenuButton.addEventListener('click', () => { | |
| mobileMenu.classList.toggle('hidden'); | |
| }); | |
| // Smooth scrolling for anchor links | |
| document.querySelectorAll('a[href^="#"]').forEach(anchor => { | |
| anchor.addEventListener('click', function (e) { | |
| e.preventDefault(); | |
| document.querySelector(this.getAttribute('href')).scrollIntoView({ | |
| behavior: 'smooth' | |
| }); | |
| // Close mobile menu if open | |
| if (!mobileMenu.classList.contains('hidden')) { | |
| mobileMenu.classList.add('hidden'); | |
| } | |
| }); | |
| }); | |
| // Sticky header on scroll | |
| window.addEventListener('scroll', function() { | |
| const nav = document.querySelector('nav'); | |
| if (window.scrollY > 50) { | |
| nav.classList.add('shadow-xl'); | |
| } else { | |
| nav.classList.remove('shadow-xl'); | |
| } | |
| }); | |
| </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=rocknlight/tn25" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p><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=Sangeethvr/techcom" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |