karrrr123456 commited on
Commit
a27bd89
·
verified ·
1 Parent(s): 9a901c4

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +22 -28
app.py CHANGED
@@ -30,27 +30,32 @@ def respond(message, history, system_message, max_tokens, temperature, top_p):
30
 
31
  # ChatGPT-style UI with modern styling
32
  css = """
 
 
 
 
 
33
  .gradio-container {
34
  max-width: 900px;
35
  margin: auto;
36
- background-color: #121212;
37
- color: white;
38
  }
39
  .chat-container {
40
  display: flex;
41
  flex-direction: column;
42
- height: 85vh;
43
- overflow: hidden;
44
  padding: 20px;
45
  border-radius: 10px;
46
  background: #1E1E1E;
47
  }
48
  .chat-message {
49
  max-width: 75%;
50
- padding: 10px;
51
- margin-bottom: 10px;
52
  border-radius: 10px;
53
  font-size: 16px;
 
54
  }
55
  .user-message {
56
  background-color: #007AFF;
@@ -66,39 +71,28 @@ css = """
66
  border: none;
67
  color: white;
68
  border-radius: 8px;
69
- padding: 10px;
70
  font-size: 16px;
 
 
 
 
 
 
 
71
  }
72
  """
73
 
74
  with gr.Blocks(css=css) as demo:
75
  gr.Markdown("""
76
  <h1 style='text-align: center; color: #FFFFFF;'>💬 AI Chat Assistant</h1>
77
- <p style='text-align: center;'>A sleek and interactive chatbot experience.</p>
78
  """)
79
 
80
- with gr.Row():
81
- system_message = gr.Textbox(
82
- value="You are a helpful and intelligent assistant.",
83
- label="System Message",
84
- interactive=True,
85
- show_label=False,
86
- )
87
-
88
- with gr.Row():
89
- max_tokens = gr.Slider(
90
- minimum=1, maximum=2048, value=512, step=1, label="Max Tokens"
91
- )
92
- temperature = gr.Slider(
93
- minimum=0.1, maximum=4.0, value=0.7, step=0.1, label="Temperature"
94
- )
95
- top_p = gr.Slider(
96
- minimum=0.1, maximum=1.0, value=0.95, step=0.05, label="Top-p"
97
- )
98
-
99
  chatbot = gr.ChatInterface(
100
  respond,
101
- additional_inputs=[system_message, max_tokens, temperature, top_p]
 
102
  )
103
 
104
  demo.launch()
 
30
 
31
  # ChatGPT-style UI with modern styling
32
  css = """
33
+ body {
34
+ background-color: #121212;
35
+ color: white;
36
+ font-family: Arial, sans-serif;
37
+ }
38
  .gradio-container {
39
  max-width: 900px;
40
  margin: auto;
41
+ padding: 20px;
 
42
  }
43
  .chat-container {
44
  display: flex;
45
  flex-direction: column;
46
+ height: 80vh;
47
+ overflow-y: auto;
48
  padding: 20px;
49
  border-radius: 10px;
50
  background: #1E1E1E;
51
  }
52
  .chat-message {
53
  max-width: 75%;
54
+ padding: 12px 16px;
55
+ margin: 8px 0;
56
  border-radius: 10px;
57
  font-size: 16px;
58
+ display: inline-block;
59
  }
60
  .user-message {
61
  background-color: #007AFF;
 
71
  border: none;
72
  color: white;
73
  border-radius: 8px;
74
+ padding: 12px;
75
  font-size: 16px;
76
+ width: 100%;
77
+ }
78
+ .controls {
79
+ display: flex;
80
+ justify-content: center;
81
+ gap: 10px;
82
+ margin-top: 10px;
83
  }
84
  """
85
 
86
  with gr.Blocks(css=css) as demo:
87
  gr.Markdown("""
88
  <h1 style='text-align: center; color: #FFFFFF;'>💬 AI Chat Assistant</h1>
89
+ <p style='text-align: center;'>A sleek, modern chatbot experience.</p>
90
  """)
91
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
92
  chatbot = gr.ChatInterface(
93
  respond,
94
+ additional_inputs=[],
95
+ textbox=gr.Textbox(placeholder="Type a message...", lines=1, interactive=True, elem_classes="input-box"),
96
  )
97
 
98
  demo.launch()