fix: Spacing issues on "settings" Button navbar skeleton (fix-settings-skeleton) (#9663)
Co-authored-by: gitstart-calcom <gitstart@users.noreply.github.com>
This commit is contained in:
parent
6d8a576f60
commit
a36f2aa871
|
@ -48,9 +48,9 @@ const SkeletonLoader = ({ title, description }: { title: string; description: st
|
|||
return (
|
||||
<SkeletonContainer>
|
||||
<Meta title={title} description={description} />
|
||||
<div className="mb-8 mt-6 space-y-6">
|
||||
<div className="mb-8 space-y-6">
|
||||
<div className="flex items-center">
|
||||
<SkeletonAvatar className="me-4 h-16 w-16 px-4" />
|
||||
<SkeletonAvatar className="me-4 mt-0 h-16 w-16 px-4" />
|
||||
<SkeletonButton className="h-6 w-32 rounded-md p-5" />
|
||||
</div>
|
||||
<SkeletonText className="h-8 w-full" />
|
||||
|
|
|
@ -256,7 +256,9 @@ const SettingsSidebarContainer = ({
|
|||
isExternalLink={child.isExternalLink}
|
||||
href={child.href || "/"}
|
||||
textClassNames="px-3 text-emphasis font-medium text-sm"
|
||||
className={`my-0.5 h-7 ${tab.children && index === tab.children?.length - 1 && "!mb-3"}`}
|
||||
className={`my-0.5 me-5 h-7 ${
|
||||
tab.children && index === tab.children?.length - 1 && "!mb-3"
|
||||
}`}
|
||||
disableChevron
|
||||
/>
|
||||
))}
|
||||
|
@ -512,12 +514,12 @@ function ShellHeader() {
|
|||
{t(meta.title)}
|
||||
</h1>
|
||||
) : (
|
||||
<div className="bg-emphasis mb-1 h-6 w-24 animate-pulse rounded-md" />
|
||||
<div className="bg-emphasis mb-1 h-5 w-24 animate-pulse rounded-md" />
|
||||
)}
|
||||
{meta.description && isLocaleReady ? (
|
||||
<p className="text-default text-sm ltr:mr-4 rtl:ml-4">{t(meta.description)}</p>
|
||||
) : (
|
||||
<div className="bg-emphasis mb-1 h-6 w-32 animate-pulse rounded-md" />
|
||||
<div className="bg-emphasis h-5 w-32 animate-pulse rounded-md" />
|
||||
)}
|
||||
</div>
|
||||
<div className="ms-auto flex-shrink-0">{meta.CTA}</div>
|
||||
|
|
|
@ -915,7 +915,7 @@ function SideBar({ bannersHeight, user }: SideBarProps) {
|
|||
<Icon
|
||||
className={classNames(
|
||||
"h-4 w-4 flex-shrink-0 [&[aria-current='page']]:text-inherit",
|
||||
"md:ltr:mr-2 md:rtl:ml-2"
|
||||
"me-3 md:ltr:mr-2 md:rtl:ml-2"
|
||||
)}
|
||||
aria-hidden="true"
|
||||
aria-current={
|
||||
|
|
|
@ -14,7 +14,7 @@ interface SkeletonContainer {
|
|||
}
|
||||
|
||||
const SkeletonAvatar: React.FC<SkeletonBaseProps> = ({ className }) => {
|
||||
return <div className={classNames(`bg-emphasis mt-1 rounded-full ltr:mr-2 rtl:ml-2`, className)} />;
|
||||
return <div className={classNames(`bg-emphasis me-3 mt-1 rounded-full`, className)} />;
|
||||
};
|
||||
|
||||
type SkeletonProps<T> = {
|
||||
|
|
Loading…
Reference in New Issue
Block a user