Spaces:
Running
Running
| <html lang="en" class="dark"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>About | Dossiya DAKOU</title> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script> | |
| tailwind.config = { | |
| darkMode: 'class', | |
| theme: { | |
| extend: { | |
| colors: { | |
| onyx: '#0B0B0F', | |
| offwhite: '#F7F7F8', | |
| teal: '#2CA7A0', | |
| deepblue: '#90EE90', | |
| orange: '#E67E22', | |
| }, | |
| fontFamily: { | |
| inter: ['Inter', 'sans-serif'], | |
| source: ['Source Sans Pro', 'sans-serif'], | |
| }, | |
| } | |
| } | |
| } | |
| </script> | |
| <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Source+Sans+Pro:wght@300;400;600&display=swap"> | |
| </head> | |
| <body class="bg-onyx text-offwhite font-source min-h-screen"> | |
| <!-- Navigation Rubrique --> | |
| <nav class="sticky top-0 z-50 bg-onyx/90 backdrop-blur border-b border-gray-800 py-3 px-6 md:px-12 lg:px-24"> | |
| <div class="max-w-7xl mx-auto flex justify-between items-center"> | |
| <a href="index.html" class="flex items-center space-x-2"> | |
| <span class="text-2xl font-inter font-bold text-green-300">Dossiya DAKOU</span> | |
| </a> | |
| <div class="hidden md:flex space-x-2"> | |
| <a href="index.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-offwhite">Home</a> | |
| <a href="about.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-orange font-medium">About</a> | |
| <a href="experience.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-offwhite">Experience</a> | |
| <a href="projects.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-offwhite">Projects</a> | |
| <a href="awards.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-offwhite">Awards</a> | |
| <a href="skills.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-offwhite">Skills</a> | |
| <a href="contact.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-offwhite">Contact</a> | |
| <a href="resume.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-offwhite">Resume</a> | |
| </div> | |
| <div class="flex items-center space-x-4"> | |
| <button id="theme-toggle" class="p-2 rounded-full hover:bg-gray-800"> | |
| <i class="fas fa-moon text-teal"></i> | |
| </button> | |
| <div class="flex items-center space-x-1 ml-4"> | |
| <a href="#" class="px-3 py-1 rounded-md bg-orange/10 text-orange hover:bg-orange/20">EN</a> | |
| <a href="#" class="px-3 py-1 rounded-md hover:bg-gray-800">FR</a> | |
| </div> | |
| </div> | |
| </div> | |
| </nav> | |
| <nav class="sticky top-0 z-50 bg-onyx/90 backdrop-blur border-b border-gray-800 py-3 px-6 md:px-12 lg:px-24"> | |
| <div class="max-w-7xl mx-auto flex justify-between items-center"> | |
| <a href="index.html" class="flex items-center space-x-2"> | |
| <span class="text-2xl font-inter font-bold text-green-300">Dossiya DAKOU</span> | |
| </a> | |
| <div class="hidden md:flex space-x-2"> | |
| <a href="index.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-offwhite">Home</a> | |
| <a href="about.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-orange font-medium">About</a> | |
| <a href="experience.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-offwhite">Experience</a> | |
| <a href="projects.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-offwhite">Projects</a> | |
| <a href="awards.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-offwhite">Awards</a> | |
| <a href="skills.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-offwhite">Skills</a> | |
| <a href="contact.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-offwhite">Contact</a> | |
| <a href="resume.html" class="px-4 py-2 rounded-lg hover:bg-gray-800 text-offwhite">Resume</a> | |
| </div> | |
| <div class="flex items-center space-x-4"> | |
| <button id="theme-toggle" class="p-2 rounded-full hover:bg-gray-800"> | |
| <i class="fas fa-moon text-teal"></i> | |
| </button> | |
| <div class="flex items-center space-x-1 ml-4"> | |
| <a href="#" class="px-3 py-1 rounded-md bg-orange/10 text-orange hover:bg-orange/20">EN</a> | |
| <a href="#" class="px-3 py-1 rounded-md hover:bg-gray-800">FR</a> | |
| </div> | |
| </div> | |
| </div> | |
| </nav> | |
| <!-- About Section --> | |
| <section class="px-6 md:px-12 lg:px-24 py-16 min-h-[80vh] bg-black"> | |
| <div class="rounded-xl p-8"> | |
| <div class="max-w-4xl mx-auto"> | |
| <h2 class="text-3xl font-inter font-bold text-green-300 mb-8">About Me</h2> | |
| <div class="grid md:grid-cols-2 gap-12"> | |
| <div> | |
| <p class="mb-4">Mastercard Foundation Scholar at Arizona State University pursuing a Master of Science in Engineering in Sustainable Engineering with a Bachelor of Physical Science in Renewable Energy and Energy Systems.</p> | |
| <p class="mb-4">I believe engineering should serve both people and the planet. My journey sits at the crossroads of technology, social equity, and environmental justice.</p> | |
| <p>I'm passionate about how AI and machine learning can help build smarter, more inclusive energy systems, with a focus on policies that ensure fairness, engineering that restores dignity, and research that includes marginalized voices.</p> | |
| </div> | |
| <div class="bg-gray-900 bg-opacity-50 p-6 rounded-lg border border-gray-800"> | |
| <h3 class="text-xl font-inter text-deepblue mb-4">Details</h3> | |
| <div class="space-y-4"> | |
| <div> | |
| <h4 class="text-orange font-medium">Location</h4> | |
| <p>Kigali, Rwanda</p> | |
| </div> | |
| <div> | |
| <h4 class="text-orange font-medium">Contact</h4> | |
| <p>+250 796 892 820</p> | |
| <p>ddakou@asu.edu</p> | |
| </div> | |
| <div> | |
| <h4 class="text-orange font-medium">Links</h4> | |
| <div class="flex space-x-4"> | |
| <a href="https://www.linkedin.com/in/dossiya-dakou" class="text-teal hover:text-orange transition"><i class="fab fa-linkedin"></i></a> | |
| <a href="index.html" class="text-teal hover:text-orange transition"><i class="fas fa-globe"></i></a> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Footer --> | |
| <footer class="border-t border-gray-800 py-8 px-6 md:px-12 lg:px-24"> | |
| <div class="max-w-4xl mx-auto flex flex-col md:flex-row justify-between items-center"> | |
| <div class="mb-4 md:mb-0"> | |
| <p>© 2023 Dossiya DAKOU. All rights reserved.</p> | |
| <p class="text-sm text-green-300 mt-1">Built with passion and Next.js & Tailwind CSS</p> | |
| </div> | |
| <div class="flex space-x-6"> | |
| <a href="https://www.linkedin.com/in/dossiya-dakou" class="text-teal hover:text-orange transition"><i class="fab fa-linkedin"></i></a> | |
| <a href="mailto:ddakou@asu.edu" class="text-teal hover:text-orange transition"><i class="fas fa-envelope"></i></a> | |
| <a href="tel:+250796892820" class="text-teal hover:text-orange transition"><i class="fas fa-phone"></i></a> | |
| <a href="index.html" class="text-teal hover:text-orange transition"><i class="fas fa-globe"></i></a> | |
| </div> | |
| </div> | |
| </footer> | |
| </body> | |
| </html> |