manuelcillero/pagetop
manuelcillero/pagetop
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

🐛 (examples): Corrige ejemplo en intro-flex

Browse source 
- El segundo Container anidado con `push_end()` no se justificaba contra
  el ancho completo. Ahora es un único Container con Flex, con
  `push_end()` sobre el elemento "Perfil".
- `caption()` acepta Lc también para el fragmento de código, y la
  descripción del ejemplo pasa a ser una traducción Fluent.
This commit is contained in:
Manuel Cillero 2026-09-05 06:22:58 +02:00
parent ab1d4f0efb
commit 5939d33964
3 changed files with 39 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

65
examples/intro-flex.rs
View file

@ -59,7 +59,7 @@ fn direction_block() -> Block {
]; ];
for (title_key, flex, code) in direction_variants { for (title_key, flex, code) in direction_variants {
block = block block = block
.with_child(caption(Lc::t(title_key, &LOC), code)) .with_child(caption(Lc::t(title_key, &LOC), Lc::n(code)))
.with_child( .with_child(
demo_row(flex) demo_row(flex)
.with_child(demo_box(flex_item("1"))) .with_child(demo_box(flex_item("1")))
@ -107,7 +107,7 @@ fn justify_block() -> Block {
]; ];
for (title_key, justify, code) in justify_variants { for (title_key, justify, code) in justify_variants {
block = block block = block
.with_child(caption(Lc::t(title_key, &LOC), code)) .with_child(caption(Lc::t(title_key, &LOC), Lc::n(code)))
.with_child( .with_child(
demo_row( demo_row(
Flex::row() Flex::row()
@ -149,7 +149,7 @@ fn align_block() -> Block {
]; ];
for (title_key, align, code) in align_variants { for (title_key, align, code) in align_variants {
block = block block = block
.with_child(caption(Lc::t(title_key, &LOC), code)) .with_child(caption(Lc::t(title_key, &LOC), Lc::n(code)))
.with_child( .with_child(
demo_row( demo_row(
Flex::row() Flex::row()
@ -164,7 +164,7 @@ fn align_block() -> Block {
block block
.with_child(caption( .with_child(caption(
Lc::t("flex_title_align_baseline", &LOC), Lc::t("flex_title_align_baseline", &LOC),
"Flex::row().with_align(Align::Baseline)", Lc::n("Flex::row().with_align(Align::Baseline)"),
)) ))
.with_child( .with_child(
demo_row( demo_row(
@ -208,7 +208,7 @@ fn align_self_block() -> Block {
]; ];
for (title_key, align_self, code) in align_self_variants { for (title_key, align_self, code) in align_self_variants {
block = block block = block
.with_child(caption(Lc::t(title_key, &LOC), code)) .with_child(caption(Lc::t(title_key, &LOC), Lc::n(code)))
.with_child( .with_child(
demo_row( demo_row(
Flex::row() Flex::row()
@ -225,7 +225,7 @@ fn align_self_block() -> Block {
block block
.with_child(caption( .with_child(caption(
Lc::t("flex_title_align_self_baseline", &LOC), Lc::t("flex_title_align_self_baseline", &LOC),
"FlexItem::new().with_align_self(flex::ItemAlign::Baseline)", Lc::n("FlexItem::new().with_align_self(flex::ItemAlign::Baseline)"),
)) ))
.with_child( .with_child(
demo_row( demo_row(
@ -300,7 +300,7 @@ fn align_content_block() -> Block {
); );
} }
block = block block = block
.with_child(caption(Lc::t(title_key, &LOC), code)) .with_child(caption(Lc::t(title_key, &LOC), Lc::n(code)))
.with_child(row); .with_child(row);
} }
block block
@ -311,7 +311,7 @@ fn grow_shrink_block() -> Block {
.with_title(Lc::t("flex_block_title_grow_shrink", &LOC)) .with_title(Lc::t("flex_block_title_grow_shrink", &LOC))
.with_child(caption( .with_child(caption(
Lc::t("flex_title_grow", &LOC), Lc::t("flex_title_grow", &LOC),
"FlexItem::new().with_grow(flex::ItemGrow::Is1)", Lc::n("FlexItem::new().with_grow(flex::ItemGrow::Is1)"),
)) ))
.with_child( .with_child(
demo_row(Flex::row().with_gap(flex::Gap::Both(UnitValue::RelRem(0.5)))) demo_row(Flex::row().with_gap(flex::Gap::Both(UnitValue::RelRem(0.5))))
@ -325,7 +325,7 @@ fn grow_shrink_block() -> Block {
) )
.with_child(caption( .with_child(caption(
Lc::t("flex_title_shrink", &LOC), Lc::t("flex_title_shrink", &LOC),
"FlexItem::new().with_shrink(flex::ItemShrink::Is0)", Lc::n("FlexItem::new().with_shrink(flex::ItemShrink::Is0)"),
)) ))
.with_child( .with_child(
demo_row(Flex::row().with_gap(flex::Gap::Both(UnitValue::RelRem(0.5)))) demo_row(Flex::row().with_gap(flex::Gap::Both(UnitValue::RelRem(0.5))))
@ -352,7 +352,7 @@ fn other_block() -> Block {
block = block block = block
.with_child(caption( .with_child(caption(
Lc::t("flex_title_push_end", &LOC), Lc::t("flex_title_push_end", &LOC),
"FlexItem::push_end()", Lc::n("FlexItem::push_end()"),
)) ))
.with_child( .with_child(
demo_row(Flex::row().with_gap(flex::Gap::Both(UnitValue::RelRem(0.5)))) demo_row(Flex::row().with_gap(flex::Gap::Both(UnitValue::RelRem(0.5))))
@ -378,12 +378,16 @@ fn other_block() -> Block {
block block
.with_child(caption( .with_child(caption(
Lc::t("flex_title_wrap", &LOC), Lc::t("flex_title_wrap", &LOC),
"Flex::row().with_wrap(Behavior::Wrap).with_align_content(AlignContent::SpaceBetween)", Lc::n(concat!(
"Flex::row()",
".with_wrap(Behavior::Wrap)",
".with_align_content(AlignContent::SpaceBetween)",
)),
)) ))
.with_child(wrap_row) .with_child(wrap_row)
.with_child(caption( .with_child(caption(
Lc::t("flex_title_order", &LOC), Lc::t("flex_title_order", &LOC),
"FlexItem::new().with_order(ItemOrder::First) / .with_order(ItemOrder::Last)", Lc::n("FlexItem::new().with_order(ItemOrder::First) / .with_order(ItemOrder::Last)"),
)) ))
.with_child( .with_child(
demo_row(Flex::row().with_gap(flex::Gap::Both(UnitValue::RelRem(0.5)))) demo_row(Flex::row().with_gap(flex::Gap::Both(UnitValue::RelRem(0.5))))
@ -399,7 +403,7 @@ fn other_block() -> Block {
) )
.with_child(caption( .with_child(caption(
Lc::t("flex_title_gap_none", &LOC), Lc::t("flex_title_gap_none", &LOC),
"Flex::row() (Gap::None por defecto)", Lc::n("Flex::row() (Gap::None por defecto)"),
)) ))
.with_child( .with_child(
demo_row(Flex::row()) demo_row(Flex::row())
@ -409,7 +413,7 @@ fn other_block() -> Block {
) )
.with_child(caption( .with_child(caption(
Lc::t("flex_title_gap_some", &LOC), Lc::t("flex_title_gap_some", &LOC),
"Flex::row().with_gap(flex::Gap::Both(UnitValue::RelRem(1.5)))", Lc::n("Flex::row().with_gap(flex::Gap::Both(UnitValue::RelRem(1.5)))"),
)) ))
.with_child( .with_child(
demo_row(Flex::row().with_gap(flex::Gap::Both(UnitValue::RelRem(1.5)))) demo_row(Flex::row().with_gap(flex::Gap::Both(UnitValue::RelRem(1.5))))
@ -419,7 +423,7 @@ fn other_block() -> Block {
) )
.with_child(caption( .with_child(caption(
Lc::t("flex_title_grid_thirds", &LOC), Lc::t("flex_title_grid_thirds", &LOC),
"FlexItem::new().with_size(flex::ItemSize::Percent33)", Lc::n("FlexItem::new().with_size(flex::ItemSize::Percent33)"),
)) ))
.with_child( .with_child(
demo_row(Flex::row()) demo_row(Flex::row())
@ -435,7 +439,11 @@ fn other_block() -> Block {
) )
.with_child(caption( .with_child(caption(
Lc::t("flex_title_grid_offset", &LOC), Lc::t("flex_title_grid_offset", &LOC),
"FlexItem::new().with_size(ItemSize::Percent50).with_offset(ItemOffset::Percent25)", Lc::n(concat!(
"FlexItem::new()",
".with_size(ItemSize::Percent50)",
".with_offset(ItemOffset::Percent25)",
)),
)) ))
.with_child( .with_child(
demo_row(Flex::row()).with_child( demo_row(Flex::row()).with_child(
@ -448,24 +456,19 @@ fn other_block() -> Block {
) )
.with_child(caption( .with_child(caption(
Lc::t("flex_title_toolbar", &LOC), Lc::t("flex_title_toolbar", &LOC),
"Container con Flex anidado dentro de otro Container con Flex, y push_end()", Lc::t("flex_desc_toolbar", &LOC),
)) ))
.with_child( .with_child(
demo_row(Flex::row().with_align(flex::Align::Center)) demo_row(
.with_child( Flex::row()
Container::new() .with_align(flex::Align::Center)
.with_flex(Flex::row().with_gap(flex::Gap::Both(UnitValue::RelRem(0.5)))) .with_gap(flex::Gap::Both(UnitValue::RelRem(0.5))),
)
.with_child(demo_box(Lc::t("flex_box_file", &LOC))) .with_child(demo_box(Lc::t("flex_box_file", &LOC)))
.with_child(demo_box(Lc::t("flex_box_edit", &LOC))) .with_child(demo_box(Lc::t("flex_box_edit", &LOC)))
.with_child(demo_box(Lc::t("flex_box_view", &LOC))), .with_child(demo_box(Lc::t("flex_box_view", &LOC)))
) .with_child(demo_box(Lc::t("flex_box_profile", &LOC)).with_prop(FlexItem::push_end()))
.with_child(
Container::new()
.with_prop(FlexItem::push_end())
.with_flex(Flex::row().with_gap(flex::Gap::Both(UnitValue::RelRem(0.5))))
.with_child(demo_box(Lc::t("flex_box_profile", &LOC)))
.with_child(demo_box(Lc::t("flex_box_logout", &LOC))), .with_child(demo_box(Lc::t("flex_box_logout", &LOC))),
),
) )
} }
@ -525,11 +528,11 @@ fn demo_row(flex: Flex) -> Container {
} }
// Titulo y fragmento de codigo que introducen cada demostracion. // Titulo y fragmento de codigo que introducen cada demostracion.
fn caption(title: Lc, code: &'static str) -> Html { fn caption(title: Lc, code: Lc) -> Html {
Html::with(move |cx| { Html::with(move |cx| {
html! { html! {
h3 { (title.using(cx)) } h3 { (title.using(cx)) }
p { code { (code) } } p { code { (code.using(cx)) } }
} }
}) })
} }

1
examples/locale/en-US/intro-flex.ftl
View file

@ -44,6 +44,7 @@ flex_title_gap_some = With spacing
flex_title_grid_thirds = Column grid: three thirds flex_title_grid_thirds = Column grid: three thirds
flex_title_grid_offset = Column grid: centered column with offset flex_title_grid_offset = Column grid: centered column with offset
flex_title_toolbar = Composite structure: toolbar flex_title_toolbar = Composite structure: toolbar
flex_desc_toolbar = FlexItem::push_end() on an intermediate item of the same Container with Flex
flex_item_label = Flex item { $n } flex_item_label = Flex item { $n }

1
examples/locale/es-ES/intro-flex.ftl
View file

@ -44,6 +44,7 @@ flex_title_gap_some = Con espaciado
flex_title_grid_thirds = Rejilla de columnas: tres tercios flex_title_grid_thirds = Rejilla de columnas: tres tercios
flex_title_grid_offset = Rejilla de columnas: columna centrada con desplazamiento flex_title_grid_offset = Rejilla de columnas: columna centrada con desplazamiento
flex_title_toolbar = Estructura compuesta: barra de herramientas flex_title_toolbar = Estructura compuesta: barra de herramientas
flex_desc_toolbar = FlexItem::push_end() sobre un elemento intermedio del propio Container con Flex
flex_item_label = Flex ítem { $n } flex_item_label = Flex ítem { $n }