from vizro import Vizro
import vizro.models as vm
justify_options = [
"start",
"end",
"center",
"between",
"around",
"evenly",
]
class Flex(vm.Flex):
justify: str
def build(self):
flex = super().build()
if self.justify:
flex.className += f" justify-content-{self.justify}"
return flex
page = vm.Page(
title="Different justification option",
layout=vm.Flex(direction="column"),
components = [
vm.Container(
layout=Flex(direction="row", justify=justify),
title=justify,
components=[vm.Card(text="some text")] * 5
)
for justify in justify_options
]
)
dashboard = vm.Dashboard(pages=[page])
Vizro().build(dashboard).run()