Iisakki Rotko commited on
Commit
06e15bc
1 Parent(s): edfa8ce

feat: mobile styling

Browse files
Files changed (1) hide show
  1. wanderlust.py +38 -13
wanderlust.py CHANGED
@@ -204,12 +204,6 @@ def ChatInterface():
204
  solara.use_effect(handle_initial, [])
205
  # result = solara.use_thread(ask, dependencies=[messages.value])
206
  with solara.Column(
207
- style={
208
- "height": "100%",
209
- "width": "38vw",
210
- "justify-content": "center",
211
- "background": "linear-gradient(0deg, transparent 75%, white 100%);",
212
- },
213
  classes=["chat-interface"],
214
  ):
215
  if len(messages.value) > 0:
@@ -294,11 +288,7 @@ def Page():
294
  reset_ui()
295
 
296
  with solara.Column(
297
- style={
298
- "height": "95vh",
299
- "justify-content": "center",
300
- "padding": "45px 50px 75px 50px",
301
- },
302
  gap="5vh",
303
  ):
304
  with solara.Row(justify="space-between"):
@@ -313,9 +303,11 @@ def Page():
313
  # solara.Button("Save", on_click=save)
314
  # solara.Button("Load", on_click=load)
315
  # solara.Button("Soft reset", on_click=reset_ui)
316
- with solara.Row(justify="space-between", style={"flex-grow": "1"}):
 
 
317
  ChatInterface().key(f"chat-{reset_counter}")
318
- with solara.Column(style={"width": "50vw", "justify-content": "center"}):
319
  Map() # .key(f"map-{reset_counter}")
320
 
321
  solara.Style(
@@ -334,5 +326,38 @@ def Page():
334
  align-items: center;
335
  column-gap: 0.5rem;
336
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
337
  """
338
  )
 
204
  solara.use_effect(handle_initial, [])
205
  # result = solara.use_thread(ask, dependencies=[messages.value])
206
  with solara.Column(
 
 
 
 
 
 
207
  classes=["chat-interface"],
208
  ):
209
  if len(messages.value) > 0:
 
288
  reset_ui()
289
 
290
  with solara.Column(
291
+ classes=["ui-container"],
 
 
 
 
292
  gap="5vh",
293
  ):
294
  with solara.Row(justify="space-between"):
 
303
  # solara.Button("Save", on_click=save)
304
  # solara.Button("Load", on_click=load)
305
  # solara.Button("Soft reset", on_click=reset_ui)
306
+ with solara.Row(
307
+ justify="space-between", style={"flex-grow": "1"}, classes=["container-row"]
308
+ ):
309
  ChatInterface().key(f"chat-{reset_counter}")
310
+ with solara.Column(classes=["map-container"]):
311
  Map() # .key(f"map-{reset_counter}")
312
 
313
  solara.Style(
 
326
  align-items: center;
327
  column-gap: 0.5rem;
328
  }
329
+ .ui-container{
330
+ height: 95vh;
331
+ justify-content: center;
332
+ padding: 45px 50px 75px 50px;
333
+ }
334
+ .chat-interface{
335
+ height: 100%;
336
+ width: 38vw;
337
+ justify-content: center;
338
+ background: linear-gradient(0deg, transparent 75%, white 100%);
339
+ }
340
+ .map-container{
341
+ width: 50vw;
342
+ height: 100%;
343
+ justify-content: center;
344
+ }
345
+ @media screen and (max-aspect-ratio: 1/1) {
346
+ .ui-container{
347
+ padding: 30px;
348
+ height: 100vh;
349
+ }
350
+ .container-row{
351
+ flex-direction: column-reverse !important;
352
+ width: 100% !important;
353
+ }
354
+ .chat-interface{
355
+ width: unset;
356
+ justify-content: flex-end;
357
+ }
358
+ .map-container{
359
+ width: unset;
360
+ }
361
+ }
362
  """
363
  )