diff --git a/gh-pages/Cargo.toml b/gh-pages/Cargo.toml
index 9c7f57e..c3e5018 100644
--- a/gh-pages/Cargo.toml
+++ b/gh-pages/Cargo.toml
@@ -10,7 +10,12 @@ leptos = { git = "https://github.com/leptos-rs/leptos.git", rev = "3a570dc", fea
     "stable",
 ] }
 melt-ui = { path = "../" }
-leptos_icons = { git = "https://github.com/luoxiaozero/leptos-icons.git", rev = "9d52325", features = ["AiCloseOutlined", "AiCheckOutlined"] }
-leptos_router = { git = "https://github.com/leptos-rs/leptos.git", rev = "3a570dc", features = ["csr"] }
-
-regex = "1.8.2"
\ No newline at end of file
+leptos_icons = { git = "https://github.com/luoxiaozero/leptos-icons.git", rev = "9d52325", features = [
+    "AiCloseOutlined",
+    "AiCheckOutlined",
+] }
+leptos_router = { git = "https://github.com/leptos-rs/leptos.git", rev = "3a570dc", features = [
+    "csr",
+] }
+indoc = "2.0.1"
+regex = "1.8.2"
diff --git a/gh-pages/src/pages/components.rs b/gh-pages/src/pages/components.rs
index 09bc608..75511cf 100644
--- a/gh-pages/src/pages/components.rs
+++ b/gh-pages/src/pages/components.rs
@@ -49,7 +49,7 @@ pub fn ComponentsPage(cx: Scope) -> impl IntoView {
                         <MenuItem key="tabs" label="tabs" />
                     </Menu>
                 </LayoutSider>
-                <Layout>
+                <Layout style="padding: 8px 12px 28px">
                     <Outlet />
                 </Layout>
             </Layout>
diff --git a/gh-pages/src/pages/menu/mod.rs b/gh-pages/src/pages/menu/mod.rs
index 2188e47..5f7a4ba 100644
--- a/gh-pages/src/pages/menu/mod.rs
+++ b/gh-pages/src/pages/menu/mod.rs
@@ -1,3 +1,4 @@
+use indoc::indoc;
 use leptos::*;
 use melt_ui::*;
 
@@ -5,12 +6,26 @@ use melt_ui::*;
 pub fn MenuPage(cx: Scope) -> impl IntoView {
     let selected = create_rw_signal(cx, String::from("o"));
     view! { cx,
-        <div>
+        <Card>
             { move || selected.get() }
             <Menu selected>
                 <MenuItem key="a" label="and"/>
                 <MenuItem key="o" label="or"/>
             </Menu>
-        </div>
+            <CardFooter slot>
+                <Code>
+                    <pre>
+                        {
+                            indoc!(r#"
+                            <Menu selected>
+                                <MenuItem key="a" label="and"/>
+                                <MenuItem key="o" label="or"/>
+                            </Menu>
+                            "#)
+                        }
+                    </pre>
+                </Code>
+            </CardFooter>
+        </Card>
     }
 }
diff --git a/src/card/mod.rs b/src/card/mod.rs
index 6f03842..2cb4563 100644
--- a/src/card/mod.rs
+++ b/src/card/mod.rs
@@ -40,7 +40,7 @@ pub fn Card(
     view! {
         cx, class=class_name,
         <div class="melt-card">
-                <If cond=MaybeSignal::derive(cx, move || is_header || title.get().is_empty())  >
+                <If cond=MaybeSignal::derive(cx, move || is_header || !title.get().is_empty())  >
                     <Then slot>
                         <div class="melt-card__header">
                             <div class="melt-card__header-content">
diff --git a/src/code/mod.rs b/src/code/mod.rs
new file mode 100644
index 0000000..a362bd1
--- /dev/null
+++ b/src/code/mod.rs
@@ -0,0 +1,10 @@
+use leptos::*;
+
+#[component]
+pub fn Code(cx: Scope, children: Children) -> impl IntoView {
+    view! { cx,
+        <code class="melt-code">
+            { children(cx) }
+        </code>
+    }
+}
diff --git a/src/lib.rs b/src/lib.rs
index 3dd1a49..30c388b 100644
--- a/src/lib.rs
+++ b/src/lib.rs
@@ -1,6 +1,7 @@
 mod button;
 mod card;
 mod checkbox;
+mod code;
 mod components;
 mod image;
 mod input;
@@ -19,7 +20,9 @@ mod utils;
 mod wave;
 
 pub use button::*;
+pub use card::*;
 pub use checkbox::*;
+pub use code::*;
 pub use image::*;
 pub use input::*;
 pub use layout::*;
@@ -28,7 +31,7 @@ pub use modal::*;
 pub use progress::*;
 pub use slider::*;
 pub use space::*;
-pub use tabs::*;
 pub use table::*;
+pub use tabs::*;
 pub use theme::Theme;
 pub use wave::*;