Py.Cafe

vizro-official/

flex-items-cards-width

Cards with set width inside Flex

DocsPricing
  • assets/
  • app.py
  • requirements.txt
app.py
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
# Vizro is an open-source toolkit for creating modular data visualization applications.
# check out https://github.com/mckinsey/vizro for more info about Vizro
# and checkout https://vizro.readthedocs.io/en/stable/ for documentation.

import vizro.models as vm
from vizro import Vizro

page = vm.Page(
    id="page-with-uniform-flex-items",
    title="Change the width via CSS",
    layout=vm.Flex(direction="row", wrap=True),
    components=[
        vm.Card(
            text="""
               # Lorem Ipsum

               Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sed elementum ligula.
               In ultricies est ac mauris vehicula fermentum. Curabitur faucibus elementum lectus.
               Name ut ipsum tortor. Praesent ut nulla risus. Praesent in dignissim nulla.
           """
        )
        for i in range(12)
    ],
)

dashboard = vm.Dashboard(pages=[page])
Vizro().build(dashboard).run()