asthaa30 commited on
Commit
e61734a
·
verified ·
1 Parent(s): 2faa0b2

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +69 -29
app.py CHANGED
@@ -11,39 +11,80 @@ MODEL = "nomiChroma3.1"
11
 
12
  client = InferenceClient("HuggingFaceH4/zephyr-7b-beta")
13
 
14
- # Custom CSS for dark theme and modern aesthetics
15
  custom_css = """
16
  body {
17
- background-color: #1f1f1f;
18
  color: #e0e0e0;
19
- font-family: 'Arial', sans-serif;
 
 
20
  }
21
- .gr-button {
22
- background-color: #4A4A4A !important;
23
- border: 1px solid #333 !important;
24
- color: #ffffff !important;
 
 
 
25
  }
26
- .gr-button:hover {
27
- background-color: #3a3a3a !important;
28
- border-color: #555 !important;
29
  }
30
- .gr-textbox {
31
- border-color: #555 !important;
 
 
32
  color: #ffffff !important;
 
 
 
 
33
  }
34
- .gr-slider {
35
- color: #ffffff !important;
36
  }
37
- .gr-textbox textarea {
38
- background-color: #333 !important;
39
- color: #ffffff !important;
 
 
 
 
 
 
 
 
 
 
40
  }
41
- .gr-slider input[type=range] {
42
- background-color: #4A4A4A !important;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
43
  }
44
- .gr-box {
45
- background-color: #292929 !important;
46
- border-color: #444 !important;
47
  }
48
  """
49
 
@@ -87,24 +128,23 @@ demo = gr.ChatInterface(
87
  value="You are a maritime legal assistant with expertise strictly in Indian maritime law. Provide detailed legal advice and information based on Indian maritime legal principles and regulations.",
88
  label="System message",
89
  placeholder="Enter system instructions...",
90
- elem_classes="custom-textbox"
 
91
  ),
92
- gr.Slider(minimum=1, maximum=2048, value=512, step=1, label="Max new tokens", elem_classes="custom-slider"),
93
- gr.Slider(minimum=0.1, maximum=4.0, value=0.7, step=0.1, label="Temperature", elem_classes="custom-slider"),
94
  gr.Slider(
95
  minimum=0.1,
96
  maximum=1.0,
97
  value=0.95,
98
  step=0.05,
99
- label="Top-p (nucleus sampling)",
100
- elem_classes="custom-slider"
101
  ),
102
  ],
103
  theme="dark",
104
  title="Maritime Legal Compliance",
105
  description="This chatbot uses the fine-tuned Llama 3.1 model to provide legal advice on maritime law with a focus on Indian maritime regulations.",
106
- css=custom_css,
107
- elem_classes="custom-container"
108
  )
109
 
110
  if __name__ == "__main__":
 
11
 
12
  client = InferenceClient("HuggingFaceH4/zephyr-7b-beta")
13
 
14
+ # Custom CSS for modern dark theme
15
  custom_css = """
16
  body {
17
+ background-color: #121212;
18
  color: #e0e0e0;
19
+ font-family: 'Roboto', sans-serif;
20
+ margin: 0;
21
+ padding: 0;
22
  }
23
+ .gradio-container {
24
+ background-color: #1e1e1e !important;
25
+ border-radius: 12px;
26
+ box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
27
+ padding: 20px;
28
+ max-width: 900px;
29
+ margin: 40px auto;
30
  }
31
+ .gradio-container .gr-inputs {
32
+ margin-bottom: 20px;
 
33
  }
34
+ .gradio-container .gr-button {
35
+ background-color: #3b3b3b !important;
36
+ border: none;
37
+ border-radius: 8px;
38
  color: #ffffff !important;
39
+ font-size: 15px;
40
+ font-weight: bold;
41
+ padding: 10px 20px;
42
+ transition: background-color 0.3s ease;
43
  }
44
+ .gradio-container .gr-button:hover {
45
+ background-color: #575757 !important;
46
  }
47
+ .gradio-container .gr-textbox textarea {
48
+ background-color: #2a2a2a !important;
49
+ color: #e0e0e0 !important;
50
+ border: 1px solid #555 !important;
51
+ border-radius: 8px;
52
+ padding: 10px;
53
+ transition: border-color 0.3s ease;
54
+ }
55
+ .gradio-container .gr-textbox textarea:focus {
56
+ border-color: #007bff !important;
57
+ }
58
+ .gradio-container .gr-slider {
59
+ margin: 10px 0;
60
  }
61
+ .gradio-container .gr-slider .gr-slider-container {
62
+ background-color: #2a2a2a !important;
63
+ border-radius: 12px;
64
+ padding: 10px;
65
+ }
66
+ .gradio-container .gr-slider .gr-slider-value {
67
+ background-color: #007bff !important;
68
+ border-radius: 8px;
69
+ height: 6px;
70
+ }
71
+ .gradio-container .gr-chat-box {
72
+ border: 1px solid #2a2a2a !important;
73
+ border-radius: 12px;
74
+ padding: 20px;
75
+ background-color: #2a2a2a !important;
76
+ }
77
+ .gradio-container .gr-chat-box .gr-chat-bubble {
78
+ border-radius: 8px;
79
+ padding: 10px;
80
+ }
81
+ .gradio-container .gr-chat-box .gr-chat-bubble-user {
82
+ background-color: #007bff !important;
83
+ color: #ffffff !important;
84
  }
85
+ .gradio-container .gr-chat-box .gr-chat-bubble-assistant {
86
+ background-color: #333333 !important;
87
+ color: #e0e0e0 !important;
88
  }
89
  """
90
 
 
128
  value="You are a maritime legal assistant with expertise strictly in Indian maritime law. Provide detailed legal advice and information based on Indian maritime legal principles and regulations.",
129
  label="System message",
130
  placeholder="Enter system instructions...",
131
+ lines=3,
132
+ max_lines=5
133
  ),
134
+ gr.Slider(minimum=1, maximum=2048, value=512, step=1, label="Max new tokens"),
135
+ gr.Slider(minimum=0.1, maximum=4.0, value=0.7, step=0.1, label="Temperature"),
136
  gr.Slider(
137
  minimum=0.1,
138
  maximum=1.0,
139
  value=0.95,
140
  step=0.05,
141
+ label="Top-p (nucleus sampling)"
 
142
  ),
143
  ],
144
  theme="dark",
145
  title="Maritime Legal Compliance",
146
  description="This chatbot uses the fine-tuned Llama 3.1 model to provide legal advice on maritime law with a focus on Indian maritime regulations.",
147
+ css=custom_css
 
148
  )
149
 
150
  if __name__ == "__main__":