diff --git a/apps/website/src/examples/Avatar.group.tsx b/apps/website/src/examples/Avatar.group.tsx new file mode 100644 index 00000000000..1461dad3284 --- /dev/null +++ b/apps/website/src/examples/Avatar.group.tsx @@ -0,0 +1,34 @@ +/*--------------------------------------------------------------------------------------------- + * Copyright (c) Bentley Systems, Incorporated. All rights reserved. + * See LICENSE.md in the project root for license terms and full copyright notice. + *--------------------------------------------------------------------------------------------*/ +import * as React from 'react'; +import { AvatarGroup, Avatar, getUserColor } from '@itwin/itwinui-react'; + +export default () => { + return ( + + + + + + + + ); +}; diff --git a/apps/website/src/examples/Avatar.groupanimated.tsx b/apps/website/src/examples/Avatar.groupanimated.tsx new file mode 100644 index 00000000000..a350cd32d27 --- /dev/null +++ b/apps/website/src/examples/Avatar.groupanimated.tsx @@ -0,0 +1,34 @@ +/*--------------------------------------------------------------------------------------------- + * Copyright (c) Bentley Systems, Incorporated. All rights reserved. + * See LICENSE.md in the project root for license terms and full copyright notice. + *--------------------------------------------------------------------------------------------*/ +import * as React from 'react'; +import { AvatarGroup, Avatar, getUserColor } from '@itwin/itwinui-react'; + +export default () => { + return ( + + + + + + + + ); +}; diff --git a/apps/website/src/examples/Avatar.groupoverflow.tsx b/apps/website/src/examples/Avatar.groupoverflow.tsx new file mode 100644 index 00000000000..3e84aa2c0bf --- /dev/null +++ b/apps/website/src/examples/Avatar.groupoverflow.tsx @@ -0,0 +1,76 @@ +/*--------------------------------------------------------------------------------------------- + * Copyright (c) Bentley Systems, Incorporated. All rights reserved. + * See LICENSE.md in the project root for license terms and full copyright notice. + *--------------------------------------------------------------------------------------------*/ +import * as React from 'react'; +import { AvatarGroup, Avatar, getUserColor } from '@itwin/itwinui-react'; + +export default () => { + return ( + + + + + + + + + + + + + + + + + + ); +}; diff --git a/apps/website/src/examples/Avatar.groupstacked.tsx b/apps/website/src/examples/Avatar.groupstacked.tsx new file mode 100644 index 00000000000..00cafc5f7a4 --- /dev/null +++ b/apps/website/src/examples/Avatar.groupstacked.tsx @@ -0,0 +1,34 @@ +/*--------------------------------------------------------------------------------------------- + * Copyright (c) Bentley Systems, Incorporated. All rights reserved. + * See LICENSE.md in the project root for license terms and full copyright notice. + *--------------------------------------------------------------------------------------------*/ +import * as React from 'react'; +import { AvatarGroup, Avatar, getUserColor } from '@itwin/itwinui-react'; + +export default () => { + return ( + + + + + + + + ); +}; diff --git a/apps/website/src/examples/Avatar.icon.tsx b/apps/website/src/examples/Avatar.icon.tsx new file mode 100644 index 00000000000..35fcb93f43e --- /dev/null +++ b/apps/website/src/examples/Avatar.icon.tsx @@ -0,0 +1,19 @@ +/*--------------------------------------------------------------------------------------------- + * Copyright (c) Bentley Systems, Incorporated. All rights reserved. + * See LICENSE.md in the project root for license terms and full copyright notice. + *--------------------------------------------------------------------------------------------*/ +import * as React from 'react'; +import { Avatar, getUserColor } from '@itwin/itwinui-react'; +import { SvgUser } from '@itwin/itwinui-icons-react'; + +export default () => { + return ( +