| import gradio as gr | |
| html_content = """ | |
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Welcome to kindahex</title> | |
| <style> | |
| body { | |
| font-family: Arial, sans-serif; | |
| background-color: #282c34; | |
| color: #ffffff; | |
| padding: 20px; | |
| } | |
| h1, h2, h3 { | |
| animation: fadeIn 2s ease-in-out; | |
| } | |
| h1 { | |
| font-size: 3em; | |
| margin-bottom: 20px; | |
| } | |
| h2 { | |
| font-size: 2em; | |
| margin: 10px 0; | |
| } | |
| h3 { | |
| font-size: 1.5em; | |
| } | |
| p, li { | |
| font-size: 1.2em; | |
| animation: fadeIn 3s ease-in-out; | |
| margin: 10px 0; | |
| } | |
| li { | |
| list-style-type: disc; | |
| margin-left: 20px; | |
| } | |
| a { | |
| color: #61dafb; | |
| text-decoration: none; | |
| } | |
| a:hover { | |
| text-decoration: underline; | |
| } | |
| /* Animations */ | |
| @keyframes fadeIn { | |
| 0% { | |
| opacity: 0; | |
| transform: translateY(-10px); | |
| } | |
| 100% { | |
| opacity: 1; | |
| transform: translateY(0); | |
| } | |
| } | |
| /* Additional styling */ | |
| .highlight { | |
| font-weight: bold; | |
| color: #61dafb; | |
| animation: fadeIn 4s ease-in-out; | |
| } | |
| .container { | |
| max-width: 800px; | |
| margin: 0 auto; | |
| text-align: left; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <h1>Welcome to <span class="highlight">kindahex</span></h1> | |
| <p><strong>kindahex</strong> is an organization dedicated to developing innovative and open-source software solutions. Our projects span various domains including AI, web development, and automation, designed to push the boundaries of technology while fostering collaboration and learning.</p> | |
| <h2>📌 What We Do</h2> | |
| <p>At kindahex, we focus on creating tools and platforms that:</p> | |
| <ul> | |
| <li>Simplify complex processes with intuitive user interfaces.</li> | |
| <li>Empower developers and users alike through automation.</li> | |
| <li>Leverage cutting-edge AI technologies for practical applications.</li> | |
| </ul> | |
| <p>Our primary areas of interest include:</p> | |
| <ul> | |
| <li><strong>Artificial Intelligence</strong>: Building AI-based solutions for diverse tasks.</li> | |
| <li><strong>Web Development</strong>: Creating interactive web applications with modern technologies.</li> | |
| <li><strong>Automation</strong>: Streamlining workflows to boost productivity.</li> | |
| </ul> | |
| <h2>🌱 Contributing</h2> | |
| <p>We welcome contributions from the open-source community! If you're interested in contributing:</p> | |
| <ul> | |
| <li>Fork the repository you’re interested in.</li> | |
| <li>Create a new branch (`git checkout -b feature-branch`).</li> | |
| <li>Make your changes and commit (`git commit -m 'Add new feature'`).</li> | |
| <li>Push your branch (`git push origin feature-branch`).</li> | |
| <li>Open a pull request for review.</li> | |
| </ul> | |
| <h2>📬 Contact</h2> | |
| <p>For inquiries or collaboration, feel free to reach out to us through <a href="https://github.com/kindahex" target="_blank">GitHub</a>, or <a href="https://huggingface.co/spaces/kindahex/README/discussions" target="_blank">Hugging Face discussions</a>.</p> | |
| </div> | |
| </body> | |
| </html> | |
| """ | |
| with gr.Blocks() as demo: | |
| gr.HTML(html_content) | |
| demo.launch() | |