commonscomputer/cal.diy
4
0
Fork 0
Code Issues Pull Requests Actions 2.3k Packages Projects Releases Wiki Activity

Skeleton fixes

Browse Source
This commit is contained in:
zomars
2022-06-27 20:25:06 -06:00
parent e27a2bafcd
commit 52759333fd
1 changed files with 9 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/skeleton/index.tsx
+9 -6
View File
@@ -18,24 +18,27 @@ interface SkeletonContainer {
className?: string;
}
const SkeletonAvatar: React.FC<AvatarProps> = ({ width, height }) => {
const SkeletonAvatar: React.FC<AvatarProps> = ({ width, height, className }) => {
return (
<div className={`mt-1 rounded-full bg-gray-200 ltr:mr-2 rtl:ml-2 w-${width} h-${height} ${classNames}`} />
<div className={`mt-1 rounded-full bg-gray-200 ltr:mr-2 rtl:ml-2 w-${width} h-${height} ${className}`} />
);
};
const SkeletonText: React.FC<SkeletonBaseProps> = ({ width, height }) => {
const SkeletonText: React.FC<SkeletonBaseProps> = ({ width, height, className }) => {
return (
<div
className={classNames(`rounded-md bg-gray-200 dark:bg-gray-900 w-${width} h-${height}`, classNames)}
className={classNames(
`dark:white-300 animate-pulse rounded-md bg-gray-300 w-${width} h-${height}`,
className
)}
/>
);
};
const SkeletonButton: React.FC<SkeletonBaseProps> = ({ width, height }) => {
const SkeletonButton: React.FC<SkeletonBaseProps> = ({ width, height, className }) => {
return (
<SkeletonContainer>
<div className={`w-${width} h-${height} bg-gray-200 ${classNames}`} />
<div className={`w-${width} h-${height} bg-gray-200 ${className}`} />
</SkeletonContainer>
);
};