| <!DOCTYPE html>
|
| <html lang="en">
|
|
|
| <head>
|
| <meta charset="UTF-8">
|
| <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| <title>404 - Page Not Found | Tweet Depression Detection</title>
|
|
|
| <link rel="icon" href="{{url_for('.static', filename='brain.svg')}}" type="image/svg+xml">
|
|
|
|
|
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
|
| <link rel="stylesheet" href="{{url_for('.static', filename='styles.css')}}">
|
| <script src="{{url_for('.static', filename='security.js')}}"></script>
|
|
|
| <style>
|
| body {
|
| overflow-x: hidden;
|
| display: flex;
|
| flex-direction: column;
|
| min-height: 100vh;
|
| }
|
|
|
| .error-container {
|
| flex: 1;
|
| display: flex;
|
| flex-direction: column;
|
| justify-content: center;
|
| align-items: center;
|
| text-align: center;
|
| padding: 20px;
|
| }
|
|
|
| .error-code {
|
| font-size: 10rem;
|
| color: var(--clr-accent-dark);
|
| font-weight: 700;
|
| margin: 0;
|
| line-height: 1;
|
| position: relative;
|
| animation: glitch 1s infinite alternate-reverse;
|
| text-shadow: 2px 2px 0 var(--clr-accent), -2px -2px 0 #ff0055;
|
| }
|
|
|
| .error-message {
|
| font-size: 1.5rem;
|
| color: var(--clr-slate);
|
| margin-top: 10px;
|
| margin-bottom: 40px;
|
| letter-spacing: 1px;
|
| }
|
|
|
| @keyframes glitch {
|
| 0% {
|
| transform: skew(0deg);
|
| }
|
|
|
| 20% {
|
| transform: skew(-2deg);
|
| }
|
|
|
| 40% {
|
| transform: skew(2deg);
|
| }
|
|
|
| 60% {
|
| transform: skew(-1deg);
|
| }
|
|
|
| 80% {
|
| transform: skew(3deg);
|
| }
|
|
|
| 100% {
|
| transform: skew(0deg);
|
| }
|
| }
|
|
|
| .broken-icon {
|
| font-size: 5rem;
|
| color: var(--clr-light-slate);
|
| margin-bottom: 20px;
|
| animation: float 3s ease-in-out infinite;
|
| }
|
|
|
| @keyframes float {
|
| 0% {
|
| transform: translateY(0px) rotate(0deg);
|
| }
|
|
|
| 50% {
|
| transform: translateY(-15px) rotate(5deg);
|
| }
|
|
|
| 100% {
|
| transform: translateY(0px) rotate(0deg);
|
| }
|
| }
|
| </style>
|
| </head>
|
|
|
| <body>
|
|
|
| <header class="hero-section container animate-fade">
|
| <i class="fas fa-brain fa-3x" style="color: #1daeff; margin-bottom: 20px;"></i>
|
| <h1>Tweet Depression Detection</h1>
|
| </header>
|
|
|
| <main class="container animate-fade" style="animation-delay: 0.2s;">
|
| <div class="error-container">
|
| <i class="fas fa-unlink broken-icon"></i>
|
| <h1 class="error-code">404</h1>
|
| <p class="error-message">Oops! This tweet seems to have disappeared.</p>
|
|
|
| <a href="{{ url_for('index') }}" class="btn-primary">
|
| <i class="fas fa-home" style="margin-right: 8px;"></i> Return to Home
|
| </a>
|
| </div>
|
| </main>
|
|
|
| <footer class="container"
|
| style="padding: 60px 0 40px; text-align: center; border-top: 1px solid rgba(136, 146, 176, 0.1);">
|
| <p style="color: var(--clr-slate); font-size: 0.95rem; margin-bottom: 12px;">
|
| Developed by <a href="https://github.com/Amey-Thakur"
|
| style="color: var(--clr-accent-dark); font-weight: 700;">Amey Thakur</a> & <a
|
| href="https://github.com/msatmod" style="color: var(--clr-accent-dark); font-weight: 700;">Mega
|
| Satish</a>
|
| </p>
|
| <p style="color: var(--clr-light-slate); font-size: 0.85rem; letter-spacing: 0.5px;">
|
| © 2022 • MIT License • <a href="https://github.com/Amey-Thakur/DEPRESSION-DETECTION-USING-TWEETS"
|
| target="_blank" style="margin-left: 5px;"><i class="fab fa-github"></i> GitHub</a>
|
| </p>
|
| </footer>
|
|
|
| </body>
|
|
|
| </html> |
