agnixcode commited on
Commit
f173d1b
·
verified ·
1 Parent(s): c584b78

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +48 -90
app.py CHANGED
@@ -6,131 +6,89 @@ import gradio as gr
6
  from openai import OpenAI
7
  from pypdf import PdfReader
8
  from sentence_transformers import SentenceTransformer
 
9
  css = """
10
 
11
  /* =========================
12
- TELECOM ENTERPRISE THEME
13
- Magenta AI Chatbot UI
14
  ========================= */
15
 
16
- /* Background */
 
 
 
 
 
17
 
 
18
  body {
19
- background: linear-gradient(135deg, #0B0B10, #141420);
20
- font-family: "Segoe UI", Roboto, Arial;
21
- color: white;
22
  }
23
 
24
- /* Main container */
25
  .gradio-container {
26
- max-width: 1100px !important;
27
- margin: auto;
28
- padding: 20px;
 
 
 
29
  }
30
 
31
- /* Header / Title */
32
  h1, h2, h3 {
33
- color: #E20074;
34
- font-weight: 700;
35
- letter-spacing: 0.5px;
36
  }
37
 
38
- /* Chat container */
39
- .chatbot, .gradio-chatbot {
40
- background: rgba(28, 28, 37, 0.6);
41
- border: 1px solid rgba(226, 0, 116, 0.2);
42
- border-radius: 18px;
43
- backdrop-filter: blur(14px);
44
- padding: 10px;
45
- }
46
 
47
- /* USER MESSAGE */
48
- .message.user {
49
- background: linear-gradient(135deg, #E20074, #b0005a);
50
- color: white;
51
- border-radius: 16px;
52
- padding: 12px;
53
- box-shadow: 0 6px 20px rgba(226, 0, 116, 0.3);
54
- transition: 0.25s ease;
55
  }
56
 
57
- .message.user:hover {
58
- transform: translateY(-2px);
59
- box-shadow: 0 10px 30px rgba(226, 0, 116, 0.5);
 
 
60
  }
61
 
62
- /* BOT MESSAGE */
63
  .message.bot {
64
- background: rgba(255, 255, 255, 0.06);
65
- color: white;
66
- border-radius: 16px;
67
- padding: 12px;
68
- border-left: 3px solid #E20074;
69
- transition: 0.25s ease;
70
  }
71
 
72
- .message.bot:hover {
73
- transform: translateY(-2px);
74
- }
75
-
76
- /* INPUT BOX */
77
  textarea {
78
- background: rgba(255,255,255,0.05) !important;
79
- border: 1px solid rgba(226, 0, 116, 0.3) !important;
80
- border-radius: 12px !important;
81
- color: white !important;
82
- padding: 12px !important;
83
  }
84
 
85
- /* BUTTONS */
86
  button {
87
- background: #E20074 !important;
88
  color: white !important;
89
- border-radius: 10px !important;
 
90
  border: none !important;
91
- font-weight: 600;
92
- transition: all 0.3s ease;
93
  }
94
 
95
  button:hover {
96
- background: #ff2d9a !important;
97
- transform: translateY(-2px);
98
- box-shadow: 0 10px 25px rgba(226, 0, 116, 0.4);
99
- }
100
-
101
- /* INPUT FOCUS EFFECT */
102
- textarea:focus {
103
- outline: none !important;
104
- border: 1px solid #E20074 !important;
105
- box-shadow: 0 0 15px rgba(226, 0, 116, 0.4);
106
- }
107
-
108
- /* Card style panels (future UI elements) */
109
- .card {
110
- background: rgba(28, 28, 37, 0.7);
111
- border: 1px solid rgba(226, 0, 116, 0.2);
112
- border-radius: 16px;
113
- padding: 15px;
114
- transition: 0.3s;
115
- }
116
-
117
- .card:hover {
118
- transform: scale(1.02);
119
- box-shadow: 0 10px 30px rgba(0,0,0,0.4);
120
- }
121
-
122
- /* Scrollbar */
123
- ::-webkit-scrollbar {
124
- width: 8px;
125
- }
126
-
127
- ::-webkit-scrollbar-thumb {
128
- background: #E20074;
129
- border-radius: 10px;
130
  }
131
  """
132
 
133
-
134
  # Globals (shared state in Gradio)
135
  embed_model = SentenceTransformer("all-MiniLM-L6-v2")
136
  index = None
 
6
  from openai import OpenAI
7
  from pypdf import PdfReader
8
  from sentence_transformers import SentenceTransformer
9
+
10
  css = """
11
 
12
  /* =========================
13
+ TELEKOM CORPORATE THEME (Clean & Professional)
 
14
  ========================= */
15
 
16
+ :root {
17
+ --telekom-magenta: #E20074;
18
+ --bg-color: #F4F4F6;
19
+ --text-color: #333333;
20
+ --surface: #FFFFFF;
21
+ }
22
 
23
+ /* Background */
24
  body {
25
+ background-color: var(--bg-color);
26
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
27
+ color: var(--text-color);
28
  }
29
 
30
+ /* Main Container */
31
  .gradio-container {
32
+ max-width: 1000px !important;
33
+ background: var(--surface);
34
+ border-radius: 8px;
35
+ box-shadow: 0 4px 12px rgba(0,0,0,0.08);
36
+ padding: 40px !important;
37
+ margin-top: 20px;
38
  }
39
 
40
+ /* Typography */
41
  h1, h2, h3 {
42
+ color: var(--text-color);
43
+ font-weight: 600;
 
44
  }
45
 
46
+ /* Primary Action Colors */
47
+ h1 span { color: var(--telekom-magenta); }
 
 
 
 
 
 
48
 
49
+ /* Chatbot Area */
50
+ .gradio-chatbot {
51
+ border: 1px solid #E0E0E0 !important;
52
+ background: transparent !important;
53
+ border-radius: 4px !important;
 
 
 
54
  }
55
 
56
+ /* Message Bubbles */
57
+ .message.user {
58
+ background: var(--telekom-magenta) !important;
59
+ color: white !important;
60
+ border-radius: 4px !important;
61
  }
62
 
 
63
  .message.bot {
64
+ background: #EEEEEE !important;
65
+ color: #333333 !important;
66
+ border-radius: 4px !important;
67
+ border-left: 4px solid var(--telekom-magenta) !important;
 
 
68
  }
69
 
70
+ /* Input Box */
 
 
 
 
71
  textarea {
72
+ border: 1px solid #CCCCCC !important;
73
+ border-radius: 4px !important;
74
+ padding: 10px !important;
 
 
75
  }
76
 
77
+ /* Buttons */
78
  button {
79
+ background: var(--telekom-magenta) !important;
80
  color: white !important;
81
+ border-radius: 4px !important;
82
+ font-weight: 600 !important;
83
  border: none !important;
84
+ transition: background 0.3s ease;
 
85
  }
86
 
87
  button:hover {
88
+ background: #c20063 !important;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
89
  }
90
  """
91
 
 
92
  # Globals (shared state in Gradio)
93
  embed_model = SentenceTransformer("all-MiniLM-L6-v2")
94
  index = None