Skip to content

Commit 1b6d980

Browse files
committed
wip: button
1 parent d72b1d9 commit 1b6d980

File tree

13 files changed

+77
-107
lines changed

13 files changed

+77
-107
lines changed

.cspell.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@
1212
"ECCS",
1313
"isready",
1414
"lockb",
15+
"mytheme",
1516
"notistack",
1617
"psql",
1718
"qiita",

web/app/edit/courses/page.tsx

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

3-
import { Box, Button, Typography } from "@mui/material";
3+
import { Box, Typography } from "@mui/material";
44
import Link from "next/link";
55
import { useAboutMe } from "~/api/user";
66
import FullScreenCircularProgress from "~/components/common/FullScreenCircularProgress";
@@ -48,29 +48,12 @@ export default function EditCourses() {
4848
marginTop: "20px",
4949
}}
5050
>
51-
<Button
52-
LinkComponent={Link}
53-
href="/settings/profile"
54-
style={{
55-
borderRadius: "25px",
56-
width: "35vw",
57-
boxShadow: "0px 4px 4px rgba(0, 0, 0, 0.25)",
58-
}}
59-
>
51+
<Link href="/settings/profile" className="btn">
6052
設定画面に戻る
61-
</Button>
62-
<Button
63-
LinkComponent={Link}
64-
href="/edit/profile"
65-
variant="contained"
66-
style={{
67-
borderRadius: "25px",
68-
width: "35vw",
69-
boxShadow: "0px 4px 4px rgba(0, 0, 0, 0.25)",
70-
}}
71-
>
53+
</Link>
54+
<Link href="/edit/profile" className="btn btn-primary">
7255
プロフィール編集へ
73-
</Button>
56+
</Link>
7457
</Box>
7558
</Box>
7659
</NavigateByAuthState>

web/app/edit/profile/page.tsx

Lines changed: 8 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@
33
import EditIcon from "@mui/icons-material/Edit";
44
import {
55
Box,
6-
Button,
76
FormControl,
87
IconButton,
98
InputLabel,
@@ -519,28 +518,20 @@ export default function EditProfile() {
519518
marginTop: "40px",
520519
}}
521520
>
522-
<Button
521+
<button
522+
type="button"
523+
className="btn w-[35vh] rounded-full shadow-gray-400 shadow-md"
523524
onClick={handleBack}
524-
style={{
525-
borderRadius: "25px",
526-
width: "35vw",
527-
boxShadow: "0px 4px 4px rgba(0, 0, 0, 0.25)",
528-
}}
529525
>
530526
設定画面に戻る
531-
</Button>
532-
<Button
533-
variant="contained"
527+
</button>
528+
<button
529+
type="button"
530+
className="btn btn-primary w-[35vh] rounded-full shadow-gray-400 shadow-md"
534531
onClick={handleGoToCourses}
535-
style={{
536-
borderRadius: "25px",
537-
width: "35vw",
538-
boxShadow: "0px 4px 4px rgba(0, 0, 0, 0.25)",
539-
minHeight: "61px",
540-
}}
541532
>
542533
授業編集へ
543-
</Button>
534+
</button>
544535
</Box>
545536
</Box>
546537
) : (

web/app/globals.css

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,7 @@
33
@tailwind utilities;
44

55
.icon-image-preview {
6-
/* TODO: make it flexible */
7-
max-width: 450px;
8-
max-height: 450px;
9-
}
10-
6+
/* TODO: make it flexible */
7+
max-width: 450px;
8+
max-height: 450px;
9+
}

web/app/settings/contact/page.tsx

Lines changed: 5 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Box, Button, Typography } from "@mui/material";
1+
import { Box, Typography } from "@mui/material";
22
import { NavigateByAuthState } from "~/components/common/NavigateByAuthState";
33
import TopNavigation from "~/components/common/TopNavigation";
44

