Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <meta name="description" content="{% block meta_description %}SwiftOps API - Field Service Management Platform{% endblock %}"> | |
| <title>{% block title %}SwiftOps API{% endblock %}</title> | |
| <style> | |
| * { | |
| margin: 0; | |
| padding: 0; | |
| box-sizing: border-box; | |
| } | |
| body { | |
| font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; | |
| background: #0a0a0a; | |
| color: #e0e0e0; | |
| line-height: 1.6; | |
| min-height: 100vh; | |
| display: flex; | |
| flex-direction: column; | |
| align-items: center; | |
| padding: 2rem 1rem; | |
| } | |
| .container { | |
| width: 100%; | |
| max-width: 800px; | |
| margin: 0 auto; | |
| } | |
| header { | |
| text-align: center; | |
| padding: 2rem 0 3rem; | |
| border-bottom: 1px solid #2a2a2a; | |
| margin-bottom: 3rem; | |
| } | |
| h1 { | |
| font-size: 2.5rem; | |
| font-weight: 700; | |
| margin-bottom: 0.5rem; | |
| color: #ffffff; | |
| letter-spacing: -0.5px; | |
| } | |
| h2 { | |
| font-size: 1.5rem; | |
| margin-bottom: 1.5rem; | |
| color: #ffffff; | |
| font-weight: 600; | |
| } | |
| h3 { | |
| font-size: 1rem; | |
| margin-bottom: 0.5rem; | |
| color: #ffffff; | |
| font-weight: 600; | |
| } | |
| p { | |
| color: #888; | |
| line-height: 1.6; | |
| } | |
| a { | |
| color: #4a9eff; | |
| text-decoration: none; | |
| transition: color 0.2s; | |
| } | |
| a:hover { | |
| color: #64b5f6; | |
| } | |
| .description { | |
| font-size: 1rem; | |
| color: #888; | |
| margin-top: 0.5rem; | |
| } | |
| .cards { | |
| display: grid; | |
| grid-template-columns: repeat(3, 1fr); | |
| gap: 1rem; | |
| margin-bottom: 3rem; | |
| } | |
| .card { | |
| background: #1a1a1a; | |
| border: 1px solid #2a2a2a; | |
| border-radius: 8px; | |
| padding: 1.5rem; | |
| text-align: center; | |
| transition: all 0.2s; | |
| cursor: pointer; | |
| text-decoration: none; | |
| color: inherit; | |
| display: block; | |
| } | |
| .card:hover { | |
| border-color: #4a9eff; | |
| transform: translateY(-2px); | |
| box-shadow: 0 4px 12px rgba(74, 158, 255, 0.1); | |
| } | |
| .card h3 { | |
| font-size: 1rem; | |
| margin-bottom: 0.5rem; | |
| color: #ffffff; | |
| font-weight: 600; | |
| } | |
| .card p { | |
| font-size: 0.875rem; | |
| color: #888; | |
| line-height: 1.4; | |
| } | |
| .btn { | |
| background: #2a2a2a; | |
| border: 1px solid #3a3a3a; | |
| color: #e0e0e0; | |
| padding: 0.75rem 1.5rem; | |
| border-radius: 6px; | |
| cursor: pointer; | |
| font-size: 0.875rem; | |
| transition: all 0.2s; | |
| font-family: inherit; | |
| text-decoration: none; | |
| display: inline-block; | |
| } | |
| .btn:hover { | |
| background: #3a3a3a; | |
| color: #4a9eff; | |
| border-color: #4a9eff; | |
| } | |
| .btn-primary { | |
| background: #1e3a5f; | |
| color: #64b5f6; | |
| border-color: #1e3a5f; | |
| } | |
| .btn-primary:hover { | |
| background: #2a4a6f; | |
| border-color: #4a9eff; | |
| } | |
| footer { | |
| text-align: center; | |
| padding: 2rem 0; | |
| border-top: 1px solid #2a2a2a; | |
| color: #666; | |
| font-size: 0.875rem; | |
| margin-top: auto; | |
| width: 100%; | |
| max-width: 800px; | |
| } | |
| .footer-content { | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: center; | |
| } | |
| .footer-link { | |
| color: #4a9eff; | |
| text-decoration: none; | |
| transition: color 0.2s; | |
| } | |
| .footer-link:hover { | |
| color: #64b5f6; | |
| } | |
| @media (max-width: 768px) { | |
| .cards { | |
| grid-template-columns: 1fr; | |
| } | |
| .footer-content { | |
| flex-direction: column; | |
| gap: 0.5rem; | |
| } | |
| h1 { | |
| font-size: 2rem; | |
| } | |
| } | |
| </style> | |
| {% block extra_css %}{% endblock %} | |
| </head> | |
| <body> | |
| {% block content %}{% endblock %} | |
| {% block extra_js %}{% endblock %} | |
| </body> | |
| </html> | |