| | <!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> |
