pub fn DxcContainer(props: ContainerProps) -> ElementExpand description
A generic container component for grouping and styling content.
This component serves as a structural wrapper to hold and organize child elements.
It does not impose layout behavior by itself but can be styled accordingly
using the class prop. The direction attribute is purely semantic or
intended for use by styling systems (e.g., CSS classes that respond to it).
§Props
-
direction: A hint for the preferred arrangement of children. Values:"horizontal"(default) or"vertical".When nested with
DxcHeaderorDxcFooter, Plese usevertically. Otherwise usehorizontally. -
class: Additional CSS classes to apply to the container element. Default:"container". -
children: The content to be rendered inside the container.
§Example
use dioxus::prelude::*;
use dxc::prelude::*;
fn app() -> Element {
rsx! {
DxcContainer {
direction: Container::Direction::Horizontal,
class: "my-container padded bordered".to_string(),
{
h1 { "Welcome" }
p { "This content is wrapped in a container." }
}
}
}
}§Usage Notes
- Use this component to logically or visually group related UI elements.
- The
directionprop may be used by your CSS (e.g., via attribute selectors) to apply different styles, but it does not alter layout by default. - Combine with CSS for full styling control.