Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

会費ページのフロントを作成 #98

Open
wants to merge 8 commits into
base: main
Choose a base branch
from
+47 −12
Open

会費ページのフロントを作成 #98

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
d5d7c07
修正
0514kento Aug 22, 2022
2884640
修正
0514kento Aug 28, 2022
77872ea
Merge branch 'main' of github.com:ycu-engine/ds-club-site into morita
0514kento Aug 29, 2022
ef9aa78
Merge branch 'main' of github.com:ycu-engine/ds-club-site into morita
0514kento Aug 29, 2022
c152b02
ほぼ完成
0514kento Aug 31, 2022
be38480
写真添付
0514kento Sep 2, 2022
230abdd
Merge branch 'main' into morita
mokroke Sep 3, 2022
972c3be
Update services/backend/src/bin/createUser.ts
nyatinte Sep 4, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added ...JcAg6U/firestore_export/all_namespaces/all_kinds/all_namespaces_all_kinds.export_metadata
View file
Open in desktop
Binary file not shown.
Binary file added ...se/firebase-export-1660870771922JcAg6U/firestore_export/all_namespaces/all_kinds/output-0
View file
Open in desktop
Binary file not shown.
Binary file added ...base-export-1660870771922JcAg6U/firestore_export/firestore_export.overall_export_metadata
View file
Open in desktop
Binary file not shown.
2 changes: 1 addition & 1 deletion services/backend/src/bin/createUser.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { PaymentStatus, RankKind, UserRole } from '../generates/graphql'
import { createUserWithId } from '../modules/user'

const main = async () => {
await createUserWithId('eee', {
await createUserWithId('LFoYLqtv4t5AXKSNDzuWC3ngTjlD', {
currentRank: RankKind.Evangelist,
name: '諸田健太朗',
paymentStatus: PaymentStatus.Paid,
Expand Down
Binary file added services/frontend/src/assets/images/pay.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
57 changes: 46 additions & 11 deletions services/frontend/src/pages/member_fee.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,16 +1,34 @@
import { DefaultLayout } from '../components/DefaultLayout'
import { Text, Box, Heading, Flex } from '@chakra-ui/react'
import Image from 'next/image'
import Pay from '../assets/images/pay.jpg'
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Payという命名だと少し意味が分かりにくいように感じました。
PaidIconのような名前だと個人的には分かりやすいです！

import {
Text,
Box,
Heading,
Flex,
OrderedList,
ListItem,
} from '@chakra-ui/react'

const Page = () => {
return (
<DefaultLayout>
<Flex direction={{ base: 'column', md: 'row' }} gap={5}>
<Box background="#fff" borderRadius="3xl" flex={1} p={5}>
<Flex direction={{ base: 'column', md: 'row' }} gap={5} padding={10}>
<Box background="#fff" borderRadius="3xl" flex={2} p={5}>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

<Box background="#fff" ...>となっていますが、chakrauiでは短縮されたpropsが用意されています。

<Box bg="white" ...>のように書くとchakraっぽくていいと思います

<Heading textAlign="center">支払い状況</Heading>

<Image src={Pay} />
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

画像サイズが大きすぎると思います

このようなページは1画面上で全て情報が完結することが望ましいと思うのでboxSizepropsなどで少しサイズを変更するとさらに良くなると思います。

Image - Chakra UI

</Box>

<Flex direction="column" flex={1}>
<Box background="#fff" borderRadius="3xl" flex={1} p={5}>
<Flex direction="column" flex={1} justify="left" padding={10}>
<Box
background="#fff"
borderRadius="3xl"
flex={1}
margin={5}
mx="auto"
p={5}
>
<Text color="pink.500" fontSize="3xl" textAlign="center">
名前：
<Text as="span" color="#000">
Expand All @@ -26,17 +44,34 @@ const Page = () => {
</Text>
</Box>

<Box background="#fff" borderRadius="3xl" flex={1} p={5}>
<Box
background="#fff"
borderRadius="3xl"
flex={1}
mx="auto"
p={5}
padding={10}
>
<Text fontSize="2xl" textAlign="left">
&emsp;会費についての注意事項
</Text>

<Text fontSize="2xl" textAlign="center">
1.会費の徴収は4月と10月に行います 2.徴収金額は3000円です
3.脱退される場合、月割り計算で差額を返金致します
4.会費を期限内に納めていただけない場合、除名処分及び在籍期間中の会費を請求します
</Text>
<OrderedList fontSize="2xl" textAlign="left">
<ListItem>会費の徴収は4月と10月に行います</ListItem>

<ListItem>徴収金額は3000円です</ListItem>

<ListItem>
脱退される場合、月割り計算で差額を返金致します
</ListItem>

<ListItem>
会費を期限内に納めていただけない場合、除名処分及び在籍期間中の会費を請求します
</ListItem>
</OrderedList>
</Box>

<Text>支払いはこちらから</Text>
</Flex>
</Flex>
</DefaultLayout>
Expand Down