mirror of
https://github.com/hanzoai/calendar.git
synced 2026-10-30 14:46:43 +00:00
d6546c3107
* chore: refactor config files to prevent migration tool errors * refactor: upgrade with the tailwind migration tool * chore: restore pre-commit command + mc * refactor(wip): update dependencies and migrate to Tailwind CSS v4 (mainly web) * chore: resolve Tailwind v4 migration conflicts from merging main * chore: remove unused Tailwind packages from config and update dependencies for v4 migration * chore: uncomment Tailwind CSS utility classes in globals.css * fix: resolve token conflicts between calcom and coss ui * fix: textarea scrollbar * Fix CUI-16 * fix: added @tailwindcss/forms plugin and cleaned up CSS classes in various components to remove unnecessary dark mode styles * fix: selects and inputs of different sizes * fix: remove unnecessary leading-20 class from modal titles in various components * fix: update Checkbox component styles to remove unnecessary border on checked state * fix: clean up styles in RequiresConfirmationController, Checkbox, and Radio components to enhance consistency * fix: update button and filter component styles to remove unnecessary rounded classes for consistency * fix: calendar * fix: update KBarSearch * fix: refine styles in Empty and Checkbox components for improved consistency * Fix focus state email input * fix: update button hover and active states to use 'not-disabled' instead of 'enabled' * fix: line-height issues * fix: update class name for muted background in BookingListItem component * fix: sidebar spacing * chore: update class names to use new Tailwind CSS color utilities * fix embed * chore: upgrade Tailwind CSS to version 4.1.16 and update related dependencies * Map css variables and add a playground test for heavy css customization * suggestion for coss-ui * refactor: update CSS variable usage and clean up styles - Replace instances of `--cal-brand-color` with `--cal-brand` in embed-related HTML files. - Remove the now-unnecessary `addAppCssVars` function from the embed core. - Import theme tokens in the embed core styles for better consistency. - Clean up whitespace and formatting in CSS files for improved readability. - Add a comment in `tokens.css` regarding its usage in both embed and webapp contexts. * Handle within tokens.css instead of fixing coss-ui * Remove initial, not needed. Also, remove tailwind.config.js as tailwidn scans the html automaically * fix: examples app breaking * fix: modal not resizing correctly * feat: upgrade atoms to tailwind v4 * fix: atoms build breaking * fix: atoms build breaking * chore: upgrate examples/base to tailwind 4 * chore: update globals.css * fix: add missing scheduler css variables * fix: PlatformAdditionalCalendarSelector * chore: update global styles * chore: update tailwindcss and postcss dependencies to stable versions * chore: remove unneeded class * fix: dialog and toast animation * fix: replace flex-shrink-0 with shrink-0 for consistent styling in various components * fix: dialog modal for Apple connect * add margin in SaveFilterSegmentButton * Fix radix button nested states * add cursor pointer to buttons but keep dsabled state * Fix commandK selectors and adds cursor pointer * Fix teams filter * fix - round checkboxes * fix filter checkbox * fix select indicator's margin * command group font size * style: fix badge and tooltip radius * chore: remove unneeded files * Delete PR_REVIEW_MANAGED_EVENT_REASSIGNMENT.md * remove ui-playground leftover * fix: add missing react phone input styles in atoms * Delete managed-event-reassignment-flow-and-architecture.mermaid * fix: inter font not loading * Add theme to skeleton container so that it can support dark mode * fix: create custom stack-y-* utilities post tw4 upgrade * fix: typo * fix: atoms stack class + remove unused css file * fix default radius valiue * fix space-y in embed * fix skeleton background * Hardcode radius values to match production * fix border in embed * add missing externalThemeClass * feat: create a custom stack-y-* utility * fix: add stack utility to atom global css * fix: Skeleton loader class modalbox * Add stack-y utility in embed * fix: add missing stack utilities in atoms globals.css * update yarn.lock * add popover portla * update --------- Co-authored-by: Sean Brydon <[email protected]> Co-authored-by: Hariom Balhara <[email protected]> Co-authored-by: Ryukemeister <[email protected]> Co-authored-by: cal.com <[email protected]> Co-authored-by: Eunjae Lee <[email protected]> Co-authored-by: Anik Dhabal Babu <[email protected]>
70 lines
2.3 KiB
TypeScript
70 lines
2.3 KiB
TypeScript
"use client";
|
|
|
|
import {
|
|
SkeletonAvatar,
|
|
SkeletonButton,
|
|
SkeletonContainer,
|
|
SkeletonText,
|
|
} from "@calcom/ui/components/skeleton";
|
|
|
|
export default function Loading() {
|
|
return (
|
|
<SkeletonContainer className="mx-auto max-w-4xl">
|
|
<div className="rounded-md p-8">
|
|
<div className="mb-2 flex items-center">
|
|
<SkeletonText className="h-5 w-32" />
|
|
</div>
|
|
|
|
<div className="mb-6 stack-y-2">
|
|
<SkeletonText className="h-7 w-3/4" />
|
|
<SkeletonText className="h-7 w-1/2" />
|
|
</div>
|
|
|
|
<div className="mb-6">
|
|
<SkeletonText className="mb-2 h-5 w-24" />
|
|
<div className="flex items-center space-x-2">
|
|
<SkeletonText className="h-10 w-full rounded-md" />
|
|
<SkeletonButton className="h-10 w-28 rounded-md" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="mt-4 grid grid-cols-3 gap-4 p-4">
|
|
<div className="col-span-1">
|
|
<div className="mb-4 grid grid-cols-3 gap-2 p-4">
|
|
{[...Array(9)].map((_, i) => (
|
|
<div key={i} className="flex justify-center">
|
|
<SkeletonAvatar className="h-10 w-10 rounded-md" />
|
|
</div>
|
|
))}
|
|
</div>
|
|
<div className="px-4 pb-4">
|
|
<SkeletonText className="mb-2 h-6 w-full" />
|
|
<SkeletonButton className="h-10 w-full rounded-md" />
|
|
</div>
|
|
</div>
|
|
|
|
<div className="col-span-1">
|
|
<div className="mb-[60px] flex justify-center p-4 md:mb-10">
|
|
<SkeletonAvatar className="mt-10 h-16 w-16 rounded-full md:mt-7 md:h-24 md:w-24" />
|
|
</div>
|
|
<div className="px-4 pb-4">
|
|
<SkeletonText className="mb-2 h-6 w-full" />
|
|
<SkeletonButton className="h-10 w-full rounded-md" />
|
|
</div>
|
|
</div>
|
|
|
|
<div className="col-span-1">
|
|
<div className="mb-[60px] flex justify-center p-4 md:mb-10">
|
|
<SkeletonAvatar className="mt-10 h-16 w-16 rounded-md md:mt-7 md:h-24 md:w-24" />
|
|
</div>
|
|
<div className="px-4 pb-4">
|
|
<SkeletonText className="mb-2 h-6 w-full" />
|
|
<SkeletonButton className="h-10 w-full rounded-md" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</SkeletonContainer>
|
|
);
|
|
}
|