vynte-infra/calendar
2
0
Fork 0
Code Issues Pull Requests Actions 2.0k Packages Projects Releases Wiki Activity

Fixing colors (#6429)

Browse Source
This commit is contained in:
sean-brydon
2023-01-12 16:57:43 +00:00
committed by GitHub
parent 3f71a41d7e
commit f21c4eb11e
66 changed files with 119 additions and 138 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/components/Embed.tsx
+7 -7
View File
@@ -504,7 +504,7 @@ const tabs = [
return (
<>
<div>
<small className="flex py-4 text-neutral-500">
<small className="flex py-4 text-gray-500">
{t("place_where_cal_widget_appear", { appName: APP_NAME })}
</small>
</div>
@@ -556,7 +556,7 @@ ${getEmbedTypeSpecificString({ embedFramework: "HTML", embedType, calLink, previ
}
return (
<>
<small className="flex py-4 text-neutral-500">{t("create_update_react_component")}</small>
<small className="flex py-4 text-gray-500">{t("create_update_react_component")}</small>
<TextArea
data-testid="embed-react"
ref={ref as typeof ref & MutableRefObject<HTMLTextAreaElement>}
@@ -650,7 +650,7 @@ const ChooseEmbedTypesDialogContent = () => {
<div className="order-none box-border flex-none rounded-sm border border-solid bg-white">
{embed.illustration}
</div>
<div className="mt-2 font-medium text-neutral-900">{embed.title}</div>
<div className="mt-2 font-medium text-gray-900">{embed.title}</div>
<p className="text-sm text-gray-500">{embed.subtitle}</p>
</button>
))}
@@ -827,7 +827,7 @@ const EmbedTypeCodeAndPreviewDialogContent = ({
onOpenChange={() => setIsEmbedCustomizationOpen((val) => !val)}>
<CollapsibleTrigger
type="button"
className="flex w-full items-center text-base font-medium text-neutral-900">
className="flex w-full items-center text-base font-medium text-gray-900">
<div>
{embedType === "inline"
? "Inline Embed Customization"
@@ -838,7 +838,7 @@ const EmbedTypeCodeAndPreviewDialogContent = ({
<Icon.FiChevronRight
className={`${
isEmbedCustomizationOpen ? "rotate-90 transform" : ""
} ml-auto h-5 w-5 text-neutral-500`}
} ml-auto h-5 w-5 text-gray-500`}
/>
</CollapsibleTrigger>
<CollapsibleContent className="text-sm">
@@ -1001,11 +1001,11 @@ const EmbedTypeCodeAndPreviewDialogContent = ({
open={isBookingCustomizationOpen}
onOpenChange={() => setIsBookingCustomizationOpen((val) => !val)}>
<CollapsibleTrigger className="flex w-full" type="button">
<div className="text-base font-medium text-neutral-900">Cal Booking Customization</div>
<div className="text-base font-medium text-gray-900">Cal Booking Customization</div>
<Icon.FiChevronRight
className={`${
isBookingCustomizationOpen ? "rotate-90 transform" : ""
} ml-auto h-5 w-5 text-neutral-500`}
} ml-auto h-5 w-5 text-gray-500`}
/>
</CollapsibleTrigger>
<CollapsibleContent>
apps/web/components/NavTabs.tsx
+2 -2
View File
@@ -67,7 +67,7 @@ const NavTabs: FC<NavTabProps> = ({ tabs, linkProps, ...props }) => {
onClick={onClick}
className={classNames(
isCurrent
? "border-neutral-900 text-neutral-900"
? "border-neutral-900 text-gray-900"
: "border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700",
"group inline-flex items-center border-b-2 py-4 px-1 text-sm font-medium",
className
@@ -76,7 +76,7 @@ const NavTabs: FC<NavTabProps> = ({ tabs, linkProps, ...props }) => {
{tab.icon && (
<tab.icon
className={classNames(
isCurrent ? "text-neutral-900" : "text-gray-400 group-hover:text-gray-500",
isCurrent ? "text-gray-900" : "text-gray-400 group-hover:text-gray-500",
"-ml-0.5 hidden h-4 w-4 ltr:mr-2 rtl:ml-2 sm:inline-block"
)}
aria-hidden="true"
apps/web/components/apps/CalendarListContainer.tsx
+1 -3
View File
@@ -184,9 +184,7 @@ function ConnectedCalendarsList(props: Props) {
<div className="border-t border-gray-200">
{!fromOnboarding && (
<>
<p className="px-4 pt-4 text-sm text-neutral-500">
{t("toggle_calendars_conflict")}
</p>
<p className="px-4 pt-4 text-sm text-gray-500">{t("toggle_calendars_conflict")}</p>
<ul className="space-y-2 p-4">
{item.calendars.map((cal) => (
<CalendarSwitch
apps/web/components/booking/AvailableTimes.tsx
+1 -1
View File
@@ -119,7 +119,7 @@ const AvailableTimes: FC<AvailableTimesProps> = ({
prefetch={false}
className={classNames(
"text-primary-500 hover:border-gray-900 hover:bg-gray-50",
"dark:bg-darkgray-200 dark:hover:bg-darkgray-300 dark:hover:border-darkmodebrand mb-2 block rounded-md border bg-white py-2 text-sm font-medium dark:border-transparent dark:text-neutral-200",
"dark:bg-darkgray-200 dark:hover:bg-darkgray-300 dark:hover:border-darkmodebrand dark:text-darkgray-800 mb-2 block rounded-md border bg-white py-2 text-sm font-medium dark:border-transparent",
brand === "#fff" || brand === "#ffffff" ? "" : ""
)}
data-testid="time">
apps/web/components/booking/BookingListItem.tsx
+1 -1
View File
@@ -356,7 +356,7 @@ function BookingListItem(booking: BookingItemProps) {
<div
title={booking.title}
className={classNames(
"max-w-10/12 sm:max-w-56 text-sm font-medium leading-6 text-neutral-900 md:max-w-full",
"max-w-10/12 sm:max-w-56 text-sm font-medium leading-6 text-gray-900 md:max-w-full",
isCancelled ? "line-through" : ""
)}>
{booking.title}
apps/web/components/eventtype/AvailabilityTab.tsx
+1 -1
View File
@@ -109,7 +109,7 @@ export const AvailabilityTab = ({ isTeamEvent }: { isTeamEvent: boolean }) => {
<div className="space-y-4">
<div>
<div className="min-w-4 mb-2">
<label htmlFor="availability" className="mt-0 flex text-sm font-medium text-neutral-700">
<label htmlFor="availability" className="mt-0 flex text-sm font-medium text-gray-700">
{t("availability")}
</label>
</div>
apps/web/components/eventtype/RecurringEventController.tsx
+3 -3
View File
@@ -57,7 +57,7 @@ export default function RecurringEventController({
{recurringEventState && (
<div data-testid="recurring-event-collapsible" className="text-sm">
<div className="flex items-center">
<p className="text-neutral-900 ltr:mr-2 rtl:ml-2">{t("repeats_every")}</p>
<p className="text-gray-900 ltr:mr-2 rtl:ml-2">{t("repeats_every")}</p>
<input
type="number"
min="1"
@@ -89,7 +89,7 @@ export default function RecurringEventController({
/>
</div>
<div className="mt-4 flex items-center">
<p className="text-neutral-900 ltr:mr-2 rtl:ml-2">{t("for_a_maximum_of")}</p>
<p className="text-gray-900 ltr:mr-2 rtl:ml-2">{t("for_a_maximum_of")}</p>
<input
type="number"
min="1"
@@ -105,7 +105,7 @@ export default function RecurringEventController({
setRecurringEventState(newVal);
}}
/>
<p className="text-neutral-900 ltr:mr-2 rtl:ml-2">
<p className="text-gray-900 ltr:mr-2 rtl:ml-2">
{t("events", {
count: recurringEventState.count,
})}
apps/web/components/getting-started/components/CreateEventsOnCalendarSelect.tsx
+1 -1
View File
@@ -16,7 +16,7 @@ const CreateEventsOnCalendarSelect = (props: ICreateEventsOnCalendarSelectProps)
<>
<div className="mt-6 flex flex-row">
<div className="w-full">
<label htmlFor="createEventsOn" className="flex text-sm font-medium text-neutral-700">
<label htmlFor="createEventsOn" className="flex text-sm font-medium text-gray-700">
{t("create_events_on")}
</label>
<div className="mt-2">
apps/web/components/team/screens/Team.tsx
+2 -2
View File
@@ -22,8 +22,8 @@ const Member = ({ member, teamName }: { member: MemberType; teamName: string | n
imageSrc={WEBAPP_URL + "/" + member.username + "/avatar.png"}
/>
<section className="line-clamp-4 mt-2 w-full space-y-1">
<p className="font-medium text-neutral-900 dark:text-white">{member.name}</p>
<p className="line-clamp-3 overflow-ellipsis text-sm font-normal text-neutral-500 dark:text-white">
<p className="font-medium text-gray-900 dark:text-white">{member.name}</p>
<p className="line-clamp-3 overflow-ellipsis text-sm font-normal text-gray-500 dark:text-white">
{member.bio || t("user_from_team", { user: member.name, team: teamName })}
</p>
</section>
apps/web/components/ui/AuthContainer.tsx
+2 -2
View File
@@ -24,7 +24,7 @@ export default function AuthContainer(props: React.PropsWithChildren<Props>) {
)}
<div className={classNames(props.showLogo ? "text-center" : "", "sm:mx-auto sm:w-full sm:max-w-md")}>
{props.heading && <h2 className="font-cal text-center text-3xl text-neutral-900">{props.heading}</h2>}
{props.heading && <h2 className="font-cal text-center text-3xl text-gray-900">{props.heading}</h2>}
</div>
{props.loading && (
<div className="absolute z-50 flex h-screen w-full items-center bg-gray-50">
@@ -35,7 +35,7 @@ export default function AuthContainer(props: React.PropsWithChildren<Props>) {
<div className="border-1 mx-2 rounded-md border-gray-200 bg-white px-4 py-10 sm:px-10">
{props.children}
</div>
<div className="mt-8 text-center text-sm text-neutral-600">
<div className="mt-8 text-center text-sm text-gray-600">
{props.footerText}
<Credits />
</div>
apps/web/components/ui/LinkIconButton.tsx
+1 -1
View File
@@ -13,7 +13,7 @@ export default function LinkIconButton(props: LinkIconButtonProps) {
type="button"
{...props}
className="text-md flex items-center rounded-sm px-2 py-1 text-sm font-medium text-gray-700 hover:bg-gray-200 hover:text-gray-900">
<props.Icon className="h-4 w-4 text-neutral-500 ltr:mr-2 rtl:ml-2" />
<props.Icon className="h-4 w-4 text-gray-500 ltr:mr-2 rtl:ml-2" />
{props.children}
</button>
</div>
apps/web/components/ui/SettingInputContainer.tsx
+2 -2
View File
@@ -13,8 +13,8 @@ export default function SettingInputContainer({
<div className="space-y-3">
<div className="block sm:flex">
<div className="min-w-48 mb-4 sm:mb-0">
<label htmlFor={htmlFor} className="mt-1 flex text-sm font-medium text-neutral-700">
<Icon className="mt-0.5 h-4 w-4 text-neutral-500 ltr:mr-2 rtl:ml-2" />
<label htmlFor={htmlFor} className="mt-1 flex text-sm font-medium text-gray-700">
<Icon className="mt-0.5 h-4 w-4 text-gray-500 ltr:mr-2 rtl:ml-2" />
{label}
</label>
</div>
apps/web/components/ui/form/CheckboxField.tsx
+2 -2
View File
@@ -21,7 +21,7 @@ const CheckboxField = forwardRef<HTMLInputElement, Props>(
{React.createElement(
descriptionAsLabel ? "div" : "label",
{
className: "flex text-sm font-medium text-neutral-700",
className: "flex text-sm font-medium text-gray-700",
...(!descriptionAsLabel
? {
htmlFor: rest.id,
@@ -39,7 +39,7 @@ const CheckboxField = forwardRef<HTMLInputElement, Props>(
{
className: classNames(
"relative flex items-start",
descriptionAsLabel ? "text-neutral-700" : "text-neutral-900"
descriptionAsLabel ? "text-gray-700" : "text-gray-900"
),
},
<>
apps/web/components/ui/form/CheckedSelect.tsx
+1 -1
View File
@@ -50,7 +50,7 @@ export const CheckedSelect = ({
{option.label}
<Icon.FiX
onClick={() => props.onChange(value.filter((item) => item.value !== option.value))}
className="float-right mt-0.5 h-5 w-5 cursor-pointer text-neutral-500"
className="float-right mt-0.5 h-5 w-5 cursor-pointer text-gray-500"
/>
</div>
))}
apps/web/components/ui/form/MinutesField.tsx
+1 -1
View File
@@ -10,7 +10,7 @@ const MinutesField = forwardRef<HTMLInputElement, Props>(({ label, ...rest }, re
<div className="block sm:flex">
{!!label && (
<div className="min-w-48 mb-4 sm:mb-0">
<label htmlFor={rest.id} className="flex h-full items-center text-sm font-medium text-neutral-700">
<label htmlFor={rest.id} className="flex h-full items-center text-sm font-medium text-gray-700">
{label}
</label>
</div>
apps/web/pages/[user].tsx
+3 -3
View File
@@ -63,7 +63,7 @@ export default function User(props: inferSSRProps<typeof getServerSideProps> & E
className="flex justify-between px-6 py-4"
data-testid="event-type-link">
<div className="flex-shrink">
<p className="dark:text-darkgray-700 text-sm font-semibold text-neutral-900">{type.title}</p>
<p className="dark:text-darkgray-700 text-sm font-semibold text-gray-900">{type.title}</p>
<EventTypeDescription className="text-sm" eventType={type} />
</div>
<div className="mt-1 self-center">
@@ -133,13 +133,13 @@ export default function User(props: inferSSRProps<typeof getServerSideProps> & E
{isSingleUser && ( // When we deal with a single user, not dynamic group
<div className="mb-8 text-center">
<AvatarSSR user={user} className="mx-auto mb-4 h-24 w-24" alt={nameOrUsername} />
<h1 className="font-cal mb-1 text-3xl text-neutral-900 dark:text-white">
<h1 className="font-cal mb-1 text-3xl text-gray-900 dark:text-white">
{nameOrUsername}
{user.verified && (
<Icon.BadgeCheckIcon className="mx-1 -mt-1 inline h-6 w-6 text-blue-500 dark:text-white" />
)}
</h1>
<p className="dark:text-darkgray-600 text-s text-neutral-500">{user.bio}</p>
<p className="dark:text-darkgray-600 text-s text-gray-500">{user.bio}</p>
</div>
)}
<div
apps/web/pages/auth/forgot-password/index.tsx
+1 -1
View File
@@ -94,7 +94,7 @@ export default function ForgotPassword({ csrfToken }: { csrfToken: string }) {
footerText={
!success && (
<>
<Link href="/auth/login" className="font-medium text-neutral-900">
<Link href="/auth/login" className="font-medium text-gray-900">
{t("back_to_signin")}
</Link>
</>
apps/web/pages/availability/[schedule].tsx
+1 -1
View File
@@ -60,7 +60,7 @@ const DateOverride = ({ workingHours }: { workingHours: WorkingHours[] }) => {
</span>
</Tooltip>
</h3>
<p className="mb-4 text-sm text-neutral-500 ltr:mr-4 rtl:ml-4">{t("date_overrides_subtitle")}</p>
<p className="mb-4 text-sm text-gray-500 ltr:mr-4 rtl:ml-4">{t("date_overrides_subtitle")}</p>
<div className="mt-1 space-y-2">
<DateOverrideList
excludedDates={fields.map((field) => yyyymmdd(field.ranges[0].start))}
apps/web/pages/availability/troubleshoot.tsx
+3 -5
View File
@@ -56,7 +56,7 @@ const AvailabilityView = ({ user }: { user: User }) => {
if (e.target.value) setSelectedDate(e.target.value);
}}
/>
<small className="block text-neutral-400">{t("hover_over_bold_times_tip")}</small>
<small className="block text-gray-400">{t("hover_over_bold_times_tip")}</small>
<div className="mt-4 space-y-4">
<div className="bg-brand dark:bg-darkmodebrand overflow-hidden rounded-md">
<div className="text-brandcontrast dark:text-darkmodebrandcontrast px-4 py-2 sm:px-6">
@@ -82,13 +82,11 @@ const AvailabilityView = ({ user }: { user: User }) => {
data-testid="troubleshooter-busy-time">
<div className="px-4 py-5 text-black sm:p-6">
{t("calendar_shows_busy_between")}{" "}
<span
className="font-medium text-neutral-800"
title={dayjs(slot.start).format("HH:mm")}>
<span className="font-medium text-gray-800" title={dayjs(slot.start).format("HH:mm")}>
{dayjs(slot.start).format("HH:mm")}
</span>{" "}
{t("and")}{" "}
<span className="font-medium text-neutral-800" title={dayjs(slot.end).format("HH:mm")}>
<span className="font-medium text-gray-800" title={dayjs(slot.end).format("HH:mm")}>
{dayjs(slot.end).format("HH:mm")}
</span>{" "}
{t("on")} {dayjs(slot.start).format("D")}{" "}
apps/web/pages/booking/[uid].tsx
+2 -2
View File
@@ -408,7 +408,7 @@ export default function Success(props: SuccessProps) {
</div>
<div className="mt-6 mb-8 text-center last:mb-0">
<h3
className="text-2xl font-semibold leading-6 text-neutral-900 dark:text-white"
className="text-2xl font-semibold leading-6 text-gray-900 dark:text-white"
data-testid={isCancelled ? "cancelled-headline" : ""}
id="modal-headline">
{needsConfirmation && !isCancelled
@@ -422,7 +422,7 @@ export default function Success(props: SuccessProps) {
: t("meeting_is_scheduled")}
</h3>
<div className="mt-3">
<p className="text-neutral-600 dark:text-gray-300">{getTitle()}</p>
<p className="text-gray-600 dark:text-gray-300">{getTitle()}</p>
</div>
<div className="border-bookinglightest text-bookingdark dark:border-darkgray-300 mt-8 grid grid-cols-3 border-t pt-8 text-left dark:text-gray-300">
{(isCancelled || reschedule) && cancellationReason && (
apps/web/pages/event-types/index.tsx
+2 -2
View File
@@ -527,7 +527,7 @@ const EventTypeListHeading = ({
{profile?.name || ""}
</Link>
{membershipCount && teamId && (
<span className="relative -top-px text-xs text-neutral-500 ltr:ml-2 ltr:mr-2 rtl:ml-2">
<span className="relative -top-px text-xs text-gray-500 ltr:ml-2 ltr:mr-2 rtl:ml-2">
<Link href={`/settings/teams/${teamId}/members`}>
<Badge variant="gray">
<Icon.FiUsers className="mr-1 -mt-px inline h-3 w-3" />
@@ -537,7 +537,7 @@ const EventTypeListHeading = ({
</span>
)}
{profile?.slug && (
<Link href={`${CAL_URL}/${profile.slug}`} className="block text-xs text-neutral-500">
<Link href={`${CAL_URL}/${profile.slug}`} className="block text-xs text-gray-500">
{`${CAL_URL?.replace("https://", "")}/${profile.slug}`}
</Link>
)}
apps/web/pages/settings/my-account/calendars.tsx
+1 -3
View File
@@ -175,9 +175,7 @@ const CalendarsView = () => {
</div>
</div>
<div className="w-full border-t border-gray-200">
<p className="px-2 pt-4 text-sm text-neutral-500">
{t("toggle_calendars_conflict")}
</p>
<p className="px-2 pt-4 text-sm text-gray-500">{t("toggle_calendars_conflict")}</p>
<ul className="space-y-2 p-4">
{item.calendars.map((cal) => (
<CalendarSwitch
apps/web/pages/settings/my-account/conferencing.tsx
+1 -1
View File
@@ -83,7 +83,7 @@ const ConferencingLayout = () => {
}
<div className="flex-grow truncate pl-2">
<ListItemTitle component="h3" className="mb-1 space-x-2 rtl:space-x-reverse">
<h3 className="truncate text-sm font-medium text-neutral-900">{app.title}</h3>
<h3 className="truncate text-sm font-medium text-gray-900">{app.title}</h3>
</ListItemTitle>
<ListItemText component="p">{app.description}</ListItemText>
</div>
apps/web/styles/globals.css
+3 -3
View File
@@ -383,11 +383,11 @@ nav#nav--settings > a svg {
}
nav#nav--settings > a.active {
@apply border-neutral-500 bg-neutral-50 text-neutral-700 hover:bg-neutral-50 hover:text-neutral-700;
@apply border-neutral-500 bg-neutral-50 text-gray-700 hover:bg-neutral-50 hover:text-gray-700;
}
nav#nav--settings > a.active svg {
@apply text-neutral-500;
@apply text-gray-500;
}
hr {
@@ -490,4 +490,4 @@ hr {
::-webkit-search-cancel-button {
-webkit-appearance: none;
}
}
packages/app-store/ee/routing-forms/components/FormInputFields.tsx
+1 -1
View File
@@ -42,7 +42,7 @@ export default function FormInputFields(props: Props) {
<label
id="slug-label"
htmlFor="slug"
className="flex text-sm font-medium text-neutral-700 dark:text-white">
className="flex text-sm font-medium text-gray-700 dark:text-white">
{field.label}
</label>
</div>
packages/app-store/ee/routing-forms/components/react-awesome-query-builder/widgets.tsx
+1 -1
View File
@@ -152,7 +152,7 @@ function Button({ config, type, label, onClick, readonly }: ButtonProps) {
if (type === "delRule" || type == "delGroup") {
return (
<button className="ml-5">
<Icon.FiTrash className="m-0 h-4 w-4 text-neutral-500" onClick={onClick} />
<Icon.FiTrash className="m-0 h-4 w-4 text-gray-500" onClick={onClick} />
</button>
);
}
packages/app-store/ee/routing-forms/pages/routing-link/[...appPages].tsx
+1 -1
View File
@@ -112,7 +112,7 @@ function RoutingForm({ form, profile, ...restProps }: inferSSRProps<typeof getSe
{form.name}
</h1>
{form.description ? (
<p className="min-h-10 text-sm text-neutral-500 ltr:mr-4 rtl:ml-4 dark:text-white">
<p className="min-h-10 text-sm text-gray-500 ltr:mr-4 rtl:ml-4 dark:text-white">
{form.description}
</p>
) : null}
packages/app-store/giphy/components/SearchDialog.tsx
+2 -2
View File
@@ -115,7 +115,7 @@ export const SearchDialog = (props: ISearchDialog) => {
<h3 className="leading-16 font-cal text-xl text-gray-900" id="modal-title">
{t("add_gif_to_confirmation")}
</h3>
<p className="mb-3 text-sm font-light text-neutral-500">{t("find_gif_spice_confirmation")}</p>
<p className="mb-3 text-sm font-light text-gray-500">{t("find_gif_spice_confirmation")}</p>
<div className="flex items-center border-b border-solid">
{renderTab(SearchIcon, t("search_giphy"), MODE_SEARCH)}
{renderTab(LinkIcon, t("add_link_from_giphy"), MODE_URL)}
@@ -176,7 +176,7 @@ export const SearchDialog = (props: ISearchDialog) => {
{errorMessage && <Alert severity="error" title={errorMessage} className="my-4" />}
{gifImage && selectedMode === MODE_SEARCH && (
<div className="mt-4 flex items-center justify-between space-x-2 rtl:space-x-reverse">
<div className="text-sm font-light text-neutral-500">Not the perfect GIF?</div>
<div className="text-sm font-light text-gray-500">Not the perfect GIF?</div>
<Button
size="sm"
color="secondary"
packages/app-store/rainbow/components/RainbowInstallForm.tsx
+2 -2
View File
@@ -22,7 +22,7 @@ const RainbowInstallForm: React.FC<RainbowInstallFormProps> = ({
<>
<div className="mt-4 block items-center sm:flex">
<div className="min-w-48 mb-4 sm:mb-0">
<label htmlFor="blockchainId" className="flex text-sm font-medium text-neutral-700">
<label htmlFor="blockchainId" className="flex text-sm font-medium text-gray-700">
{t("Blockchain")}
</label>
</div>
@@ -38,7 +38,7 @@ const RainbowInstallForm: React.FC<RainbowInstallFormProps> = ({
</div>
<div className="block items-center sm:flex">
<div className="min-w-48 mb-4 sm:mb-0">
<label htmlFor="smartContractAddress" className="flex text-sm font-medium text-neutral-700">
<label htmlFor="smartContractAddress" className="flex text-sm font-medium text-gray-700">
{t("token_address")}
</label>
</div>
packages/app-store/rainbow/components/RainbowKit.tsx
+2 -2
View File
@@ -112,7 +112,7 @@ const BalanceCheck: React.FC<RainbowGateProps> = ({ chainId, setToken, tokenAddr
<div className="rounded-md border border-neutral-200 dark:border-neutral-700 dark:hover:border-neutral-600">
<div className="hover:border-brand dark:bg-darkgray-100 flex min-h-[120px] grow flex-col border-b border-neutral-200 bg-white p-6 text-center first:rounded-t-md last:rounded-b-md last:border-b-0 hover:bg-white dark:border-neutral-700 dark:hover:border-neutral-600 md:flex-row md:text-left">
<span className="mb-4 grow md:mb-0">
<h2 className="mb-2 grow font-semibold text-neutral-900 dark:text-white">Token Gate</h2>
<h2 className="mb-2 grow font-semibold text-gray-900 dark:text-white">Token Gate</h2>
{isLoading && (
<>
<SkeletonText className="mb-3 h-1 w-full" />
@@ -121,7 +121,7 @@ const BalanceCheck: React.FC<RainbowGateProps> = ({ chainId, setToken, tokenAddr
)}
{!isLoading && contractData && contractData.data && (
<>
<p className="text-neutral-300 dark:text-white">
<p className="text-gray-300 dark:text-white">
<Trans i18nKey="rainbow_connect_wallet_gate" t={t}>
Connect your wallet if you own {contractData.data.name} ({contractData.data.symbol}) .
</Trans>
packages/app-store/typeform/pages/how-to-use/[...appPages].tsx
+3 -3
View File
@@ -31,7 +31,7 @@ export default function HowToUse() {
target="_blank"
className="inline-flex items-baseline text-base text-gray-500">
<Icon.FiExternalLink
className="h-4 w-4 text-neutral-500 ltr:mr-2 rtl:ml-2"
className="h-4 w-4 text-gray-500 ltr:mr-2 rtl:ml-2"
aria-hidden="true"
/>
Click &quot;Copy Typeform Redirect URL&quot;
@@ -45,7 +45,7 @@ export default function HowToUse() {
target="_blank"
className="inline-flex items-baseline text-base text-gray-500">
<Icon.FiExternalLink
className="h-4 w-4 text-neutral-500 ltr:mr-2 rtl:ml-2"
className="h-4 w-4 text-gray-500 ltr:mr-2 rtl:ml-2"
aria-hidden="true"
/>
Redirect to your typeform
@@ -58,7 +58,7 @@ export default function HowToUse() {
target="_blank"
className="inline-flex items-baseline text-base text-gray-500">
<Icon.FiExternalLink
className="h-4 w-4 text-neutral-500 ltr:mr-2 rtl:ml-2"
className="h-4 w-4 text-gray-500 ltr:mr-2 rtl:ml-2"
aria-hidden="true"
/>
Recall Information in Typeform
packages/app-store/zapier/components/TemplateCard.tsx
+1 -1
View File
@@ -13,7 +13,7 @@ export default function TemplateCard({ template }: { template: Template }) {
</div>
<div className="mr-4">
<div>
<p className="truncate text-sm font-medium leading-4 text-neutral-900">{template.app}</p>
<p className="truncate text-sm font-medium leading-4 text-gray-900">{template.app}</p>
<p className="mt-[2px] text-sm text-gray-500">{template.text}</p>
</div>
</div>
packages/app-store/zapier/pages/setup/index.tsx
+1 -1
View File
@@ -75,7 +75,7 @@ export default function ZapierSetup(props: IZapierSetupProps) {
}}
type="button"
className="mt-4 text-base sm:mt-0 sm:rounded-l-none">
<Icon.ClipboardCopyIcon className="h-5 w-5 text-neutral-100 ltr:mr-2 rtl:ml-2" />
<Icon.ClipboardCopyIcon className="h-5 w-5 text-gray-100 ltr:mr-2 rtl:ml-2" />
{t("copy")}
</Button>
</Tooltip>
packages/config/tailwind-preset.js
+1 -12
View File
@@ -57,18 +57,7 @@ module.exports = {
800: "#1F2937",
900: "#111827",
},
neutral: {
50: "#F8F8F8",
100: "#F5F5F5",
200: "#E1E1E1",
300: "#CFCFCF",
400: "#ACACAC",
500: "#888888",
600: "#494949",
700: "#3E3E3E",
800: "#313131",
900: "#292929",
},
primary: {
50: "#F4F4F4",
100: "#E8E8E8",
packages/features/apps/AdminAppsList.tsx
+1 -1
View File
@@ -76,7 +76,7 @@ const IntegrationContainer = ({
<div className="flex w-full flex-1 items-center justify-between space-x-3 p-4 rtl:space-x-reverse md:max-w-3xl">
{app.logo && <img className="h-10 w-10" src={app.logo} alt={app.title} />}
<div className="flex-grow truncate pl-2">
<h3 className="truncate text-sm font-medium text-neutral-900">
<h3 className="truncate text-sm font-medium text-gray-900">
<p>{app.name || app.title}</p>
</h3>
<p className="truncate text-sm text-gray-500">{app.description}</p>
packages/features/calendars/DestinationCalendarSelector.tsx
+1 -1
View File
@@ -27,7 +27,7 @@ const SingleValueComponent = ({ ...props }: SingleValueProps<Option>) => {
const { label, subtitle } = props.data;
return (
<components.SingleValue {...props} className="flex space-x-1">
<p>{label}</p> <p className=" text-neutral-500">{subtitle}</p>
<p>{label}</p> <p className=" text-gray-500">{subtitle}</p>
</components.SingleValue>
);
};
packages/features/ee/api-keys/components/ApiKeyDialogForm.tsx
+1 -1
View File
@@ -83,7 +83,7 @@ export default function ApiKeyDialogForm({
}}
type="button"
className="rounded-l-none py-[19px] text-base ">
<Icon.ClipboardCopyIcon className="h-5 w-5 text-neutral-100 ltr:mr-2 rtl:ml-2" />
<Icon.ClipboardCopyIcon className="h-5 w-5 text-gray-100 ltr:mr-2 rtl:ml-2" />
{t("copy")}
</Button>
</Tooltip>
packages/features/ee/payments/components/PaymentPage.tsx
+2 -2
View File
@@ -84,12 +84,12 @@ const PaymentPage: FC<PaymentPageProps> = (props) => {
<div className="mt-3 text-center sm:mt-5">
<h3
className="text-2xl font-semibold leading-6 text-neutral-900 dark:text-white"
className="text-2xl font-semibold leading-6 text-gray-900 dark:text-white"
id="modal-headline">
{t("payment")}
</h3>
<div className="mt-3">
<p className="text-sm text-neutral-600 dark:text-gray-300">
<p className="text-sm text-gray-600 dark:text-gray-300">
{t("pay_later_instructions")}
</p>
</div>
packages/features/ee/sso/components/SAMLConfiguration.tsx
+2 -2
View File
@@ -122,7 +122,7 @@ export default function SAMLConfiguration({ teamId }: { teamId: number | null })
}}
type="button"
className="px-4 text-base">
<Icon.ClipboardCopyIcon className="h-5 w-5 text-neutral-100" />
<Icon.ClipboardCopyIcon className="h-5 w-5 text-gray-100" />
{t("copy")}
</Button>
</div>
@@ -142,7 +142,7 @@ export default function SAMLConfiguration({ teamId }: { teamId: number | null })
}}
type="button"
className="px-4 text-base">
<Icon.ClipboardCopyIcon className="h-5 w-5 text-neutral-100" />
<Icon.ClipboardCopyIcon className="h-5 w-5 text-gray-100" />
{t("copy")}
</Button>
</div>
packages/features/ee/support/components/HelpMenuItem.tsx
+7 -7
View File
@@ -40,7 +40,7 @@ export default function HelpMenuItem({ onHelpItemSelect }: HelpMenuItemProps) {
return (
<div className="w-full rounded-md border-gray-300 bg-white">
<div className="w-full py-5">
<p className="mb-1 px-5 text-neutral-500">{t("resources").toUpperCase()}</p>
<p className="mb-1 px-5 text-gray-500">{t("resources").toUpperCase()}</p>
<a
onClick={() => onHelpItemSelect()}
href="https://docs.cal.com/"
@@ -50,7 +50,7 @@ export default function HelpMenuItem({ onHelpItemSelect }: HelpMenuItemProps) {
{t("support_documentation")}
<Icon.FiExternalLink
className={classNames(
"text-neutral-400 group-hover:text-neutral-500",
"text-gray-400 group-hover:text-gray-500",
"ml-1 mt-px h-4 w-4 flex-shrink-0 ltr:mr-3"
)}
/>
@@ -64,7 +64,7 @@ export default function HelpMenuItem({ onHelpItemSelect }: HelpMenuItemProps) {
{t("developer_documentation")}
<Icon.FiExternalLink
className={classNames(
"text-neutral-400 group-hover:text-neutral-500",
"text-gray-400 group-hover:text-gray-500",
"ml-1 mt-px h-4 w-4 flex-shrink-0 ltr:mr-3"
)}
/>
@@ -76,7 +76,7 @@ export default function HelpMenuItem({ onHelpItemSelect }: HelpMenuItemProps) {
<hr className=" bg-gray-200" />
<div className="w-full p-5">
<p className="mb-1 text-neutral-500">{t("feedback").toUpperCase()}</p>
<p className="mb-1 text-gray-500">{t("feedback").toUpperCase()}</p>
<p className="flex w-full py-2 text-sm font-medium text-gray-700">{t("comments")}</p>
<textarea
id="comment"
@@ -195,10 +195,10 @@ export default function HelpMenuItem({ onHelpItemSelect }: HelpMenuItemProps) {
</div>
)}
</div>
<div className="w-full bg-neutral-50 p-5 text-neutral-500">
<div className="w-full bg-neutral-50 p-5 text-gray-500">
<p className="">{t("specific_issue")}</p>
<button
className="font-medium underline hover:text-neutral-700"
className="font-medium underline hover:text-gray-700"
onClick={() => {
setActive(true);
loadChat({ open: true });
@@ -209,7 +209,7 @@ export default function HelpMenuItem({ onHelpItemSelect }: HelpMenuItemProps) {
<span> {t("or").toLowerCase()} </span>
<a
onClick={() => onHelpItemSelect()}
className="font-medium underline hover:text-neutral-700"
className="font-medium underline hover:text-gray-700"
href="https://docs.cal.com/"
target="_blank"
rel="noreferrer">
packages/features/ee/teams/components/TeamAvailabilityModal.tsx
+1 -1
View File
@@ -38,7 +38,7 @@ export default function TeamAvailabilityModal(props: Props) {
className="h-14 w-14 rounded-full"
/>
<div className="inline-block pt-1 ltr:ml-3 rtl:mr-3">
<span className="text-lg font-bold text-neutral-700">{props.member?.name}</span>
<span className="text-lg font-bold text-gray-700">{props.member?.name}</span>
<span className="-mt-1 block text-sm text-gray-400">{props.member?.email}</span>
</div>
</div>
packages/features/ee/teams/components/TeamAvailabilityScreen.tsx
+4 -4
View File
@@ -48,7 +48,7 @@ export default function TeamAvailabilityScreen(props: Props) {
className="min-w-10 min-h-10 mt-1 h-10 w-10 rounded-full"
/>
<div className="inline-block overflow-hidden pt-1 ltr:ml-3 rtl:mr-3">
<span className="truncate text-lg font-bold text-neutral-700">{member?.name}</span>
<span className="truncate text-lg font-bold text-gray-700">{member?.name}</span>
<span className="-mt-1 block truncate text-sm text-gray-400">{member?.email}</span>
</div>
</div>
@@ -62,7 +62,7 @@ export default function TeamAvailabilityScreen(props: Props) {
<div className="flex flex-1 flex-col rounded-sm border border-neutral-200 bg-white">
<div className="flex w-full space-x-5 border-b border-gray-200 p-4 rtl:space-x-reverse">
<div className="flex flex-col">
<span className="text-sm font-medium text-neutral-700">Date</span>
<span className="text-sm font-medium text-gray-700">Date</span>
<DatePicker
date={selectedDate.toDate()}
className="p-1.5"
@@ -72,7 +72,7 @@ export default function TeamAvailabilityScreen(props: Props) {
/>
</div>
<div className="flex flex-col">
<span className="text-sm font-medium text-neutral-700">Timezone</span>
<span className="text-sm font-medium text-gray-700">Timezone</span>
<TimezoneSelect
id="timeZone"
value={selectedTimeZone}
@@ -82,7 +82,7 @@ export default function TeamAvailabilityScreen(props: Props) {
/>
</div>
<div className="hidden sm:block">
<span className="text-sm font-medium text-neutral-700">Slot Length</span>
<span className="text-sm font-medium text-gray-700">Slot Length</span>
<Select
options={[
{ value: 15, label: "15 minutes" },
packages/features/ee/teams/components/TeamAvailabilityTimes.tsx
+1 -1
View File
@@ -53,7 +53,7 @@ export default function TeamAvailabilityTimes(props: Props) {
{slots.map((slot) => (
<div key={slot.time.format()} className="flex flex-row items-center">
<a
className="min-w-48 border-brand text-bookingdarker hover:bg-brand hover:text-brandcontrast dark:hover:bg-darkmodebrand dark:hover:text-darkmodebrandcontrast mb-2 mr-3 block flex-grow rounded-sm border bg-white py-2 text-center font-medium dark:border-transparent dark:bg-gray-600 dark:text-neutral-200 dark:hover:border-black dark:hover:bg-black dark:hover:text-white"
className="min-w-48 border-brand text-bookingdarker hover:bg-brand hover:text-brandcontrast dark:hover:bg-darkmodebrand dark:hover:text-darkmodebrandcontrast dark:text-darkgray-800 mb-2 mr-3 block flex-grow rounded-sm border bg-white py-2 text-center font-medium dark:border-transparent dark:bg-gray-600 dark:hover:border-black dark:hover:bg-black dark:hover:text-white"
data-testid="time">
{slot.time.format("HH:mm")}
</a>
packages/features/ee/teams/components/TeamListItem.tsx
+1 -1
View File
@@ -72,7 +72,7 @@ export default function TeamListItem(props: Props) {
className="min-h-9 min-w-9 h-9 w-9 rounded-full"
/>
<div className="inline-block ltr:ml-3 rtl:mr-3">
<span className="text-sm font-bold text-neutral-700">{team.name}</span>
<span className="text-sm font-bold text-gray-700">{team.name}</span>
<span className="block text-xs text-gray-400">
{team.slug ? `${process.env.NEXT_PUBLIC_WEBSITE_URL}/team/${team.slug}` : "Unpublished team"}
</span>
packages/features/ee/teams/components/v2/TeamAvailabilityScreen.tsx
+4 -4
View File
@@ -48,7 +48,7 @@ export default function TeamAvailabilityScreen(props: Props) {
className="min-w-10 min-h-10 mt-1 h-10 w-10 rounded-full"
/>
<div className="inline-block overflow-hidden pt-1 ltr:ml-3 rtl:mr-3">
<span className="truncate text-lg font-bold text-neutral-700">{member?.name}</span>
<span className="truncate text-lg font-bold text-gray-700">{member?.name}</span>
<span className="-mt-1 block truncate text-sm text-gray-400">{member?.email}</span>
</div>
</div>
@@ -62,7 +62,7 @@ export default function TeamAvailabilityScreen(props: Props) {
<div className="flex flex-1 flex-col rounded-sm border border-neutral-200 bg-white">
<div className="flex w-full space-x-5 border-b border-gray-200 p-4 rtl:space-x-reverse">
<div className="flex flex-col">
<span className="text-sm font-medium text-neutral-700">Date</span>
<span className="text-sm font-medium text-gray-700">Date</span>
<DatePicker
date={selectedDate.toDate()}
className="p-1.5"
@@ -72,7 +72,7 @@ export default function TeamAvailabilityScreen(props: Props) {
/>
</div>
<div className="flex flex-col">
<span className="text-sm font-medium text-neutral-700">Timezone</span>
<span className="text-sm font-medium text-gray-700">Timezone</span>
<TimezoneSelect
id="timeZone"
value={selectedTimeZone}
@@ -82,7 +82,7 @@ export default function TeamAvailabilityScreen(props: Props) {
/>
</div>
<div className="hidden sm:block">
<span className="text-sm font-medium text-neutral-700">Slot Length</span>
<span className="text-sm font-medium text-gray-700">Slot Length</span>
<Select
options={[
{ value: 15, label: "15 minutes" },
packages/features/ee/teams/components/v2/TeamAvailabilityTimes.tsx
+1 -1
View File
@@ -60,7 +60,7 @@ export default function TeamAvailabilityTimes(props: Props) {
{slots.map((slot) => (
<div key={slot.time.format()} className="flex flex-row items-center ">
<a
className="min-w-48 border-brand text-bookingdarker mb-2 mr-3 block flex-grow rounded-md border bg-white py-2 text-center font-medium dark:border-transparent dark:bg-gray-600 dark:text-neutral-200 "
className="min-w-48 border-brand text-bookingdarker dark:text-darkgray-800 mb-2 mr-3 block flex-grow rounded-md border bg-white py-2 text-center font-medium dark:border-transparent dark:bg-gray-600 "
data-testid="time">
{slot.time.tz(props.selectedTimeZone.toString()).format("HH:mm")}
</a>
packages/features/ee/workflows/components/EventWorkflowsTab.tsx
+1 -1
View File
@@ -101,7 +101,7 @@ const WorkflowListItem = (props: ItemProps) => {
<div
className={classNames(
"mb-1 w-full truncate text-base font-medium leading-4 text-gray-900 md:max-w-max",
workflow.name && isActive ? "text-gray-900" : "text-neutral-500"
workflow.name && isActive ? "text-gray-900" : "text-gray-500"
)}>
{workflow.name
? workflow.name
packages/features/ee/workflows/components/WorkflowListPage.tsx
+1 -1
View File
@@ -89,7 +89,7 @@ export default function WorkflowListPage({ workflows }: Props) {
<div
className={classNames(
"max-w-56 truncate text-sm font-medium leading-6 text-gray-900 md:max-w-max",
workflow.name ? "text-gray-900" : "text-neutral-500"
workflow.name ? "text-gray-900" : "text-gray-500"
)}>
{workflow.name
? workflow.name
packages/features/eventtypes/components/EventTypeDescription.tsx
+1 -1
View File
@@ -32,7 +32,7 @@ export const EventTypeDescription = ({ eventType, className }: EventTypeDescript
return (
<>
<div className={classNames("dark:text-darkgray-800 text-neutral-500", className)}>
<div className={classNames("dark:text-darkgray-800 text-gray-500", className)}>
{eventType.description && (
<p className="dark:text-darkgray-800 max-w-[280px] break-words py-1 text-sm text-gray-500 sm:max-w-[500px]">
{eventType.description.substring(0, 300)}
packages/features/kbar/Kbar.tsx
+1 -1
View File
@@ -278,7 +278,7 @@ export const KBarTrigger = () => {
<button
color="minimal"
onClick={query.toggle}
className="group flex rounded-md py-2 px-3 text-sm font-medium hover:bg-gray-100 lg:p-1 lg:hover:bg-gray-200 lg:hover:text-neutral-900">
className="group flex rounded-md py-2 px-3 text-sm font-medium hover:bg-gray-100 lg:p-1 lg:hover:bg-gray-200 lg:hover:text-gray-900">
<Icon.FiSearch className="h-4 w-4 flex-shrink-0 text-inherit" />
</button>
</Tooltip>
packages/features/schedules/components/DateOverrideInputDialog.tsx
+1 -3
View File
@@ -136,9 +136,7 @@ const DateOverrideForm = ({
<p className="text-medium text-sm">{t("date_overrides_dialog_which_hours")}</p>
<div>
{datesUnavailable ? (
<p className="rounded border p-2 text-sm text-neutral-500">
{t("date_overrides_unavailable")}
</p>
<p className="rounded border p-2 text-sm text-gray-500">{t("date_overrides_unavailable")}</p>
) : (
<DayRanges name="range" />
)}
packages/features/schedules/components/DateOverrideList.tsx
+2 -2
View File
@@ -50,10 +50,10 @@ const DateOverrideList = ({
}).format(item.ranges[0].start)}
</h3>
{item.ranges[0].end.getUTCHours() === 0 && item.ranges[0].end.getUTCMinutes() === 0 ? (
<p className="text-xs text-neutral-500">{t("unavailable")}</p>
<p className="text-xs text-gray-500">{t("unavailable")}</p>
) : (
item.ranges.map((range, i) => (
<p key={i} className="text-xs text-neutral-500">
<p key={i} className="text-xs text-gray-500">
{timeSpan(range)}
</p>
))
packages/features/schedules/components/Schedule.tsx
+3 -3
View File
@@ -181,7 +181,7 @@ export const DayRanges = <TFieldValues extends FieldValues>({
{index === 0 && (
<Button
tooltip={t("add_time_availability")}
className=" text-neutral-400"
className=" text-gray-400"
type="button"
color="minimal"
size="icon"
@@ -371,7 +371,7 @@ const CopyTimes = ({
return (
<div className="space-y-2 py-2">
<div className="p-2">
<p className="h6 pb-3 pl-1 text-xs font-medium uppercase text-neutral-400">{t("copy_times_to")}</p>
<p className="h6 pb-3 pl-1 text-xs font-medium uppercase text-gray-400">{t("copy_times_to")}</p>
<ol className="space-y-2">
{weekdayNames(i18n.language, weekStart).map((weekday, num) => {
const weekdayIndex = (num + weekStart) % 7;
@@ -391,7 +391,7 @@ const CopyTimes = ({
}
}}
type="checkbox"
className="inline-block rounded-[4px] border-gray-300 text-neutral-900 focus:ring-neutral-500 disabled:text-neutral-400"
className="inline-block rounded-[4px] border-gray-300 text-gray-900 focus:ring-neutral-500 disabled:text-gray-400"
/>
</label>
</li>
packages/features/schedules/components/ScheduleListItem.tsx
+2 -2
View File
@@ -45,14 +45,14 @@ export function ScheduleListItem({
className="flex-grow truncate text-sm"
title={schedule.name}>
<div className="space-x-2 rtl:space-x-reverse">
<span className="truncate font-medium text-neutral-900">{schedule.name}</span>
<span className="truncate font-medium text-gray-900">{schedule.name}</span>
{schedule.isDefault && (
<Badge variant="success" className="text-xs">
{t("default")}
</Badge>
)}
</div>
<p className="mt-1 text-xs text-neutral-500">
<p className="mt-1 text-xs text-gray-500">
{schedule.availability
.filter((availability) => !!availability.days.length)
.map((availability) => (
packages/features/shell/Shell.tsx
+9 -9
View File
@@ -362,7 +362,7 @@ function UserDropdown({ small }: { small?: boolean }) {
className="flex w-full items-center px-4 py-2 text-sm text-gray-700 ltr:flex-row rtl:flex-row-reverse">
<Icon.FiHelpCircle
className={classNames(
"text-gray-500 group-hover:text-neutral-500",
"text-gray-500 group-hover:text-gray-500",
"h-4 w-4 flex-shrink-0 ltr:mr-2 rtl:ml-2"
)}
aria-hidden="true"
@@ -581,7 +581,7 @@ const NavigationItem: React.FC<{
href={item.href}
aria-label={t(item.name)}
className={classNames(
"group flex items-center rounded-md py-2 px-3 text-sm font-medium text-gray-600 hover:bg-gray-100 [&[aria-current='page']]:bg-gray-200 [&[aria-current='page']]:hover:text-neutral-900",
"group flex items-center rounded-md py-2 px-3 text-sm font-medium text-gray-600 hover:bg-gray-100 [&[aria-current='page']]:bg-gray-200 [&[aria-current='page']]:hover:text-gray-900",
isChild
? `[&[aria-current='page']]:text-brand-900 hidden h-8 pl-16 lg:flex lg:pl-11 [&[aria-current='page']]:bg-transparent ${
props.index === 0 ? "mt-0" : "mt-px"
@@ -654,7 +654,7 @@ const MobileNavigationItem: React.FC<{
<Link
key={item.name}
href={item.href}
className="relative my-2 min-w-0 flex-1 overflow-hidden rounded-md py-2 px-1 text-center text-xs font-medium text-neutral-400 hover:bg-gray-200 hover:text-gray-700 focus:z-10 sm:text-sm [&[aria-current='page']]:text-gray-900"
className="relative my-2 min-w-0 flex-1 overflow-hidden rounded-md py-2 px-1 text-center text-xs font-medium text-gray-400 hover:bg-gray-200 hover:text-gray-700 focus:z-10 sm:text-sm [&[aria-current='page']]:text-gray-900"
aria-current={current ? "page" : undefined}>
{item.badge && <div className="absolute right-1 top-1">{item.badge}</div>}
{item.icon && (
@@ -717,14 +717,14 @@ function SideBar() {
<button
color="minimal"
onClick={() => window.history.back()}
className="desktop-only group flex text-sm font-medium text-neutral-500 hover:text-neutral-900">
<Icon.FiArrowLeft className="h-4 w-4 flex-shrink-0 text-neutral-500 group-hover:text-neutral-900" />
className="desktop-only group flex text-sm font-medium text-gray-500 hover:text-gray-900">
<Icon.FiArrowLeft className="h-4 w-4 flex-shrink-0 text-gray-500 group-hover:text-gray-900" />
</button>
<button
color="minimal"
onClick={() => window.history.forward()}
className="desktop-only group flex text-sm font-medium text-neutral-500 hover:text-neutral-900">
<Icon.FiArrowRight className="h-4 w-4 flex-shrink-0 text-neutral-500 group-hover:text-neutral-900" />
className="desktop-only group flex text-sm font-medium text-gray-500 hover:text-gray-900">
<Icon.FiArrowRight className="h-4 w-4 flex-shrink-0 text-gray-500 group-hover:text-gray-900" />
</button>
<KBarTrigger />
</div>
@@ -791,7 +791,7 @@ export function ShellMain(props: LayoutProps) {
</h1>
)}
{props.subtitle && (
<p className="hidden text-sm text-neutral-500 sm:block">
<p className="hidden text-sm text-gray-500 sm:block">
{!isLocaleReady ? <SkeletonText invisible /> : props.subtitle}
</p>
)}
@@ -854,7 +854,7 @@ function TopNav() {
<Logo />
</Link>
<div className="flex items-center gap-2 self-center">
<span className="group flex items-center rounded-full text-sm font-medium text-gray-700 hover:bg-gray-50 hover:text-neutral-900 lg:hidden">
<span className="group flex items-center rounded-full text-sm font-medium text-gray-700 hover:bg-gray-50 hover:text-gray-900 lg:hidden">
<KBarTrigger />
</span>
<button className="rounded-full p-1 text-gray-400 hover:bg-gray-50 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-black focus:ring-offset-2">
packages/features/webhooks/components/WebhookForm.tsx
+1 -1
View File
@@ -154,7 +154,7 @@ const WebhookForm = (props: {
<>
<Label className="font-sm font-medium text-gray-900">Secret</Label>
<div className="space-y-0 rounded-md border-0 border-neutral-200 bg-white sm:mx-0 md:border">
<div className="rounded-sm border-b p-2 text-sm text-neutral-900">
<div className="rounded-sm border-b p-2 text-sm text-gray-900">
{t("forgotten_secret_description")}
</div>
<div className="p-2">
packages/ui/components/button/LinkIconButton.tsx
+1 -1
View File
@@ -13,7 +13,7 @@ export default function LinkIconButton(props: LinkIconButtonProps) {
type="button"
{...props}
className="text-md flex items-center rounded-md px-2 py-1 text-sm font-medium text-gray-700 hover:bg-gray-200 hover:text-gray-900">
<props.Icon className="h-4 w-4 text-neutral-500 ltr:mr-2 rtl:ml-2" />
<props.Icon className="h-4 w-4 text-gray-500 ltr:mr-2 rtl:ml-2" />
{props.children}
</button>
</div>
packages/ui/components/dialog/ConfirmationDialogContent.tsx
+1 -1
View File
@@ -55,7 +55,7 @@ export function ConfirmationDialogContent(props: PropsWithChildren<ConfirmationD
)}
<div>
<DialogPrimitive.Title className="font-cal text-xl text-gray-900">{title}</DialogPrimitive.Title>
<DialogPrimitive.Description className="text-sm text-neutral-500">
<DialogPrimitive.Description className="text-sm text-gray-500">
{children}
</DialogPrimitive.Description>
</div>
packages/ui/components/form/checkbox/Checkbox.tsx
+1 -1
View File
@@ -39,7 +39,7 @@ const CheckboxField = forwardRef<HTMLInputElement, Props>(
{
className: classNames(
"relative flex items-start",
!error && descriptionAsLabel ? "text-gray-900" : "text-neutral-900",
!error && descriptionAsLabel ? "text-gray-900" : "text-gray-900",
error && "text-red-800"
),
},
packages/ui/components/form/dropdown/Dropdown.tsx
+1 -1
View File
@@ -47,7 +47,7 @@ DropdownMenuContent.displayName = "DropdownMenuContent";
type DropdownMenuLabelProps = ComponentProps<typeof DropdownMenuPrimitive["Label"]>;
export const DropdownMenuLabel = (props: DropdownMenuLabelProps) => (
<DropdownMenuPrimitive.Label {...props} className="px-3 py-2 text-neutral-500" />
<DropdownMenuPrimitive.Label {...props} className="px-3 py-2 text-gray-500" />
);
type DropdownMenuItemProps = ComponentProps<typeof DropdownMenuPrimitive["CheckboxItem"]>;
packages/ui/components/form/toggleGroup/ToggleGroup.tsx
+2 -2
View File
@@ -43,8 +43,8 @@ export const ToggleGroup = ({ options, onValueChange, isFullWidth, ...props }: T
className={classNames(
"relative rounded-[4px] px-3 py-1 text-sm",
option.disabled
? "text-gray-400 hover:cursor-not-allowed dark:text-neutral-100"
: "dark:text-neutral-200 [&[aria-checked='false']]:hover:font-medium",
? "dark:text-darkgray-900 text-gray-400 hover:cursor-not-allowed"
: "dark:text-darkgray-800 [&[aria-checked='false']]:hover:font-medium",
isFullWidth && "w-full"
)}
ref={(node) => {
packages/ui/components/layout/ShellSubHeading.tsx
+1 -1
View File
@@ -14,7 +14,7 @@ export function ShellSubHeading(props: {
<h2 className="flex content-center items-center space-x-2 text-base font-bold leading-6 text-gray-900 rtl:space-x-reverse">
{props.title}
</h2>
{props.subtitle && <p className="text-sm text-neutral-500 ltr:mr-4">{props.subtitle}</p>}
{props.subtitle && <p className="text-sm text-gray-500 ltr:mr-4">{props.subtitle}</p>}
</div>
{props.actions && <div className="mt-2 flex-shrink-0 sm:mt-0">{props.actions}</div>}
</header>
packages/ui/components/list/List.tsx
+1 -1
View File
@@ -107,7 +107,7 @@ export function ListItemTitle<TComponent extends keyof JSX.IntrinsicElements = "
component,
{
...passThroughProps,
className: classNames("text-sm font-medium text-neutral-900 truncate", props.className),
className: classNames("text-sm font-medium text-gray-900 truncate", props.className),
},
props.children
);
packages/ui/components/navigation/tabs/HorizontalTabItem.tsx
+1 -1
View File
@@ -39,7 +39,7 @@ const HorizontalTabItem = function ({ name, href, linkProps, ...props }: Horizon
//@ts-ignore
<props.icon
className={classNames(
isCurrent ? "text-neutral-900" : "text-gray-400 group-hover:text-gray-500",
isCurrent ? "text-gray-900" : "text-gray-400 group-hover:text-gray-500",
"-ml-0.5 hidden h-4 w-4 ltr:mr-2 rtl:ml-2 sm:inline-block"
)}
aria-hidden="true"
packages/ui/form/radio-area/RadioAreaGroup.tsx
+1 -1
View File
@@ -10,7 +10,7 @@ const RadioArea = React.forwardRef<HTMLInputElement, RadioAreaProps>(
<label className={classNames("relative flex", className)}>
<input
ref={ref}
className="peer absolute top-[0.9rem] left-3 align-baseline text-neutral-900 focus:ring-neutral-500"
className="peer absolute top-[0.9rem] left-3 align-baseline text-gray-900 focus:ring-neutral-500"
type="radio"
{...props}
/>
packages/ui/form/radio-area/Select.tsx
+1 -1
View File
@@ -46,7 +46,7 @@ export const Select = function RadioAreaSelect<TFieldValues extends FieldValues>
disabled && "cursor-default bg-gray-200 focus:ring-0 "
)}>
{getLabel(props.value) ?? placeholder}
<ChevronDownIcon className="float-right h-5 w-5 text-neutral-500" />
<ChevronDownIcon className="float-right h-5 w-5 text-gray-500" />
</CollapsibleTrigger>
<CollapsibleContent>
<RadioAreaGroup className="space-y-2 text-sm" onChange={props.onChange}>