alperugurcan commited on
Commit
405528f
·
verified ·
1 Parent(s): 1e4c6d3

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +20 -8
app.py CHANGED
@@ -82,18 +82,19 @@ def create_ui():
82
 
83
  state = gr.State({"game_over": False})
84
 
85
- with gr.Row():
86
- # Add column buttons at the top
87
- buttons = [gr.Button(str(i)) for i in range(7)]
88
 
89
- # Board display below the buttons
90
  board = gr.Dataframe(
91
  value=format_board(initialize_game()),
92
  interactive=False,
93
  show_label=False,
94
- headers=None,
95
  wrap=True,
96
- elem_id="board"
 
 
 
97
  )
98
 
99
  message = gr.Textbox(value="Your turn!", label="Status")
@@ -121,13 +122,24 @@ def create_ui():
121
  css = """
122
  #board {
123
  max-width: 400px;
124
- margin: 0 auto;
125
  }
126
  #board td {
127
  text-align: center;
128
- font-size: 24px;
129
  padding: 8px;
130
  }
 
 
 
 
 
 
 
 
 
 
 
131
  """
132
 
133
  demo = create_ui()
 
82
 
83
  state = gr.State({"game_over": False})
84
 
85
+ with gr.Row(elem_classes="button-row"):
86
+ buttons = [gr.Button(str(i), size="sm") for i in range(7)]
 
87
 
 
88
  board = gr.Dataframe(
89
  value=format_board(initialize_game()),
90
  interactive=False,
91
  show_label=False,
92
+ headers=False,
93
  wrap=True,
94
+ elem_id="board",
95
+ height=300,
96
+ max_rows=6,
97
+ column_count=7
98
  )
99
 
100
  message = gr.Textbox(value="Your turn!", label="Status")
 
122
  css = """
123
  #board {
124
  max-width: 400px;
125
+ margin: 20px auto;
126
  }
127
  #board td {
128
  text-align: center;
129
+ font-size: 32px;
130
  padding: 8px;
131
  }
132
+ .button-row {
133
+ max-width: 400px;
134
+ margin: 0 auto;
135
+ display: flex;
136
+ justify-content: space-between;
137
+ gap: 10px;
138
+ }
139
+ .button-row button {
140
+ flex: 1;
141
+ min-width: 40px;
142
+ }
143
  """
144
 
145
  demo = create_ui()