summaryrefslogtreecommitdiffstats
path: root/src/components/molecules/layout/page-header.stories.tsx
diff options
context:
space:
mode:
authorArmand Philippot <git@armandphilippot.com>2022-05-09 18:19:38 +0200
committerArmand Philippot <git@armandphilippot.com>2022-05-09 19:41:02 +0200
commit0d59a6d2995b4119865271ed1908ede0bb96497c (patch)
tree67688e41b7aa253aa58cc08aa360431b07382f9d /src/components/molecules/layout/page-header.stories.tsx
parent339c6957fe92c4ec1809159f09c55201d3794c18 (diff)
refactor: rewrite DescriptionList and Meta components
The meta can have different layout. The previous implementation was not enough to easily change the layout. Also, I prefer to restrict the meta types and it prevents me to repeat myself for the labels.
Diffstat (limited to 'src/components/molecules/layout/page-header.stories.tsx')
-rw-r--r--src/components/molecules/layout/page-header.stories.tsx34
1 files changed, 22 insertions, 12 deletions
diff --git a/src/components/molecules/layout/page-header.stories.tsx b/src/components/molecules/layout/page-header.stories.tsx
index 6054845..d58f8b5 100644
--- a/src/components/molecules/layout/page-header.stories.tsx
+++ b/src/components/molecules/layout/page-header.stories.tsx
@@ -8,6 +8,19 @@ export default {
title: 'Molecules/Layout/PageHeader',
component: PageHeader,
argTypes: {
+ className: {
+ control: {
+ type: 'text',
+ },
+ description: 'Set additional classnames to the header element.',
+ table: {
+ category: 'Styles',
+ },
+ type: {
+ name: 'string',
+ required: false,
+ },
+ },
intro: {
control: {
type: 'text',
@@ -50,18 +63,15 @@ const Template: ComponentStory<typeof PageHeader> = (args) => (
);
const meta = {
- publication: { name: 'Published on:', value: 'April 9th 2022' },
- categories: {
- name: 'Categories:',
- value: [
- <a key="category1" href="#">
- Category 1
- </a>,
- <a key="category2" href="#">
- Category 2
- </a>,
- ],
- },
+ publication: { date: '2022-04-09' },
+ thematics: [
+ <a key="category1" href="#">
+ Category 1
+ </a>,
+ <a key="category2" href="#">
+ Category 2
+ </a>,
+ ],
};
/**