Skip to content
This repository was archived by the owner on Nov 8, 2022. It is now read-only.

Commit c9072e7

Browse files
authored
chore(changelog): add emotion & adjust (#1296)
* style(changelog-thread): sidebar button/search adjust * feat(changelog-thread): add emotions UI * chore: adjust comment author tag * chore: adjust posts sidebar
1 parent 589ff9d commit c9072e7

File tree

16 files changed

+126
-52
lines changed

16 files changed

+126
-52
lines changed

src/containers/thread/ChangelogThread/Filters.tsx

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,16 +4,26 @@ import { Br } from '@/widgets/Common'
44
import TagsBar from '@/containers/unit/TagsBar'
55
import { TAG_MODE } from '@/constant'
66

7-
import { Wrapper, SearchInput, NewButton, BtnText } from './styles/filters'
7+
import {
8+
Wrapper,
9+
SearchInput,
10+
NewButton,
11+
PublishButton,
12+
BtnText,
13+
} from './styles/filters'
814

915
const Filters: FC = () => {
1016
return (
1117
<Wrapper>
1218
<NewButton>
13-
<BtnText>发布新版本</BtnText>
19+
<BtnText>获取最新版</BtnText>
1420
</NewButton>
1521
<Br bottom={15} />
16-
<SearchInput placeholder="搜索内容..." />
22+
<PublishButton>
23+
<BtnText>新发布</BtnText>
24+
</PublishButton>
25+
<Br bottom={15} />
26+
<SearchInput placeholder="搜索内容" />
1727
<Br bottom={30} />
1828
<TagsBar onSelect={() => console.log} mode={TAG_MODE.LABEL} />
1929
</Wrapper>

src/containers/thread/ChangelogThread/styles/filters.ts

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,18 +21,27 @@ export const SearchInput = styled(Input)`
2121
font-size: 13px;
2222
text-align: center;
2323
border-radius: 15px;
24+
border: 1px solid;
25+
border-color: ${theme('border')};
2426
2527
::placeholder {
26-
color: ${theme('form.text')};
27-
opacity: 0.6;
28+
color: ${theme('thread.articleDigest')};
29+
opacity: 0.8;
2830
}
2931
`
3032
export const NewButton = styled(Button)`
3133
width: 180px;
3234
border-radius: 12px;
3335
`
36+
export const PublishButton = styled(Button)`
37+
width: 180px;
38+
border-radius: 12px;
39+
background: #f5f5f5;
40+
color: ${theme('thread.articleTitle')};
41+
border-color: ${theme('border')};
42+
`
3443
export const BtnText = styled.div`
3544
margin-left: 4px;
36-
font-size: 15px;
45+
font-size: 13px;
3746
margin-top: 2px;
3847
`

src/containers/thread/HelpThread/styles/sidebar.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,8 @@ export const Section = styled.div`
4545
export const Footer = styled.div`
4646
${css.flex('align-center')};
4747
margin-top: 15px;
48-
border-top: 1px solid #eae9e9;
48+
border-top: 1px solid;
49+
border-top-color: ${theme('border')};
4950
padding-top: 20px;
5051
font-size: 12px;
5152
color: ${theme('thread.articleDigest')};

src/containers/thread/ThreadSidebar/ClassicLayout/DynamicPart.tsx

Lines changed: 21 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import { mockUsers } from '@/utils/mock'
1616
import { EVENT } from '@/constant'
1717

1818
import Sticky from '@/widgets/Sticky'
19-
import { SpaceGrow } from '@/widgets/Common'
19+
import { SpaceGrow, Br } from '@/widgets/Common'
2020
// import FiltersMenu from '@/widgets/FiltersMenu'
2121
import PublishButton from '@/widgets/Buttons/PublishButton'
2222
import CommunityJoinBadge from '@/containers/tool/CommunityJoinBadge'
@@ -27,7 +27,7 @@ import {
2727
NoteWrapper,
2828
TagsBarWrapper,
2929
StickyWrapper,
30-
CommunityJoinersTitle,
30+
DividerTitle,
3131
CommunityJoinersNum,
3232
CommunityJoinersWrapper,
3333
JoinerAvatar,
@@ -53,23 +53,31 @@ const ClassicLayout: FC<TProps> = ({
5353
<Sticky offsetTop={50}>
5454
<Fragment>
5555
{showCommunityBadge && (
56-
<CommunityJoinersTitle>
57-
参与者
58-
<CommunityJoinersNum>3829</CommunityJoinersNum>
59-
</CommunityJoinersTitle>
56+
<Fragment>
57+
<DividerTitle>简介</DividerTitle>
58+
<Br top={10} />
59+
<CommunityNoteWrapper>
60+
关于 CoderPlanets 的各种建议,吐槽等请发布到这里 关于 CoderPlanets
61+
的各种建议,吐槽等请发布到这里
62+
</CommunityNoteWrapper>
63+
</Fragment>
64+
)}
65+
66+
{showCommunityBadge && (
67+
<Fragment>
68+
<DividerTitle>
69+
参与者
70+
<CommunityJoinersNum>329</CommunityJoinersNum>
71+
</DividerTitle>
72+
<Br top={14} />
73+
</Fragment>
6074
)}
6175

6276
<CommunityJoinersWrapper show={showCommunityBadge}>
6377
{mockUsers(5).map((user) => (
6478
<JoinerAvatar key={user.id} src={user.avatar} noLazy />
6579
))}
6680
</CommunityJoinersWrapper>
67-
{showCommunityBadge && (
68-
<CommunityNoteWrapper>
69-
关于 CoderPlanets 的各种建议,吐槽等请发布到这里 关于 CoderPlanets
70-
的各种建议,吐槽等请发布到这里
71-
</CommunityNoteWrapper>
72-
)}
7381
</Fragment>
7482

7583
<StickyWrapper>
@@ -78,7 +86,7 @@ const ClassicLayout: FC<TProps> = ({
7886
<PublishButton
7987
thread={thread}
8088
community={community.raw}
81-
text="反馈 & 建议"
89+
text="反馈/建议/问题"
8290
/>
8391
) : (
8492
<NoteWrapper>

src/containers/thread/ThreadSidebar/styles/classic_layout.ts

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -16,12 +16,10 @@ export const Wrapper = styled.div.attrs(({ testid }: TTestable) => ({
1616
export const StickyWrapper = styled.div`
1717
${css.flexColumn()};
1818
`
19-
export const CommunityJoinersTitle = styled.div`
19+
export const DividerTitle = styled.div`
2020
${css.flex('align-center')};
2121
color: ${theme('thread.articleTitle')};
2222
font-size: 14px;
23-
margin-top: -2px;
24-
margin-bottom: 16px;
2523
font-weight: 600;
2624
`
2725
export const CommunityJoinersNum = styled.div`
@@ -36,13 +34,13 @@ export const CommunityJoinersNum = styled.div`
3634
`
3735
export const CommunityJoinersWrapper = styled.div<TActive>`
3836
${css.flex()};
39-
flex-wrap: wrap;
4037
visibility: ${({ show }) => (show ? 'visible' : 'hidden')};
4138
margin-bottom: ${({ show }) => (show ? '15px' : 0)};
4239
height: ${({ show }) => (show ? 'auto' : 0)};
40+
margin-bottom: 25px;
4341
`
4442
export const JoinerAvatar = styled(Img)`
45-
${css.circle(30)};
43+
${css.circle(28)};
4644
margin-right: 8px;
4745
`
4846
export const CommunityNoteWrapper = styled.div`

src/containers/unit/Comments/styles/comment/footer.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@ import css from '@/utils/css'
55

66
export const Wrapper = styled.div`
77
${css.flex('align-center')};
8-
margin-top: 3px;
98
margin-bottom: 5px;
9+
margin-top: -10px;
10+
margin-left: -3px;
1011
`
1112
export const holder = 1

src/containers/unit/Comments/styles/comment/header/article.tsx

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export const Avatar = styled(Img)<{ avatarSize: number }>`
1414
`}
1515
`
1616
export const UserBase = styled.div`
17-
${css.flex('align-end')};
17+
${css.flex('align-center')};
1818
font-size: 15px;
1919
flex-grow: 1;
2020
`
@@ -30,12 +30,14 @@ export const Nickname = styled.div`
3030
export const AuthorTag = styled.div`
3131
font-size: 11px;
3232
margin-bottom: 2px;
33-
padding: 0 8px;
34-
padding-top: 2px;
33+
padding: 1px 8px;
34+
/* padding-top: 2px; */
3535
margin-left: 10px;
36-
background-color: rgba(0, 179, 126, 0.1); // to-theme
37-
color: #056d4e; // to-theme
38-
border-radius: 5px;
36+
background-color: #e2f2f5;
37+
color: #3c4057;
38+
border-radius: 4px;
39+
font-weight: 500;
40+
font-family: 'Audiowide';
3941
4042
${css.media.mobile`
4143
margin-left: 5px;
@@ -76,5 +78,4 @@ export const CreateDate = styled.div`
7678
color: ${theme('comment.floor')};
7779
font-size: 12px;
7880
margin-left: 2px;
79-
opacity: 0.8;
8081
`

src/widgets/Buttons/styles/metircs/button.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -83,7 +83,7 @@ export const getFontSize = (size: string): string => {
8383
}
8484

8585
case SIZE.SMALL: {
86-
return '14px'
86+
return '13px'
8787
}
8888

8989
default: {

src/widgets/Buttons/styles/publish_button/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,6 @@ export const PubButton = styled(Button)`
1818
font-weight: 600;
1919
background: #3b434a; // to-theme
2020
color: #fff; // to-theme
21-
height: 32px;
21+
height: 33px;
2222
border-radius: 15px;
2323
`

src/widgets/Buttons/styles/publish_button/post_layout.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,10 @@ export const Wrapper = styled.div`
1010
`
1111
export const Title = styled.div`
1212
letter-spacing: 2px;
13-
font-size: 14px;
13+
font-size: 13px;
1414
padding-left: 2px;
1515
`
1616
export const EditIcon = styled(EditPenSVG)`
17-
${css.size(14)};
17+
${css.size(13)};
1818
fill: #fff; // to-theme
1919
`

0 commit comments

Comments
 (0)