public-offering
/
cal.pub0.org
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: replace ltr and rtl with new ms and me (#8138) 

Co-authored-by: Peer Richelsen <peer@cal.com>
Co-authored-by: Peer Richelsen <peeroke@gmail.com>
pull/7938/head^2
Joe 2023-04-09 14:43:57 +05:30 committed by GitHub
parent d416386d7b
commit e1096620e6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
31 changed files with 165 additions and 1729 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/web/components/AddToHomescreen.tsx
View File

@ -29,7 +29,7 @@ export default function AddToHomescreen() {
<path d="M35 40H15c-1.7 0-3-1.3-3-3V19c0-1.7 1.3-3 3-3h7v2h-7c-.6 0-1 .4-1 1v18c0 .6.4 1 1 1h20c.6 0 1-.4 1-1V19c0-.6-.4-1-1-1h-7v-2h7c1.7 0 3 1.3 3 3v18c0 1.7-1.3 3-3 3z" />
</svg>
</span>
<p className="text-inverted text-xs font-medium ltr:ml-3 rtl:mr-3">
<p className="text-inverted ms-3 text-xs font-medium">
<span className="inline">{t("add_to_homescreen")}</span>
</p>
</div>

2
apps/web/components/booking/BookingListItem.tsx
View File

@ -382,7 +382,7 @@ function BookingListItem(booking: BookingItemProps) {
<span> </span>
{!!booking?.eventType?.price && !booking.paid && (
<Badge className="hidden ltr:ml-2 ltr:mr-2 rtl:ml-2 sm:inline-flex" variant="orange">
<Badge className="ms-2 me-2 hidden sm:inline-flex" variant="orange">
{t("pending_payment")}
</Badge>
)}

2
apps/web/components/booking/pages/BookingPage.tsx
View File

@ -667,7 +667,7 @@ function ErrorMessage({ error }: { error: unknown }) {
<div className="flex-shrink-0">
<FiAlertTriangle className="h-5 w-5 text-blue-400" aria-hidden="true" />
</div>
<div className="ltr:ml-3 rtl:mr-3">
<div className="ms-3">
<p className="text-sm text-blue-700">
{rescheduleUid ? t("reschedule_fail") : t("booking_fail")}{" "}
{error instanceof HttpError || error instanceof Error ? (

2
apps/web/components/eventtype/AvailabilityTab.tsx
View File

@ -142,7 +142,7 @@ const EventTypeScheduleDetails = () => {
<span className="w-16 sm:w-28 sm:text-left">
{format(dayRange.startTime, timeFormat === 12)}
</span>
<span className="ltr:ml-4 rtl:mr-4">-</span>
<span className="ms-4">-</span>
<div className="ml-6">{format(dayRange.endTime, timeFormat === 12)}</div>
</div>
))}

6
apps/web/components/eventtype/EventLimitsTab.tsx
View File

@ -353,7 +353,7 @@ export const EventLimitsTab = ({ eventType }: Pick<EventTypeSetupProps, "eventTy
</div>
)}
{period.type === "RANGE" && (
<div className="inline-flex space-x-2 ltr:ml-2 ltr:mr-2 rtl:ml-2 rtl:space-x-reverse">
<div className="ms-2 me-2 inline-flex space-x-2 rtl:space-x-reverse">
<Controller
name="periodDates"
control={formMethods.control}
@ -373,9 +373,7 @@ export const EventLimitsTab = ({ eventType }: Pick<EventTypeSetupProps, "eventTy
/>
</div>
)}
{period.suffix ? (
<span className="ltr:ml-2 ltr:mr-2 rtl:ml-2">&nbsp;{period.suffix}</span>
) : null}
{period.suffix ? <span className="ms-2 me-2">&nbsp;{period.suffix}</span> : null}
</div>
);
})}

2
apps/web/components/eventtype/EventSetupTab.tsx
View File

