@@ -1,40 +0,0 @@
|
||||
import Header from "../app/components/Header";
|
||||
|
||||
export default {
|
||||
title: "Components/Header",
|
||||
component: Header,
|
||||
parameters: {
|
||||
layout: "fullscreen",
|
||||
},
|
||||
tags: ["autodocs"],
|
||||
argTypes: {
|
||||
onToggle: { action: "toggle" },
|
||||
},
|
||||
};
|
||||
|
||||
export const Default = {
|
||||
args: {},
|
||||
};
|
||||
|
||||
export const WithToggleHandler = {
|
||||
args: {
|
||||
onToggle: () => console.log("Header toggle clicked"),
|
||||
},
|
||||
};
|
||||
|
||||
export const ResponsiveView = {
|
||||
render: () => (
|
||||
<div className="space-y-4">
|
||||
<div className="text-sm font-medium mb-2">
|
||||
Responsive Header Component
|
||||
</div>
|
||||
<Header />
|
||||
<div className="p-4 bg-gray-100 rounded">
|
||||
<p className="text-sm text-gray-600">
|
||||
This header adapts to different screen sizes with responsive
|
||||
navigation, logo sizing, and button layouts.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
),
|
||||
};
|
||||
Reference in New Issue
Block a user