✨ (pagetop): Añade Margin y Padding nativos
- Nuevo módulo `html::spacing` con `Margin`/`Padding`: igual que `FlexItem`, se resuelven generando clases CSS dinámicamente y se aplican con `PropsOp::margin()`/`PropsOp::padding()` sobre cualquier componente. - Elimina `Margin`/`Padding` de `pagetop-bootsier`. - Añade el ejemplo `intro-spacing` con los patrones de uso típicos.
This commit is contained in:
parent
64113aff09
commit
50e4b42fe4
17 changed files with 881 additions and 322 deletions
19
examples/locale/en-US/intro-spacing.ftl
Normal file
19
examples/locale/en-US/intro-spacing.ftl
Normal file
|
|
@ -0,0 +1,19 @@
|
|||
spacing_slogan = Native margin and padding with Margin and Padding
|
||||
spacing_note = Margin and Padding have nothing to do with Flexbox: they apply to any component, whether its container uses Flexbox or not. They are combined with Flex here only to lay out the sample boxes in a row.
|
||||
|
||||
spacing_block_title_padding = Padding
|
||||
spacing_block_title_layout = Layout
|
||||
spacing_block_title_responsive = Padding at a breakpoint
|
||||
spacing_block_title_combined = Margin and padding combined
|
||||
|
||||
spacing_title_uniform_small = Small padding on all four sides
|
||||
spacing_title_uniform_medium = Medium padding on all four sides
|
||||
spacing_title_uniform_large = Large padding on all four sides
|
||||
spacing_title_sides = A different value per side, including the logical start/end sides
|
||||
spacing_title_margin_gap = The middle box's margin pushes its neighbours away, without using Gap
|
||||
spacing_title_margin_center = An automatic margin on both sides centers the box in the free space
|
||||
spacing_title_responsive = Padding grows from md onwards, and again from lg
|
||||
spacing_title_combined = Outer margin above/below and inner padding on all four sides, on a component with real content
|
||||
|
||||
spacing_box_sample = Content
|
||||
spacing_box_card_button = Accept
|
||||
19
examples/locale/es-ES/intro-spacing.ftl
Normal file
19
examples/locale/es-ES/intro-spacing.ftl
Normal file
|
|
@ -0,0 +1,19 @@
|
|||
spacing_slogan = Márgenes y relleno nativos con Margin y Padding
|
||||
spacing_note = Margin y Padding no tienen relación con Flexbox: se aplican sobre cualquier componente, use o no Flexbox su contenedor. Aquí se combinan con Flex sólo para colocar las cajas de muestra en fila.
|
||||
|
||||
spacing_block_title_padding = Rellenos
|
||||
spacing_block_title_layout = Composición
|
||||
spacing_block_title_responsive = Relleno por punto de corte
|
||||
spacing_block_title_combined = Margin y padding combinados
|
||||
|
||||
spacing_title_uniform_small = Relleno pequeño en los cuatro lados
|
||||
spacing_title_uniform_medium = Relleno medio en los cuatro lados
|
||||
spacing_title_uniform_large = Relleno grande en los cuatro lados
|
||||
spacing_title_sides = Un valor distinto para cada lado, incluidos los lados lógicos de inicio y fin
|
||||
spacing_title_margin_gap = El margen de la caja central empuja a sus vecinas, sin usar Gap
|
||||
spacing_title_margin_center = Un margen automático en ambos lados centra la caja en el espacio libre
|
||||
spacing_title_responsive = El relleno crece a partir de md, y de nuevo a partir de lg
|
||||
spacing_title_combined = Margen exterior arriba/abajo y relleno interno por los cuatro lados, sobre un componente con contenido real
|
||||
|
||||
spacing_box_sample = Contenido
|
||||
spacing_box_card_button = Aceptar
|
||||
Loading…
Add table
Add a link
Reference in a new issue