Hugging Face's logo

Spaces:
Basti1110
/
FakeDetect
Sleeping

App Files Community
Basti1110 commited on
Commit
2e02d81
·
verified ·
1 Parent(s): 60b35eb

improved optics

Browse files
Files changed (1) hide show
  1. index.html +50 -31
index.html CHANGED
@@ -1,50 +1,69 @@
1
  <!DOCTYPE html>
2
- <html lang="en">
3
  <head>
4
  <meta charset="UTF-8" />
5
  <title>FakeDetect</title>
6
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
  <script src="https://cdn.tailwindcss.com"></script>
 
 
 
 
 
 
 
 
 
 
 
 
 
8
  </head>
9
- <body class="bg-gray-100">
10
- <div class="max-w-3xl mx-auto mt-10 p-6 bg-white rounded-xl shadow">
11
- <h1 class="text-2xl font-bold mb-6 text-center text-blue-700">🔍 OSINT FakeDetect</h1>
12
 
13
- <form action="/analyze" method="POST">
14
- <label class="block mb-2 font-medium">Paste article, tweet, or message:</label>
15
- <textarea name="input_text" rows="10" class="w-full border rounded p-3 mb-4" required></textarea>
 
 
16
 
17
- <label class="block mb-2 font-medium">Select content language:</label>
18
- <select name="language" class="w-full border rounded p-2 mb-4">
19
- <option value="en">English</option>
20
- <option value="de">German</option>
21
- <option value="es">Spanish</option>
22
- <option value="fr">French</option>
23
- <option value="ru">Russian</option>
24
- </select>
 
 
25
 
26
- <button type="submit" class="w-full bg-blue-600 text-white py-2 rounded hover:bg-blue-700">
27
- Generate OSINT Report
28
  </button>
29
  </form>
30
 
31
  <!-- Image Previews -->
32
  <div class="mt-10">
33
- <h2 class="text-lg font-semibold text-gray-700 mb-2">🖼 Sentiment Overview</h2>
34
- <img src="/tmp/sentiment_pie_chart.png" alt="Sentiment Chart" class="w-full border rounded shadow" />
35
 
36
- <h2 class="text-lg font-semibold text-gray-700 mt-6 mb-2">🌐 Network Graph</h2>
37
- <img src="/tmp/network_graph.png" alt="Network Graph" class="w-full border rounded shadow" />
38
- </div>
39
- <p class="text-sm text-gray-600 italic">
40
- ⏳ Images will appear here after report generation. If not, try reloading this page.
41
- </p>
42
-
43
- <!-- Download Button -->
44
- <div class="mt-8 text-center">
45
- <a href="/tmp/OSINT_Report.html" download class="inline-block bg-green-600 text-white px-6 py-2 rounded hover:bg-green-700">
46
- ⬇️ Download Full Report (HTML)
47
- </a>
 
 
 
48
  </div>
49
  </div>
50
  </body>
 
1
  <!DOCTYPE html>
2
+ <html lang="en" class="dark">
3
  <head>
4
  <meta charset="UTF-8" />
5
  <title>FakeDetect</title>
6
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
  <script src="https://cdn.tailwindcss.com"></script>
8
+ <script>
9
+ tailwind.config = {
10
+ darkMode: 'class',
11
+ theme: {
12
+ extend: {
13
+ colors: {
14
+ primary: '#4f46e5',
15
+ accent: '#10b981',
16
+ }
17
+ }
18
+ }
19
+ }
20
+ </script>
21
  </head>
22
+ <body class="bg-gray-900 text-gray-100 min-h-screen font-sans">
23
+ <div class="max-w-4xl mx-auto mt-10 p-8 bg-gray-800 rounded-2xl shadow-xl">
24
+ <h1 class="text-3xl font-extrabold mb-8 text-center text-primary">🕵️ FakeDetect OSINT Analyzer</h1>
25
 
26
+ <form action="/analyze" method="POST" class="space-y-6">
27
+ <div>
28
+ <label class="block mb-2 font-semibold text-gray-300">Paste article, tweet, or message:</label>
29
+ <textarea name="input_text" rows="8" class="w-full bg-gray-700 text-gray-100 border border-gray-600 rounded-lg p-4 focus:ring-2 focus:ring-primary outline-none" required></textarea>
30
+ </div>
31
 
32
+ <div>
33
+ <label class="block mb-2 font-semibold text-gray-300">Select output language:</label>
34
+ <select name="language" class="w-full bg-gray-700 text-gray-100 border border-gray-600 rounded-lg p-3">
35
+ <option value="en">English</option>
36
+ <option value="de">German</option>
37
+ <option value="es">Spanish</option>
38
+ <option value="fr">French</option>
39
+ <option value="ru">Russian</option>
40
+ </select>
41
+ </div>
42
 
43
+ <button type="submit" class="w-full bg-primary text-white font-semibold py-3 rounded-lg hover:bg-indigo-700 transition">
44
+ 🚀 Generate OSINT Report
45
  </button>
46
  </form>
47
 
48
  <!-- Image Previews -->
49
  <div class="mt-10">
50
+ <h2 class="text-xl font-bold text-accent mb-4">📊 Latest Analysis Preview</h2>
 
51
 
52
+ <div class="mb-6">
53
+ <h3 class="font-semibold text-gray-300">Sentiment Chart</h3>
54
+ <img src="/tmp/sentiment_pie_chart.png" alt="Sentiment Chart" class="mt-3 border border-gray-600 rounded-xl shadow-lg w-full" />
55
+ </div>
56
+
57
+ <div class="mb-6">
58
+ <h3 class="font-semibold text-gray-300">Network Graph</h3>
59
+ <img src="/tmp/network_graph.png" alt="Network Graph" class="mt-3 border border-gray-600 rounded-xl shadow-lg w-full" />
60
+ </div>
61
+
62
+ <div class="text-center mt-8">
63
+ <a href="/tmp/OSINT_Report.html" download class="inline-block bg-accent text-white px-6 py-3 rounded-full font-semibold shadow-lg hover:bg-emerald-600 transition">
64
+ ⬇️ Download Full HTML Report
65
+ </a>
66
+ </div>
67
  </div>
68
  </div>
69
  </body>