|
@@ -130,17 +130,20 @@ async def index_page(client: Client):
|
|
|
.style('font-size: 300%; font-weight: 500; margin-top: -20px')
|
|
|
with ui.row().classes('w-full no-wrap text-lg leading-tight justify-between q-mb-xl'):
|
|
|
with ui.column().classes('gap-1 col-3'):
|
|
|
+ ui.icon('swap_horiz').classes('text-5xl q-mb-md text-primary opacity-80')
|
|
|
ui.label('Interaction').classes('text-bold mb-4')
|
|
|
ui.markdown('- buttons, checkboxes, switches, slider, input, ...')
|
|
|
ui.markdown('- notifications, dialogs and menus')
|
|
|
ui.markdown('- keyboard input')
|
|
|
ui.markdown('- on-screen joystick')
|
|
|
with ui.column().classes('gap-1 col-3'):
|
|
|
+ ui.icon('space_dashboard').classes('text-5xl q-mb-md text-primary opacity-80')
|
|
|
ui.label('Layouting').classes('text-bold mb-4')
|
|
|
ui.markdown('- navigation bars, tabs, panels, ...')
|
|
|
ui.markdown('- grouping with rows, columns and cards')
|
|
|
ui.markdown('- HTML and markdown elements')
|
|
|
with ui.column().classes('gap-1 col-3'):
|
|
|
+ ui.icon('insights').classes('text-5xl q-mb-md text-primary')
|
|
|
ui.label('Visualization').classes('text-bold mb-4')
|
|
|
ui.markdown('- charts, diagrams and tables')
|
|
|
ui.markdown('- 3D scenes')
|
|
@@ -148,17 +151,20 @@ async def index_page(client: Client):
|
|
|
ui.markdown('- built-in timer for data refresh')
|
|
|
with ui.row().classes('w-full no-wrap text-lg leading-tight justify-between'):
|
|
|
with ui.column().classes('gap-1 col-3'):
|
|
|
+ ui.icon('brush').classes('text-5xl q-mb-xs text-primary opacity-80')
|
|
|
ui.label('Styling').classes('text-bold mb-4')
|
|
|
ui.markdown('- customizable color themes')
|
|
|
ui.markdown('- add custom css and classes')
|
|
|
ui.markdown('- flex layout by default')
|
|
|
with ui.column().classes('gap-1 col-3'):
|
|
|
+ ui.icon('source').classes('text-5xl q-mb-md text-primary opacity-80')
|
|
|
ui.label('Coding').classes('text-bold mb-4')
|
|
|
ui.markdown('- live-cycle events')
|
|
|
ui.markdown('- implicit reload on code change')
|
|
|
ui.markdown('- straight-forward data binding')
|
|
|
ui.markdown('- execute javascript from Python')
|
|
|
with ui.column().classes('gap-1 col-3'):
|
|
|
+ ui.icon('anchor').classes('text-5xl q-mb-md text-primary opacity-80')
|
|
|
ui.label('Foundation').classes('text-bold mb-4')
|
|
|
ui.markdown('- generic Vue to Python bridge')
|
|
|
ui.markdown('- dynamic GUI through Quasar')
|