@ -238,7 +238,7 @@ export const EventSetupTab = (
className="h-4 w-4"
alt={`${eventLocationType.label} logo`}
/>
<span className="line-clamp-1 text-sm ltr:ml-1 rtl:mr-1">{eventLabel}</span>
<span className="line-clamp-1 ms-1 text-sm">{eventLabel}</span>
</div>
<div className="flex">
<button

2
apps/web/components/security/DisableTwoFactorModal.tsx
View File

@ -82,7 +82,7 @@ const DisableTwoFactorAuthModal = ({ onDisable, onCancel }: DisableTwoFactorAuth
</div>
<div className="mt-5 sm:mt-4 sm:flex sm:flex-row-reverse">
<Button type="submit" className="ltr:ml-2 ltr:mr-2 rtl:ml-2" disabled={isDisabling}>
<Button type="submit" className="ms-2 me-2" disabled={isDisabling}>
{t("disable")}
</Button>
<Button color="secondary" onClick={onCancel}>

9
apps/web/components/security/EnableTwoFactorModal.tsx
View File

@ -178,22 +178,19 @@ const EnableTwoFactorModal = ({ onEnable, onCancel }: EnableTwoFactorModalProps)
<WithStep step={SetupStep.ConfirmPassword} current={step}>
<Button
type="submit"
className="ltr:ml-2 ltr:mr-2 rtl:ml-2"
className="ms-2 me-2"
onClick={handleSetup}
disabled={password.length === 0 || isSubmitting}>
{t("continue")}
</Button>
</WithStep>
<WithStep step={SetupStep.DisplayQrCode} current={step}>
<Button
type="submit"
className="ltr:ml-2 ltr:mr-2 rtl:ml-2"
onClick={() => setStep(SetupStep.EnterTotpCode)}>
<Button type="submit" className="ms-2 me-2" onClick={() => setStep(SetupStep.EnterTotpCode)}>
{t("continue")}
</Button>
</WithStep>
<WithStep step={SetupStep.EnterTotpCode} current={step}>
<Button type="submit" className="ltr:ml-2 ltr:mr-2 rtl:ml-2" disabled={isSubmitting}>
<Button type="submit" className="ms-2 me-2" disabled={isSubmitting}>
{t("enable")}
</Button>
</WithStep>

2
apps/web/components/settings/DisableTwoFactorModal.tsx
View File

@ -90,7 +90,7 @@ const DisableTwoFactorAuthModal = ({
</div>
<div className="mt-5 sm:mt-4 sm:flex sm:flex-row-reverse">
<Button type="submit" className="ltr:ml-2 ltr:mr-2 rtl:ml-2" disabled={isDisabling}>
<Button type="submit" className="ms-2 me-2" disabled={isDisabling}>
{t("disable")}
</Button>
<Button color="secondary" onClick={onCancel}>

9
apps/web/components/settings/EnableTwoFactorModal.tsx
View File

@ -171,22 +171,19 @@ const EnableTwoFactorModal = ({ onEnable, onCancel, open, onOpenChange }: Enable
<WithStep step={SetupStep.ConfirmPassword} current={step}>
<Button
type="submit"
className="ltr:ml-2 ltr:mr-2 rtl:ml-2"
className="ms-2 me-2"
onClick={handleSetup}
disabled={password.length === 0 || isSubmitting}>
{t("continue")}
</Button>
</WithStep>
<WithStep step={SetupStep.DisplayQrCode} current={step}>
<Button
type="submit"
className="ltr:ml-2 ltr:mr-2 rtl:ml-2"
onClick={() => setStep(SetupStep.EnterTotpCode)}>
<Button type="submit" className="ms-2 me-2" onClick={() => setStep(SetupStep.EnterTotpCode)}>
{t("continue")}
</Button>
</WithStep>
<WithStep step={SetupStep.EnterTotpCode} current={step}>
<Button type="submit" className="ltr:ml-2 ltr:mr-2 rtl:ml-2" disabled={isSubmitting}>
<Button type="submit" className="ms-2 me-2" disabled={isSubmitting}>
{t("enable")}
</Button>
</WithStep>

2
apps/web/components/ui/UsernameAvailability/UsernameTextfield.tsx
View File

@ -79,7 +79,7 @@ const UsernameTextfield = (props: ICustomUsernameProps) => {
const ActionButtons = () => {
return usernameIsAvailable && currentUsername !== inputUsernameValue ? (
<div className="rlt:space-x-reverse mt-px flex flex-row space-x-2 ltr:ml-2 ltr:mr-2 rtl:ml-2 rtl:space-x-reverse">
<div className="rlt:space-x-reverse ms-2 me-2 mt-px flex flex-row space-x-2 rtl:space-x-reverse">
<Button
type="button"
onClick={() => setOpenDialogSaveUsername(true)}

2
apps/web/components/ui/form/CheckboxField.tsx
View File

@ -52,7 +52,7 @@ const CheckboxField = forwardRef<HTMLInputElement, Props>(
className="text-primary-600 focus:ring-primary-500 border-default h-4 w-4 rounded"
/>
</div>
<span className="text-sm ltr:ml-3 rtl:mr-3">{description}</span>
<span className="ms-3 text-sm">{description}</span>
</>
)}
{informationIconText && <InfoBadge content={informationIconText} />}

2
apps/web/package.json
View File

@ -170,7 +170,7 @@
"module-alias": "^2.2.2",
"msw": "^0.42.3",
"postcss": "^8.4.18",
"tailwindcss": "^3.2.1",
"tailwindcss": "^3.3.1",
"ts-jest": "^28.0.8",
"ts-node": "^10.9.1",
"typescript": "^4.9.4"

2
apps/web/pages/event-types/index.tsx
View File

@ -586,7 +586,7 @@ const EventTypeListHeading = ({
{profile?.name || ""}
</Link>
{membershipCount && teamId && (
<span className="text-subtle relative -top-px text-xs ltr:ml-2 ltr:mr-2 rtl:ml-2">
<span className="text-subtle ms-2 me-2 relative -top-px text-xs">
<Link href={`/settings/teams/${teamId}/members`}>
<Badge variant="gray">
<FiUsers className="mr-1 -mt-px inline h-3 w-3" />

2
apps/web/pages/settings/my-account/profile.tsx
View File

@ -353,7 +353,7 @@ const ProfileForm = ({
render={({ field: { value } }) => (
<>
<Avatar alt="" imageSrc={value} gravatarFallbackMd5="fallback" size="lg" />
<div className="ltr:ml-4 rtl:mr-4">
<div className="ms-4">
<ImageUploader
target="avatar"
id="avatar-upload"

2
packages/features/ee/teams/components/CreateANewTeamForm.tsx
View File

@ -123,7 +123,7 @@ export const CreateANewTeamForm = () => {
render={({ field: { value } }) => (
<div className="flex items-center">
<Avatar alt="" imageSrc={value || null} gravatarFallbackMd5="newTeam" size="lg" />
<div className="ltr:ml-4 rtl:mr-4">
<div className="ms-4">
<ImageUploader
target="avatar"
id="avatar-upload"

2
packages/features/ee/teams/components/MemberChangeRoleModal.tsx
View File

@ -99,7 +99,7 @@ export default function MemberChangeRoleModal(props: {
</p>
)}
<div className="mt-5 sm:mt-4 sm:flex sm:flex-row-reverse">
<Button type="submit" color="primary" className="ltr:ml-2 ltr:mr-2 rtl:ml-2">
<Button type="submit" color="primary" className="ms-2 me-2">
{t("save")}
</Button>
<Button type="button" color="secondary" onClick={props.onExit}>

2
packages/features/ee/teams/components/MemberInvitationModal.tsx
View File

@ -151,7 +151,7 @@ export default function MemberInvitationModal(props: MemberInvitationModalProps)
<Button
type="submit"
color="primary"
className="ltr:ml-2 ltr:mr-2 rtl:ml-2"
className="ms-2 me-2"
data-testid="invite-new-member-button">
{t("invite")}
</Button>

6
packages/features/ee/teams/components/MemberListItem.tsx
View File

@ -108,7 +108,7 @@ export default function MemberListItem(props: Props) {
className="h-10 w-10 rounded-full"
/>
<div className="inline-block ltr:ml-3 rtl:mr-3">
<div className="ms-3 inline-block">
<div className="mb-1 flex">
<span className="text-default mr-1 text-sm font-bold leading-4">{name}</span>
@ -121,11 +121,11 @@ export default function MemberListItem(props: Props) {
</span>
{bookingLink && (
<>
<span className="mx-2 block text-default">•</span>
<span className="text-default mx-2 block">•</span>
<a
target="_blank"
href={`${WEBAPP_URL}/${props.member.username}`}
className="block text-sm text-default">
className="text-default block text-sm">
{bookingLink}
</a>
</>

2
packages/features/ee/teams/components/TeamAvailabilityModal.tsx
View File

@ -38,7 +38,7 @@ export default function TeamAvailabilityModal(props: Props) {
alt={props.member?.name || ""}
className="h-14 w-14 rounded-full"
/>
<div className="inline-block pt-1 ltr:ml-3 rtl:mr-3">
<div className="ms-3 inline-block pt-1">
<span className="text-default text-lg font-bold">{props.member?.name}</span>
<span className="text-muted -mt-1 block text-sm">{props.member?.email}</span>
</div>

6
packages/features/ee/teams/components/TeamAvailabilityScreen.tsx
View File

@ -34,7 +34,7 @@ export default function TeamAvailabilityScreen(props: Props) {
if (!member) return <></>;
return (
<div key={member.id} style={style} className="flex border-r border-subtle pl-4 ">
<div key={member.id} style={style} className="border-subtle flex border-r pl-4 ">
<TeamAvailabilityTimes
teamId={props.team?.id as number}
memberId={member.id}
@ -49,7 +49,7 @@ export default function TeamAvailabilityScreen(props: Props) {
alt={member?.name || ""}
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">
<div className="ms-3 inline-block overflow-hidden pt-1">
<span className="text-default truncate text-lg font-bold">{member?.name}</span>
<span className="text-muted -mt-1 block truncate text-sm">{member?.email}</span>
</div>
@ -62,7 +62,7 @@ export default function TeamAvailabilityScreen(props: Props) {
return (
<div className="bg-default flex flex-1 flex-col rounded-sm border border-neutral-200">
<div className="flex w-full space-x-5 border-b border-subtle p-4 rtl:space-x-reverse">
<div className="border-subtle flex w-full space-x-5 border-b p-4 rtl:space-x-reverse">
<div className="flex flex-col">
<span className="text-default text-sm font-medium">Date</span>
<DatePicker

4
packages/features/ee/teams/components/TeamInviteListItem.tsx
View File

@ -67,7 +67,7 @@ export default function TeamInviteListItem(props: Props) {
alt="Team Logo"
className=""
/>
<div className="inline-block ltr:ml-3 rtl:mr-3">
<div className="ms-3 inline-block">
<span className="text-emphasis text-sm font-semibold">{team.name}</span>
<span className="text-default block text-sm leading-5">
{t("invited_by_team", { teamName: team.name, role: t(team.role.toLocaleLowerCase()) })}
@ -89,7 +89,7 @@ export default function TeamInviteListItem(props: Props) {
<div className="hidden sm:flex">
<Button
type="button"
className="mr-3 border-empthasis"
className="border-empthasis mr-3"
variant="icon"
color="secondary"
onClick={declineInvite}

4
packages/features/ee/teams/components/TeamListItem.tsx
View File

@ -105,7 +105,7 @@ export default function TeamListItem(props: Props) {
alt="Team Logo"
className="inline-flex justify-center"
/>
<div className="inline-block ltr:ml-3 rtl:mr-3">
<div className="ms-3 inline-block">
<span className="text-default text-sm font-bold">{team.name}</span>
<span className="text-muted block text-xs">
{team.slug ? `${process.env.NEXT_PUBLIC_WEBSITE_URL}/team/${team.slug}` : "Unpublished team"}
@ -154,7 +154,7 @@ export default function TeamListItem(props: Props) {
type="button"
color="secondary"
StartIcon={FiCheck}
className="ltr:ml-2 ltr:mr-2 rtl:ml-2"
className="ms-2 me-2"
onClick={acceptInvite}>
{t("accept")}
</Button>

6
packages/features/ee/teams/components/v2/TeamAvailabilityScreen.tsx
View File

@ -34,7 +34,7 @@ export default function TeamAvailabilityScreen(props: Props) {
if (!member) return <></>;
return (
<div key={member.id} style={style} className="flex border-r border-subtle pl-4 ">
<div key={member.id} style={style} className="border-subtle flex border-r pl-4 ">
<TeamAvailabilityTimes
teamId={props.team?.id as number}
memberId={member.id}
@ -49,7 +49,7 @@ export default function TeamAvailabilityScreen(props: Props) {
alt={member?.name || ""}
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">
<div className="ms-3 inline-block overflow-hidden pt-1">
<span className="text-default truncate text-lg font-bold">{member?.name}</span>
<span className="text-muted -mt-1 block truncate text-sm">{member?.email}</span>
</div>
@ -62,7 +62,7 @@ export default function TeamAvailabilityScreen(props: Props) {
return (
<div className="bg-default flex flex-1 flex-col rounded-sm border border-neutral-200">
<div className="flex w-full space-x-5 border-b border-subtle p-4 rtl:space-x-reverse">
<div className="border-subtle flex w-full space-x-5 border-b p-4 rtl:space-x-reverse">
<div className="flex flex-col">
<span className="text-default text-sm font-medium">Date</span>
<DatePicker

2
packages/features/ee/teams/pages/team-profile-view.tsx
View File

@ -165,7 +165,7 @@ const ProfileView = () => {
render={({ field: { value } }) => (
<>
<Avatar alt="" imageSrc={getPlaceholderAvatar(value, team?.name as string)} size="lg" />
<div className="ltr:ml-4 rtl:mr-4">
<div className="ms-4">
<ImageUploader
target="avatar"
id="avatar-upload"

8
packages/features/form-builder/Components.tsx
View File

@ -249,9 +249,7 @@ export const Components: Record<BookingFieldType, Component> = {
value={option.value}
checked={value.includes(option.value)}
/>
<span className="dark:text-inverted text-sm ltr:ml-2 ltr:mr-2 rtl:ml-2">
{option.label ?? ""}
</span>
<span className="dark:text-inverted ms-2 me-2 text-sm">{option.label ?? ""}</span>
</label>
);
})}
@ -316,9 +314,7 @@ export const Components: Record<BookingFieldType, Component> = {
}}
checked={value?.value === option.value}
/>
<span className="dark:text-inverted text-sm ltr:ml-2 ltr:mr-2 rtl:ml-2">
{option.label ?? ""}
</span>
<span className="dark:text-inverted ms-2 me-2 text-sm">{option.label ?? ""}</span>
</label>
);
})

4
packages/features/settings/layouts/SettingsLayout.tsx
View File

@ -264,7 +264,7 @@ const SettingsSidebarContainer = ({
/>
<p className="w-1/2 truncate">{team.name}</p>
{!team.accepted && (
<Badge className="ltr:ml-3 rtl:mr-3" variant="orange">
<Badge className="ms-3" variant="orange">
Inv.
</Badge>
)}
@ -448,7 +448,7 @@ function ShellHeader() {
<div className="bg-emphasis mb-1 h-6 w-32 animate-pulse rounded-md" />
)}
</div>
<div className="flex-shrink-0 ltr:ml-auto rtl:mr-auto">{meta.CTA}</div>
<div className="ms-auto flex-shrink-0">{meta.CTA}</div>
</div>
</header>
);

2
packages/ui/components/button/Button.tsx
View File

@ -238,7 +238,7 @@ export const Button = forwardRef<HTMLAnchorElement | HTMLButtonElement, ButtonPr
<>
{variant === "fab" ? (
<>
<EndIcon className="-mr-1 hidden h-5 w-5 ltr:ml-2 rtl:-ml-1 rtl:mr-2 md:inline" />
<EndIcon className="ms-2 me-2 -mr-1 hidden h-5 w-5 md:inline" />
<FiPlus className="inline h-6 w-6 md:hidden" />
</>
) : (

2
packages/ui/components/form/switch/Switch.tsx
View File

@ -56,7 +56,7 @@ const Switch = (
<Label.Root
htmlFor={id}
className={cx(
"text-emphasis align-text-top text-sm font-medium ltr:ml-2 rtl:mr-2",
"text-emphasis ms-2 align-text-top text-sm font-medium",
primitiveProps.disabled ? "cursor-not-allowed opacity-25" : "cursor-pointer "
)}>
{label}

2
packages/ui/form/radio-area/Radio.tsx
View File

@ -30,7 +30,7 @@ export const Label = (props: JSX.IntrinsicElements["label"] & { disabled?: boole
<label
{...props}
className={classNames(
"text-emphasis w-full text-sm font-medium leading-5 ltr:ml-2 rtl:mr-2",
"text-emphasis ms-2 w-full text-sm font-medium leading-5",
props.disabled && "text-subtle"
)}
/>

1792
yarn.lock
View File

File diff suppressed because it is too large Load Diff