diff --git a/packages/design-system-component-library-yeahyeahyeah/components/User.tsx b/packages/design-system-component-library-yeahyeahyeah/components/User.tsx index b4ba4073..04e9931c 100644 --- a/packages/design-system-component-library-yeahyeahyeah/components/User.tsx +++ b/packages/design-system-component-library-yeahyeahyeah/components/User.tsx @@ -19,10 +19,34 @@ export interface IUserProps { export const User: React.FC = ({ label = 'Display Name', variant = 'small', - username = { label: 'Username', href: '#' }, - timestamp = { label: 'TimeStamp', href: '#' }, - location = { label: 'Location', href: '#' }, - joined = { label: 'Joined', href: '#' }, + username = { + label: 'Username', + href: '#', + fCallBack: () => { + return null; + }, + }, + timestamp = { + label: 'TimeStamp', + href: '#', + fCallBack: () => { + return null; + }, + }, + location = { + label: 'Location', + href: '#', + fCallBack: () => { + return null; + }, + }, + joined = { + label: 'Joined', + href: '#', + fCallBack: () => { + return null; + }, + }, avatar = { src: 'https://i.stack.imgur.com/5xd5n.png', alt: 'Alter Tag' }, btn = { label: 'Follow' }, }) => { diff --git a/packages/design-system-component-library-yeahyeahyeah/components/forms/WriteComponent.tsx b/packages/design-system-component-library-yeahyeahyeah/components/forms/WriteComponent.tsx index 11ed9f2d..f0f24167 100644 --- a/packages/design-system-component-library-yeahyeahyeah/components/forms/WriteComponent.tsx +++ b/packages/design-system-component-library-yeahyeahyeah/components/forms/WriteComponent.tsx @@ -28,6 +28,7 @@ export const WriteComponent: React.FC = ({ username: { label: 'Username', href: '#', + type: 'username', }, avatar: { src: 'https://media.giphy.com/media/ZYzt9dXQUjmBa/giphy.gif', diff --git a/packages/design-system-component-library-yeahyeahyeah/components/mumble/Mumble.tsx b/packages/design-system-component-library-yeahyeahyeah/components/mumble/Mumble.tsx index d1799302..5f0d71a6 100644 --- a/packages/design-system-component-library-yeahyeahyeah/components/mumble/Mumble.tsx +++ b/packages/design-system-component-library-yeahyeahyeah/components/mumble/Mumble.tsx @@ -38,19 +38,23 @@ export const Mumble: React.FC = ({ joined: { href: '', label: 'Joined', + type: 'joined', }, label: 'Display Name', location: { href: '', label: 'Location', + type: 'location', }, timestamp: { href: '', label: 'Timestamp', + type: 'timestamp', }, username: { href: '', label: 'Username', + type: 'username', }, }, text = '', @@ -85,7 +89,7 @@ export const Mumble: React.FC = ({ <> {variant === 'detailpage' && ( <> -
+
= ({ )} {variant === 'timeline' && ( -
+
[ tw` flex @@ -187,7 +195,7 @@ const Row = styled.div(({ gap }: IRowStyles) => [ BottomSpacing, ]); -const Article = styled.article(() => [ +const Article = styled.article(({ variant }: IArticleStyles) => [ tw` relative flex @@ -200,6 +208,7 @@ const Article = styled.article(() => [ px-16 sm:px-48 `, + (variant === 'timeline' || variant === 'detailpage') && tw`rounded-xl`, ]); const AvatarWrapper = styled.div(() => [ diff --git a/packages/design-system-component-library-yeahyeahyeah/components/typography/Heading.tsx b/packages/design-system-component-library-yeahyeahyeah/components/typography/Heading.tsx index 7eb4593e..2f78e349 100644 --- a/packages/design-system-component-library-yeahyeahyeah/components/typography/Heading.tsx +++ b/packages/design-system-component-library-yeahyeahyeah/components/typography/Heading.tsx @@ -5,7 +5,7 @@ import { BottomSpacing } from '../Spacing'; export interface IHeadingProps { label: string; tag: 'h1' | 'h2' | 'h3' | 'h4' | 'span'; - color: 'light' | 'medium' | 'dark' | 'violet' | 'pink' | 'white'; + color?: 'light' | 'medium' | 'dark' | 'violet' | 'pink' | 'white'; size: 'default' | 'xlarge' | 'large' | 'medium' | 'small'; spacing?: TSpacing; }