Spaces:
Configuration error
Configuration error
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Markdown Instructions</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://unpkg.com/feather-icons"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> | |
| <style> | |
| .markdown-content { | |
| font-family: 'Inter', sans-serif; | |
| line-height: 1.6; | |
| } | |
| .markdown-content h1 { | |
| @apply text-3xl font-bold mb-4 mt-8 text-indigo-700 border-b-2 border-indigo-200 pb-2; | |
| } | |
| .markdown-content h2 { | |
| @apply text-2xl font-semibold mb-3 mt-6 text-indigo-600; | |
| } | |
| .markdown-content p { | |
| @apply mb-4 text-gray-700; | |
| } | |
| .markdown-content code { | |
| @apply bg-gray-100 px-2 py-1 rounded text-sm font-mono text-gray-800; | |
| } | |
| .markdown-content pre { | |
| @apply bg-gray-800 text-gray-100 p-4 rounded-lg overflow-x-auto mb-4; | |
| } | |
| .markdown-content ul { | |
| @apply list-disc pl-5 mb-4; | |
| } | |
| .markdown-content ol { | |
| @apply list-decimal pl-5 mb-4; | |
| } | |
| .markdown-content blockquote { | |
| @apply border-l-4 border-indigo-300 pl-4 italic text-gray-600 my-4; | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-gray-50"> | |
| <div class="container mx-auto px-4 py-12 max-w-4xl"> | |
| <div class="bg-white rounded-xl shadow-lg overflow-hidden"> | |
| <div class="p-6 md:p-8"> | |
| <div class="flex items-center justify-between mb-8"> | |
| <h1 class="text-3xl font-bold text-gray-800 flex items-center"> | |
| <i data-feather="file-text" class="mr-3 text-indigo-500"></i> | |
| Project Instructions | |
| </h1> | |
| <div class="flex space-x-2"> | |
| <button class="p-2 rounded-full bg-gray-100 hover:bg-gray-200 transition"> | |
| <i data-feather="edit-2" class="text-gray-600"></i> | |
| </button> | |
| <button class="p-2 rounded-full bg-gray-100 hover:bg-gray-200 transition"> | |
| <i data-feather="download" class="text-gray-600"></i> | |
| </button> | |
| </div> | |
| </div> | |
| <div class="markdown-content"> | |
| <!-- Start of markdown content --> | |
| <h1>Project Development Guidelines</h1> | |
| <p>Welcome to the project! Here are the essential guidelines for development:</p> | |
| <h2>1. Code Structure</h2> | |
| <ul> | |
| <li>Follow the MVC pattern for better organization</li> | |
| <li>Keep components modular and reusable</li> | |
| <li>Use meaningful file and folder names</li> | |
| </ul> | |
| <h2>2. Styling Standards</h2> | |
| <p>We're using TailwindCSS for styling. Please adhere to:</p> | |
| <pre><code>// Good example | |
| <div class="flex justify-between items-center p-4 bg-white rounded-lg shadow"> | |
| Content here | |
| </div></code></pre> | |
| <h2>3. JavaScript Best Practices</h2> | |
| <blockquote> | |
| "Write code as if the person who ends up maintaining your code is a violent psychopath who knows where you live." | |
| </blockquote> | |
| <ol> | |
| <li>Use ES6+ features</li> | |
| <li>Implement proper error handling</li> | |
| <li>Document complex functions</li> | |
| </ol> | |
| <h2>4. Testing Requirements</h2> | |
| <p>All features must include:</p> | |
| <ul> | |
| <li>Unit tests for business logic</li> | |
| <li>Integration tests for API calls</li> | |
| <li>End-to-end tests for critical user flows</li> | |
| </ul> | |
| <h2>5. Deployment Process</h2> | |
| <pre><code># Deployment commands | |
| npm run build | |
| npm run test | |
| npm run deploy</code></pre> | |
| <h2>6. Collaboration Rules</h2> | |
| <p>Remember to:</p> | |
| <ul> | |
| <li>Create feature branches</li> | |
| <li>Submit PRs for review</li> | |
| <li>Resolve merge conflicts properly</li> | |
| </ul> | |
| <!-- End of markdown content --> | |
| </div> | |
| <div class="mt-8 pt-6 border-t border-gray-200"> | |
| <div class="flex items-center"> | |
| <div class="flex-shrink-0"> | |
| <i data-feather="alert-circle" class="text-yellow-500"></i> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm text-gray-600"> | |
| Please review these guidelines before starting any work on the project. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <script> | |
| feather.replace(); | |
| document.addEventListener('DOMContentLoaded', function() { | |
| // Any initialization code can go here | |
| }); | |
| </script> | |
| </body> | |
| </html> | |