Skip to content

Commit b4c098a

Browse files
jhy979jhy979
authored
Merge pull request #885 from woowacourse-teams/develop
[release] v1.1.5
2 parents 37883dd + 94dafd0 commit b4c098a

File tree

50 files changed

+371
-200
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

50 files changed

+371
-200
lines changed

‎README.md

+11-5
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<div align="center">
22
<img src="https://user-images.githubusercontent.com/11745691/185735071-5eb23eaa-745b-4d69-a336-b64e5a6f011e.png" />
33

4-
달력이 기록을 공유할 때, 달록 🌙
4+
### 달력이 기록을 공유할 때, 달록 🌙
55

6-
[<img src="https://img.shields.io/badge/-dallog.me-important?style=flat&logo=google-chrome&logoColor=white" />](https://dallog.me) [<img src="https://img.shields.io/badge/-tech blog-blue?style=flat&logo=google-chrome&logoColor=white" />](https://dallog.github.io) [<img src="https://img.shields.io/badge/release-v1.1.3-critical?style=flat&logo=google-chrome&logoColor=white" />](https://github.com/woowacourse-teams/2022-dallog/releases/tag/v1.1.3)
6+
[<img src="https://img.shields.io/badge/-dallog.me-important?style=flat&logo=google-chrome&logoColor=white" />](https://dallog.me) [<img src="https://img.shields.io/badge/-tech blog-blue?style=flat&logo=google-chrome&logoColor=white" />](https://dallog.github.io) [<img src="https://img.shields.io/badge/release-v1.1.5-critical?style=flat&logo=google-chrome&logoColor=white" />](https://github.com/woowacourse-teams/2022-dallog/releases/tag/v1.1.5)
77

88
[](https://dallog.me)
99

@@ -13,6 +13,8 @@
1313

1414
달록은 우아한테크코스 공유 캘린더입니다. 우아한테크코스 공식 일정, 데일리 팀, 스터디 등 파편화된 여러 일정을 모아 달록에서 관리할 수 있습니다. 사용자는 관심있는 일정 카테고리를 구독하여 개인화된 캘린더를 사용할 수 있습니다.
1515

16+
**[달록을 더 자세히 알아보고 싶다면, 여기로!](https://sites.google.com/woowahan.com/woowacourse-demo-4th/%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8/%EB%8B%AC%EB%A1%9D)**
17+
1618
## 🖥 서비스 화면
1719

1820
![](https://user-images.githubusercontent.com/11745691/194251748-1a5f5819-7ae8-4648-a45e-6c02399af812.png)
@@ -21,15 +23,19 @@
2123

2224
### Front-end
2325

24-
![](https://user-images.githubusercontent.com/11745691/188255671-080e1818-dadc-43d1-91f0-911f7b12add5.png)
26+
![](https://user-images.githubusercontent.com/11745691/197112888-c634aecc-fe5b-4087-94f9-cd4d0c4ab553.png)
2527

2628
### Back-end
2729

28-
![](https://user-images.githubusercontent.com/11745691/188255703-966c55f6-b868-49c2-a915-8e6fc84ce287.png)
30+
![](https://user-images.githubusercontent.com/11745691/197112828-fd63411d-f7be-4501-b13e-5b450ccf0c40.png)
2931

3032
## ⚙️ Infrastructure
3133

32-
![](https://user-images.githubusercontent.com/11745691/185746996-8c2ec104-95a4-472e-9ad0-27a2a22ce821.png)
34+
![](https://user-images.githubusercontent.com/11745691/197112936-d3b80ed4-f0fb-477a-8099-2600f36e9061.png)
35+
36+
## 🔀 CI/CD Pipeline
37+
38+
![](https://user-images.githubusercontent.com/11745691/197113000-dc562bfa-c1ad-4500-91d9-908b2d7c7014.png)
3339

3440
## 🌈 알록달록하게 일을 더 잘하는 9가지 방법
3541

‎frontend/src/@types/emotion.d.ts

+11-4
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,21 @@
11
import { SerializedStyles } from '@emotion/react';
22

3-
interface Colors {
3+
interface ColorsType {
44
[key: string]: string;
55
}
66

7-
type Flex = Record<'row' | 'column', SerializedStyles>;
7+
type FlexType = Record<'row' | 'column', SerializedStyles>;
8+
9+
interface MQType {
10+
laptop: string;
11+
tablet: string;
12+
mobile: string;
13+
}
814

915
declare module '@emotion/react' {
1016
export interface Theme {
11-
colors: Colors;
12-
flex: Flex;
17+
colors: ColorsType;
18+
flex: FlexType;
19+
mq?: MQType;
1320
}
1421
}

‎frontend/src/components/@common/Fieldset/Fieldset.styles.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ const inputStyle = ({ colors }: Theme, isValid?: boolean) => css`
2323
padding: 3rem;
2424
2525
width: 100%;
26-
border-radius: 8px;
26+
border-radius: 7px;
2727
border: 1px solid ${isValid === false ? colors.RED_400 : colors.GRAY_400};
2828
2929
font-family: inherit;

‎frontend/src/components/@common/PageLayout/PageLayout.styles.ts

+7-4
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,17 @@
1-
import { css } from '@emotion/react';
1+
import { css, Theme } from '@emotion/react';
22

3-
const pageLayout = (isSideBarOpen: boolean) => css`
3+
const pageLayout = ({ mq }: Theme, isSideBarOpen: boolean) => css`
44
overflow-y: auto;
55
position: relative;
66
77
height: calc(100vh - 16rem);
88
margin-top: 16rem;
9-
margin-left: ${isSideBarOpen ? '64rem' : '0'};
109
11-
transition: margin-left 0.3s;
10+
${mq?.laptop} {
11+
margin-left: ${isSideBarOpen ? '64rem' : '0'};
12+
13+
transition: margin-left 0.3s;
14+
}
1215
`;
1316

1417
export { pageLayout };

‎frontend/src/components/@common/PageLayout/PageLayout.tsx

+4-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { useTheme } from '@emotion/react';
12
import { useRecoilValue } from 'recoil';
23

34
import { sideBarState } from '@/recoil/atoms';
@@ -9,9 +10,11 @@ interface PageLayoutProps {
910
}
1011

1112
function PageLayout({ children }: PageLayoutProps) {
13+
const theme = useTheme();
14+
1215
const isSideBarOpen = useRecoilValue(sideBarState);
1316

14-
return <div css={pageLayout(isSideBarOpen)}>{children}</div>;
17+
return <div css={pageLayout(theme, isSideBarOpen)}>{children}</div>;
1518
}
1619

1720
export default PageLayout;

‎frontend/src/components/@common/Responsive/Responsive.styles.ts

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import { css, Theme } from '@emotion/react';
2+
3+
const layoutStyle = ({ mq }: Theme, type: string) => css`
4+
display: none;
5+
6+
width: 100%;
7+
height: 100%;
8+
9+
${type === 'laptop' && mq?.laptop} {
10+
display: block;
11+
}
12+
13+
${type === 'tablet' && mq?.tablet} {
14+
display: block;
15+
}
16+
17+
${type === 'mobile' && mq?.mobile} {
18+
display: block;
19+
}
20+
21+
${type === 'all'} {
22+
display: block;
23+
}
24+
`;
25+
26+
export { layoutStyle };

‎frontend/src/components/@common/Responsive/Responsive.tsx

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { useTheme } from '@emotion/react';
2+
3+
import { layoutStyle } from './Responsive.styles';
4+
5+
interface ResponsiveProps {
6+
type: string;
7+
children: JSX.Element | JSX.Element[];
8+
}
9+
10+
function Responsive({ type = 'all', children }: ResponsiveProps) {
11+
const theme = useTheme();
12+
13+
return <div css={layoutStyle(theme, type)}>{children}</div>;
14+
}
15+
16+
export default Responsive;

‎frontend/src/components/@common/Select/Select.styles.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ const dimmerStyle = (isSelectOpen: boolean) => css`
2424
const selectStyle = ({ colors }: Theme) => css`
2525
width: 100%;
2626
height: 11.75rem;
27-
border-radius: 8px;
27+
border-radius: 7px;
2828
border: 1px solid ${colors.GRAY_400};
2929
3030
font-size: 4rem;
@@ -47,7 +47,7 @@ const optionLayoutStyle = ({ colors }: Theme, isSelectOpen: boolean) => css`
4747
width: 100%;
4848
max-height: ${isSelectOpen ? '50rem' : 0};
4949
border: ${isSelectOpen && `1px solid ${colors.GRAY_400}`};
50-
border-radius: 8px;
50+
border-radius: 7px;
5151
5252
background: ${colors.WHITE};
5353

‎frontend/src/components/@common/Skeleton/Skeleton.styles.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ const skeletonStyle = ({ colors }: Theme, width: string, height: string) => css`
2323
2424
width: ${width};
2525
height: ${height};
26-
border-radius: 4px;
26+
border-radius: 7px;
2727
2828
animation: skeleton 2s infinite ease-out;
2929
`;

‎frontend/src/components/AdminCategoryManageModal/AdminCategoryManageModal.styles.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ const closeModalButtonStyle = css`
1010

1111
const deleteButtonStyle = ({ colors }: Theme) => css`
1212
padding: 2rem;
13-
border-radius: 8px;
13+
border-radius: 7px;
1414
box-shadow: 0 2px 2px ${colors.GRAY_400};
1515
1616
background: ${colors.RED_400};
@@ -29,7 +29,7 @@ const headerStyle = css`
2929

3030
const forgiveButtonStyle = ({ colors }: Theme) => css`
3131
padding: 2rem;
32-
border-radius: 8px;
32+
border-radius: 7px;
3333
box-shadow: 0 2px 2px ${colors.GRAY_400};
3434
3535
background: ${colors.RED_400};
@@ -48,7 +48,7 @@ const layoutStyle = ({ flex, colors }: Theme) => css`
4848
4949
max-height: 100vh;
5050
padding: 12.5rem;
51-
border-radius: 12px;
51+
border-radius: 7px;
5252
5353
background: ${colors.WHITE};
5454
`;
@@ -76,7 +76,7 @@ const listSectionStyle = ({ flex }: Theme) => css`
7676
const renameButtonStyle = ({ colors }: Theme) => css`
7777
height: 8rem;
7878
padding: 2rem;
79-
border-radius: 8px;
79+
border-radius: 7px;
8080
box-shadow: 0 2px 2px ${colors.GRAY_400};
8181
8282
background: ${colors.YELLOW_500};

‎frontend/src/components/CategoryAddModal/CategoryAddModal.styles.ts

+3-3
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ const categoryAddModal = ({ colors, flex }: Theme) => css`
66
width: 120rem;
77
height: 90rem;
88
padding: 12.5rem;
9-
border-radius: 12px;
9+
border-radius: 7px;
1010
justify-content: space-between;
1111
1212
background: ${colors.WHITE};
@@ -46,7 +46,7 @@ const cancelButtonStyle = ({ colors }: Theme) => css`
4646
padding: 2rem 3rem;
4747
box-sizing: border-box;
4848
border: 1px solid ${colors.GRAY_500};
49-
border-radius: 8px;
49+
border-radius: 7px;
5050
box-shadow: 0 2px 2px ${colors.GRAY_400};
5151
5252
background: ${colors.WHITE};
@@ -58,7 +58,7 @@ const cancelButtonStyle = ({ colors }: Theme) => css`
5858
const saveButtonStyle = ({ colors }: Theme) => css`
5959
padding: 2rem 3rem;
6060
box-sizing: border-box;
61-
border-radius: 8px;
61+
border-radius: 7px;
6262
box-shadow: 0 2px 2px ${colors.GRAY_400};
6363
6464
background: ${colors.YELLOW_500};

‎frontend/src/components/CategoryModifyModal/CategoryModifyModal.styles.ts

+3-3
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ const modal = ({ colors, flex }: Theme) => css`
66
width: 120rem;
77
height: 90rem;
88
padding: 12.5rem;
9-
border-radius: 12px;
9+
border-radius: 7px;
1010
justify-content: space-between;
1111
1212
background: ${colors.WHITE};
@@ -46,7 +46,7 @@ const cancelButton = ({ colors }: Theme) => css`
4646
width: 22.5rem;
4747
height: 10rem;
4848
border: 2px solid ${colors.GRAY_500};
49-
border-radius: 8px;
49+
border-radius: 7px;
5050
box-shadow: 0 2px 2px ${colors.GRAY_400};
5151
5252
background: ${colors.WHITE};
@@ -58,7 +58,7 @@ const cancelButton = ({ colors }: Theme) => css`
5858
const saveButton = ({ colors }: Theme) => css`
5959
width: 22.5rem;
6060
height: 10rem;
61-
border-radius: 8px;
61+
border-radius: 7px;
6262
box-shadow: 0 2px 2px ${colors.GRAY_400};
6363
6464
background: ${colors.YELLOW_500};

‎frontend/src/components/Footer/Footer.styles.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { css, Theme } from '@emotion/react';
22

33
const footerStyle = ({ colors, flex }: Theme) => css`
4-
${flex.column}
4+
${flex.column};
55
66
width: 100%;
77
height: 40rem;

‎frontend/src/components/Footer/Footer.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -14,14 +14,14 @@ function Footer() {
1414
};
1515

1616
return (
17-
<div css={footerStyle}>
17+
<footer css={footerStyle}>
1818
<p>우아한테크코스 4기 달록</p>
1919
<p>서울특별시 송파구 올림픽로35다길 42, 14층 (한국루터회관)</p>
2020
<p>Copyright © 2022 달록 - All rights reserved.</p>
2121
<Button cssProp={privacyPolicyButtonStyle} onClick={handleClickPrivacyPolicyButton}>
2222
개인정보처리방침
2323
</Button>
24-
</div>
24+
</footer>
2525
);
2626
}
2727

‎frontend/src/components/GoogleCategoryManageModal/GoogleCategoryManageModal.styles.ts

+3-3
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ const closeModalButtonStyle = css`
1010

1111
const deleteButtonStyle = ({ colors }: Theme) => css`
1212
padding: 2rem;
13-
border-radius: 8px;
13+
border-radius: 7px;
1414
box-shadow: 0 2px 2px ${colors.GRAY_400};
1515
1616
background: ${colors.RED_400};
@@ -33,15 +33,15 @@ const layoutStyle = ({ flex, colors }: Theme) => css`
3333
3434
max-height: 100vh;
3535
padding: 12.5rem;
36-
border-radius: 12px;
36+
border-radius: 7px;
3737
3838
background: ${colors.WHITE};
3939
`;
4040

4141
const renameButtonStyle = ({ colors }: Theme) => css`
4242
height: 8rem;
4343
padding: 2rem;
44-
border-radius: 8px;
44+
border-radius: 7px;
4545
box-shadow: 0 2px 2px ${colors.GRAY_400};
4646
4747
background: ${colors.YELLOW_500};

‎frontend/src/components/GoogleImportModal/GoogleImportModal.styles.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ const layoutStyle = ({ colors, flex }: Theme) => css`
1010
width: 120rem;
1111
height: 120rem;
1212
padding: 12.5rem;
13-
border-radius: 12px;
13+
border-radius: 7px;
1414
1515
background: ${colors.WHITE};
1616

0 commit comments

Comments
 (0)