Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commitad887b5

Browse files
committed
NITS from design call with designerman
1 parent84582aa commitad887b5

File tree

15 files changed

+56
-29
lines changed

15 files changed

+56
-29
lines changed

‎apps/web/modules/onboarding/components/OnboardingLayout.tsx‎

Lines changed: 29 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
"use client";
22

3+
importclassNamesfrom"classnames";
34
import{signOut}from"next-auth/react";
45
import{Children,typeReactNode}from"react";
56

@@ -9,11 +10,12 @@ import { Logo } from "@calcom/ui/components/logo";
910

1011
typeOnboardingLayoutProps={
1112
userEmail:string;
12-
currentStep:1|2|3|4;
13+
currentStep:number;
14+
totalSteps:number;
1315
children:ReactNode;
1416
};
1517

16-
exportconstOnboardingLayout=({ userEmail, currentStep, children}:OnboardingLayoutProps)=>{
18+
exportconstOnboardingLayout=({ userEmail, currentStep,totalSteps,children}:OnboardingLayoutProps)=>{
1719
const{ t}=useLocale();
1820

1921
consthandleSignOut=()=>{
@@ -42,17 +44,31 @@ export const OnboardingLayout = ({ userEmail, currentStep, children }: Onboardin
4244

4345
{/* Footer with progress dots and sign out */}
4446
<divclassName="flex w-full flex-col items-center justify-center gap-4 px-10 py-8">
45-
<divclassName="flex items-center gap-2">
46-
{[1,2,3,4].map((step)=>(
47-
<divkey={step}className="relative flex h-2 w-2 shrink-0 items-center justify-center">
48-
<div
49-
className={`absolute inset-0 rounded-full${
50-
step<=currentStep ?"bg-emphasis" :"bg-muted"
51-
}`}
52-
/>
53-
{step<=currentStep&&<divclassName="bg-emphasis absolute h-1 w-1 rounded-full"/>}
54-
</div>
55-
))}
47+
<divclassName="flex items-center gap-3">
48+
{Array.from({length:totalSteps},(_,i)=>i+1).map((step)=>{
49+
constisCurrentStep=step===currentStep;
50+
constisCompleted=step<currentStep;
51+
return(
52+
<divkey={step}className="relative flex shrink-0 items-center justify-center">
53+
<div
54+
className={classNames("absolute rounded-full transition-all",{
55+
"h-2 w-2":!isCurrentStep,
56+
"h-3 w-3":isCurrentStep,
57+
"bg-emphasis":isCompleted||isCurrentStep,
58+
"bg-muted":!isCompleted&&!isCurrentStep,
59+
})}
60+
/>
61+
{(isCompleted||isCurrentStep)&&(
62+
<div
63+
className={classNames("bg-emphasis absolute rounded-full",{
64+
"h-1 w-1":!isCurrentStep,
65+
"h-1.5 w-1.5":isCurrentStep,
66+
})}
67+
/>
68+
)}
69+
</div>
70+
);
71+
})}
5672
</div>
5773
<ButtononClick={handleSignOut}color="minimal"className="text-subtle h-7">
5874
{t("sign_out")}
@@ -61,4 +77,3 @@ export const OnboardingLayout = ({ userEmail, currentStep, children }: Onboardin
6177
</div>
6278
);
6379
};
64-

‎apps/web/modules/onboarding/components/onboarding-browser-view.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
"use client";
22

3+
importclassNamesfrom"classnames";
4+
35
import{WEBAPP_URL}from"@calcom/lib/constants";
46
import{useLocale}from"@calcom/lib/hooks/useLocale";
57
import{Avatar}from"@calcom/ui/components/avatar";
@@ -95,7 +97,11 @@ export const OnboardingBrowserView = ({
9597
<h2className="text-emphasis text-xl font-semibold leading-tight">
9698
{name||t("your_name")}
9799
</h2>
98-
<pclassName="text-default text-sm leading-normal">
100+
<p
101+
className={classNames("text-sm leading-normal",{
102+
"text-default":bio,
103+
"text-subtle italic":!bio,
104+
})}>
99105
{bio||t("onboarding_browser_view_default_bio")}
100106
</p>
101107
</div>

‎apps/web/modules/onboarding/components/onboarding-organization-browser-view.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
"use client";
22

3+
importclassNamesfrom"classnames";
4+
35
import{WEBAPP_URL}from"@calcom/lib/constants";
46
import{useLocale}from"@calcom/lib/hooks/useLocale";
57
import{Avatar}from"@calcom/ui/components/avatar";
@@ -104,7 +106,11 @@ export const OnboardingOrganizationBrowserView = ({
104106
<h2className="text-emphasis text-xl font-semibold leading-tight">
105107
{name||t("organization_name")}
106108
</h2>
107-
<pclassName="text-default text-sm leading-normal">
109+
<p
110+
className={classNames("text-sm leading-normal",{
111+
"text-default":bio,
112+
"text-subtle italic":!bio,
113+
})}>
108114
{bio||t("onboarding_browser_view_default_bio")}
109115
</p>
110116
</div>

‎apps/web/modules/onboarding/getting-started/onboarding-view.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -106,7 +106,7 @@ export const OnboardingView = ({ userEmail }: OnboardingViewProps) => {
106106
return(
107107
<>
108108
<OnboardingContinuationPrompt/>
109-
<OnboardingLayoutuserEmail={userEmail}currentStep={1}>
109+
<OnboardingLayoutuserEmail={userEmail}currentStep={1}totalSteps={1}>
110110
{/* Left column - Main content */}
111111
<OnboardingCard
112112
title="Select plan"

‎apps/web/modules/onboarding/organization/brand/organization-brand-view.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,7 @@ export const OrganizationBrandView = ({ userEmail }: OrganizationBrandViewProps)
8282
};
8383

8484
return(
85-
<OnboardingLayoutuserEmail={userEmail}currentStep={3}>
85+
<OnboardingLayoutuserEmail={userEmail}currentStep={2}totalSteps={4}>
8686
{/* Left column - Main content */}
8787
<OnboardingCard
8888
title={t("onboarding_org_brand_title")}

‎apps/web/modules/onboarding/organization/details/organization-details-view.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@ export const OrganizationDetailsView = ({ userEmail }: OrganizationDetailsViewPr
7777
};
7878

7979
return(
80-
<OnboardingLayoutuserEmail={userEmail}currentStep={2}>
80+
<OnboardingLayoutuserEmail={userEmail}currentStep={1}totalSteps={4}>
8181
{/* Left column - Main content */}
8282
<OnboardingCard
8383
title={t("onboarding_org_details_title")}

‎apps/web/modules/onboarding/organization/invite/email/organization-invite-email-view.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -113,7 +113,7 @@ export const OrganizationInviteEmailView = ({ userEmail }: OrganizationInviteEma
113113
:[];
114114

115115
return(
116-
<OnboardingLayoutuserEmail={userEmail}currentStep={3}>
116+
<OnboardingLayoutuserEmail={userEmail}currentStep={4}totalSteps={4}>
117117
<divclassName="flex h-full w-full flex-col gap-4">
118118
<OnboardingCard
119119
title={t("onboarding_org_invite_title")}

‎apps/web/modules/onboarding/organization/invite/organization-invite-view.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ export const OrganizationInviteView = ({ userEmail }: OrganizationInviteViewProp
5757
};
5858

5959
return(
60-
<OnboardingLayoutuserEmail={userEmail}currentStep={3}>
60+
<OnboardingLayoutuserEmail={userEmail}currentStep={4}totalSteps={4}>
6161
<divclassName="flex h-full w-full flex-col gap-4">
6262
<OnboardingCard
6363
title={t("onboarding_org_invite_title")}

‎apps/web/modules/onboarding/organization/teams/organization-teams-view.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ export const OrganizationTeamsView = ({ userEmail }: OrganizationTeamsViewProps)
6565
});
6666

6767
return(
68-
<OnboardingLayoutuserEmail={userEmail}currentStep={4}>
68+
<OnboardingLayoutuserEmail={userEmail}currentStep={3}totalSteps={4}>
6969
{/* Left column - Main content */}
7070
<OnboardingCard
7171
title={t("onboarding_org_teams_title")}

‎apps/web/modules/onboarding/personal/calendar/personal-calendar-view.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ export const PersonalCalendarView = ({ userEmail }: PersonalCalendarViewProps) =
3636
};
3737

3838
return(
39-
<OnboardingLayoutuserEmail={userEmail}currentStep={2}>
39+
<OnboardingLayoutuserEmail={userEmail}currentStep={2}totalSteps={2}>
4040
{/* Left column - Main content */}
4141
<OnboardingCard
4242
title={t("connect_your_calendar")}

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp