KHUjongseo commited on
Commit
4e5d32e
·
1 Parent(s): 1eb73db
Files changed (1) hide show
  1. app.py +36 -4
app.py CHANGED
@@ -62,7 +62,24 @@ def replay(state):
62
  css = """
63
  h1 {
64
  text-align: center;
65
- display:Column;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
66
  }
67
  """
68
 
@@ -87,7 +104,22 @@ with gr.Blocks() as demo:
87
  resize: none;
88
  overflow: hidden;
89
  }
 
 
 
 
 
 
 
 
 
 
 
90
 
 
 
 
 
91
  </style>''')
92
  with gr.Tabs():
93
  with gr.Tab(" Question 1"):
@@ -168,8 +200,8 @@ with gr.Blocks() as demo:
168
  # gr.Image("assets/ex2.png")
169
  # gr.Markdown("# Q1. Which explanation was easier to understand?")
170
  # q1_choice = gr.Radio(["Explanation A", "Explanation B"])
171
- gr.Markdown("## Q1. Which explanation was easier to understand?")
172
-
173
  q1_choice = gr.Radio(
174
  [
175
  "A was *much easier* to understand",
@@ -179,8 +211,8 @@ with gr.Blocks() as demo:
179
  "B was *much easier* to understand",
180
  ],
181
  label="",
182
- info="Consider which explanation helped you understand the model's decision better.",
183
  show_label=False,
 
184
  )
185
  # q1_choice= func.convert_q1_choice(q1_choice)
186
  q1_feedback = gr.Textbox(placeholder="e.g., Explanation A was clearer")
 
62
  css = """
63
  h1 {
64
  text-align: center;
65
+ margin-top: 20px;
66
+ }
67
+
68
+ .q1-radio-large .gr-radio label {
69
+ font-size: 20px;
70
+ line-height: 1.8;
71
+ margin: 8px 0;
72
+ padding: 12px;
73
+ display: block;
74
+ border: 1px solid #ccc;
75
+ border-radius: 10px;
76
+ background-color: #f5f5f5;
77
+ transition: all 0.2s ease;
78
+ }
79
+
80
+ .q1-radio-large .gr-radio input:checked + label {
81
+ border-color: #333;
82
+ background-color: #e0e0e0;
83
  }
84
  """
85
 
 
104
  resize: none;
105
  overflow: hidden;
106
  }
107
+ #q1_radio_box label {
108
+ font-size: 20px;
109
+ line-height: 1.8;
110
+ margin: 8px 0;
111
+ padding: 12px;
112
+ display: block;
113
+ border: 1px solid #ccc;
114
+ border-radius: 10px;
115
+ background-color: #f5f5f5;
116
+ transition: all 0.2s ease;
117
+ }
118
 
119
+ #q1_radio_box input:checked + label {
120
+ border-color: #333;
121
+ background-color: #e0e0e0;
122
+ }
123
  </style>''')
124
  with gr.Tabs():
125
  with gr.Tab(" Question 1"):
 
200
  # gr.Image("assets/ex2.png")
201
  # gr.Markdown("# Q1. Which explanation was easier to understand?")
202
  # q1_choice = gr.Radio(["Explanation A", "Explanation B"])
203
+ gr.Markdown("# Q1. Which explanation was easier to understand?<br>")
204
+ gr.Markdown("## Consider which explanation helped you understand the model's decision better.")
205
  q1_choice = gr.Radio(
206
  [
207
  "A was *much easier* to understand",
 
211
  "B was *much easier* to understand",
212
  ],
213
  label="",
 
214
  show_label=False,
215
+ elem_id="q1_radio_box"
216
  )
217
  # q1_choice= func.convert_q1_choice(q1_choice)
218
  q1_feedback = gr.Textbox(placeholder="e.g., Explanation A was clearer")