diff --git a/examples/basic/src/demo_button.rs b/examples/basic/src/demo_button.rs
index 826f316..dc15270 100644
--- a/examples/basic/src/demo_button.rs
+++ b/examples/basic/src/demo_button.rs
@@ -32,6 +32,8 @@ pub fn DemoButton(cx: Scope) -> impl IntoView {
+
}
}
\ No newline at end of file
diff --git a/src/button/button.css b/src/button/button.css
index 6ae4756..fc325d3 100644
--- a/src/button/button.css
+++ b/src/button/button.css
@@ -31,3 +31,8 @@
.melt-button--link:hover {
color: var(--font-color-hover);
}
+
+.melt-button--round {
+ padding: 0 10px;
+ border-radius: 50%;
+}
\ No newline at end of file
diff --git a/src/button/mod.rs b/src/button/mod.rs
index 37f6938..a101591 100644
--- a/src/button/mod.rs
+++ b/src/button/mod.rs
@@ -39,8 +39,9 @@ pub fn Button(
cx: Scope,
#[prop(optional, into)] type_: MaybeSignal,
#[prop(optional, into)] color: MaybeSignal,
+ #[prop(optional, into)] round: MaybeSignal,
#[prop(optional, into)] icon: Option,
- children: Children,
+ #[prop(optional)] children: Option,
) -> impl IntoView {
let theme = use_theme(cx, Theme::light);
let css_vars = create_memo(cx, move |_| {
@@ -62,23 +63,36 @@ pub fn Button(
});
let class_name = mount_style("button", || style_sheet_str!("./src/button/button.css"));
+ let icon_style= if children.is_some() {
+ "margin-right: 6px"
+ } else {
+ ""
+ };
+
view! {cx, class=class_name,
}
}