@@ -23,21 +23,14 @@ export default function Contact() {
2323
<Typography sx={{ mb: "16px", lineHeight: "1.8" }}>
2424
ご利用いただきありがとうございます。サービスに関するご意見やバグ報告がございましたら、以下のリンクからお問い合わせください。皆様のフィードバックは、サービスの改善に役立てさせていただきます。
2525
</Typography>
26-
27-
<Button
28-
variant="contained"
26+
<a
2927
href="https://forms.gle/WvFTbsJoHjGp9Qt88"
3028
target="_blank"
31-
sx={{
32-
textAlign: "center",
33-
display: "block",
34-
marginTop: "20px",
35-
padding: "12px",
36-
fontSize: "16px",
37-
}}
29+
rel="noreferrer"
30+
className="btn btn-primary mt-5 w-full"
3831
>
3932
ご意見・バグ報告をする
40-
</Button>
33+
</a>
4134
</Box>
4235
</Box>
4336
</NavigateByAuthState>

web/app/settings/delete/page.tsx

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

33
import { ArrowBack } from "@mui/icons-material";
4-
import { Box, Button, IconButton, Typography } from "@mui/material";
4+
import { Box, IconButton, Typography } from "@mui/material";
55
import Link from "next/link";
66
import { useRouter } from "next/navigation";
77
import { useSnackbar } from "notistack";
@@ -73,21 +73,15 @@ export default function DeleteAccount() {
7373
アカウントを削除した場合、マッチングやチャットに関する情報の一切が削除されます。
7474
</Typography>
7575

76-
<Button
77-
variant="contained"
78-
color="error" // Red color for the button
79-
sx={{
80-
margin: "0 auto",
81-
textAlign: "center",
82-
display: "block",
83-
marginTop: "20px",
84-
padding: "12px",
85-
fontSize: "16px",
86-
}}
87-
onClick={onClick}
88-
>
89-
アカウントを削除する
90-
</Button>
76+
<div className="text-center">
77+
<button
78+
type="button"
79+
className="btn bg-red-500 text-white hover:bg-red-700"
80+
onClick={onClick}
81+
>
82+
アカウントを削除する
83+
</button>
84+
</div>
9185
</Box>
9286
</Box>
9387
);

web/app/signup/common.tsx

Lines changed: 4 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { Button } from "@mui/material";
21
export type Caller = "registration" | "configMenu";
32
export type StepProps<T> = {
43
onSave: (t: T) => void;
@@ -20,17 +19,12 @@ export function NextButton({
2019
children: string;
2120
}) {
2221
return (
23-
<Button
24-
variant={weak ? "text" : "contained"}
25-
sx={{
26-
marginLeft: "auto", // 右に寄せるために margin-left を使用
27-
width: "100px",
28-
height: "44.5px",
29-
borderRadius: "25px",
30-
}}
22+
<button
23+
type="button"
24+
className={`btn ${weak && "btn-primary"} ml-auto h-11 w-24 rounded-3xl`}
3125
onClick={onClick}
3226
>
3327
{children}
34-
</Button>
28+
</button>
3529
);
3630
}

web/app/signup/steps/step1_profile.tsx

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import { useState } from "react";
22

33
import {
44
Box,
5-
Button,
65
FormControl,
76
InputLabel,
87
MenuItem,
@@ -164,9 +163,9 @@ export default function Step1({ onSave, prev, caller }: StepProps<Step1User>) {
164163
}}
165164
>
166165
<span />
167-
<Button onClick={save} variant="contained">
166+
<button type="button" onClick={save} className="btn btn-primary">
168167
{caller === "registration" ? "次へ" : "保存"}
169-
</Button>
168+
</button>
170169
</Box>
171170
</>
172171
);

web/app/signup/steps/step2_img.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Box, Button, Typography } from "@mui/material";
1+
import { Box, Typography } from "@mui/material";
22
import { enqueueSnackbar } from "notistack";
33
import { useCallback, useState } from "react";
44
import type { BackProp, StepProps } from "~/app/signup/common";
@@ -82,12 +82,12 @@ export default function Step2({
8282
width: "100%",
8383
}}
8484
>
85-
<Button onClick={back} variant="text">
85+
<button type="button" onClick={back} className="btn">
8686
前へ
87-
</Button>
88-
<Button onClick={next} variant="contained">
87+
</button>
88+
<button type="button" onClick={next} className="btn btn-primary">
8989
{caller === "registration" ? "次へ" : "保存"}
90-
</Button>
90+
</button>
9191
</Box>
9292
</>
9393
);

web/app/signup/steps/step3_confirmation.tsx

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Box, Button, Typography } from "@mui/material";
1+
import { Box, Typography } from "@mui/material";
22
import type { BackProp, StepProps } from "~/app/signup/common";
33
import type { Step1User } from "~/common/zod/types";
44
import UserAvatar from "~/components/human/avatar";
@@ -69,12 +69,16 @@ export default function Confirmation({
6969
width: "100%",
7070
}}
7171
>
72-
<Button onClick={back} variant="text">
72+
<button type="button" onClick={back} className="btn">
7373
前へ
74-
</Button>
75-
<Button onClick={() => onSave()} variant="contained">
74+
</button>
75+
<button
76+
type="button"
77+
onClick={() => onSave()}
78+
className="btn btn-primary"
79+
>
7680
次へ
77-
</Button>
81+
</button>
7882
</Box>
7983
</>
8084
);

0 commit comments

Comments
 (0)