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

Commit 4771cd4

Browse files
mydearxymmydearxym
authored
style(about-thread): adjust theme color & item style (#1293)
1 parent ea97947 commit 4771cd4

File tree

14 files changed

+63
-47
lines changed

14 files changed

+63
-47
lines changed

‎src/containers/thread/AboutThread/Sidebar.tsx‎

Lines changed: 23 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
import { FC, memo } from 'react'
22

3-
import { Br } from '@/widgets/Common'
3+
import { Br, Divider } from '@/widgets/Common'
4+
import Linker from '@/widgets/Linker'
5+
46
import SocialList from './SocialList'
57

68
import {
@@ -16,36 +18,43 @@ import {
1618
const Sidebar: FC = () => {
1719
return (
1820
<Wrapper>
21+
<Block>
22+
<Title>官方网站</Title>
23+
<Desc>
24+
<Linker src="https://groupher.com" left={-2} />
25+
</Desc>
26+
</Block>
1927
<Block>
2028
<Title>关注我们</Title>
2129
<SocialList />
2230
</Block>
31+
<Block>
32+
<Title>所在地</Title>
33+
<Desc>成都, 厦门</Desc>
34+
</Block>
35+
36+
<Block>
37+
<Title>链接</Title>
38+
<Reports>喜马拉雅</Reports>
39+
</Block>
40+
41+
<Divider />
42+
2343
<Block>
2444
<Title>媒体报道</Title>
45+
<Br top={10} />
2546
<Reports>
2647
<Press>36kr</Press>
2748
<ReportsArticle>
2849
新一代xxx一体化协作平台「XXX」获1000万元Pre
2950
</ReportsArticle>
3051
</Reports>
31-
<Br top={5} />
52+
<Br top={6} />
3253
<Reports>
3354
<Press>科技周刊</Press>
3455
<ReportsArticle>这个平台太酷了</ReportsArticle>
3556
</Reports>
3657
</Block>
37-
<Block>
38-
<Title>播客</Title>
39-
<Reports>喜马拉雅</Reports>
40-
</Block>
41-
<Block>
42-
<Title>加入我们</Title>
43-
<Desc>前端工程师，运营</Desc>
44-
</Block>
45-
<Block>
46-
<Title>所在地</Title>
47-
<Desc>成都, 厦门</Desc>
48-
</Block>
4958
</Wrapper>
5059
)
5160
}

‎src/containers/thread/AboutThread/styles/index.ts‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18,14 +18,12 @@ export const MainWrapper = styled.div`
1818
border-radius: 6px;
1919
margin-top: 12px;
2020
padding-left: 25px;
21-
/* padding-right: 80px; */
22-
/* border-right: 1px solid #eae9e9; */
2321
`
2422
export const Block = styled.div`
2523
margin-bottom: 30px;
2624
padding-bottom: 30px;
2725
border-bottom: 1px solid;
28-
border-bottom-color: #eae9e9; // to-theme
26+
border-bottom-color: ${theme('border')};
2927
width: 600px;
3028
`
3129
export const BottomBlock = styled(Block)`

‎src/containers/thread/AboutThread/styles/members/index.ts‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,15 +22,14 @@ export const MainWrapper = styled.div`
2222
padding-left: 25px;
2323
padding-right: 80px;
2424
margin-right: 65px;
25-
/* border-right: 1px solid #eae9e9; */
2625
`
2726
export const Block = styled.div`
2827
margin-bottom: 30px;
2928
width: 600px;
3029
`
3130
export const BottomBlock = styled(Block)`
3231
border-top: 1px solid;
33-
border-top-color: #eae9e9; // to-theme
32+
border-top-color: ${theme('border')};
3433
padding-top: 30px;
3534
`
3635
export const Header = styled.div`

‎src/containers/thread/AboutThread/styles/sidebar.ts‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,17 +7,18 @@ export const Wrapper = styled.div`
77
height: auto;
88
/* background: #f1f3f4; */
99
border: 1px solid;
10-
/* border-top: 2px solid; */
11-
border-color: #eae9e9;
10+
border-color: ${theme('border')};
1211
border-radius: 5px;
1312
padding: 20px;
13+
padding-top: 24px;
1414
padding-bottom: 0;
15-
margin-top: 12px;
15+
margin-top: 18px;
1616
margin-left: 80px;
1717
`
1818
export const Block = styled.div`
1919
margin-bottom: 20px;
2020
`
21+
2122
export const Title = styled.div`
2223
font-size: 14px;
2324
color: ${theme('thread.articleDigest')};
@@ -26,6 +27,7 @@ export const Title = styled.div`
2627
`
2728
export const Desc = styled.div`
2829
font-size: 14px;
30+
font-weight: 400;
2931
color: ${theme('thread.articleDigest')};
3032
line-height: 1.6;
3133
`
@@ -37,9 +39,14 @@ export const ReportsArticle = styled(Desc)`
3739
`
3840
export const Press = styled.div`
3941
/* color: #ec633f; */
42+
border: 1px solid;
43+
border-color: ${theme('thread.extraInfo')};
4044
color: ${theme('thread.extraInfo')};
4145
font-weight: 600;
42-
font-size: 13px;
46+
padding: 0 4px;
47+
border-radius: 4px;
48+
font-size: 11px;
49+
margin-left: -1px;
4350
margin-right: 8px;
4451
cursor: pointer;
4552
`

‎src/containers/thread/ArticlesThread/styles/index.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,8 @@ export const MainWrapper = styled.div<{ thread: TThread }>`
3030
margin-right: ${({ thread }) =>
3131
includes(thread, values(CARD_THREAD)) ? '35px' : '65px'};
3232
33-
border-right: 1px solid #eae9e9;
33+
border-right: 1px solid;
34+
border-right-color: ${theme('border')};
3435
3536
${css.media.mobile`
3637
padding: 10px 15px;

‎src/containers/thread/ChangelogThread/styles/index.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import styled from 'styled-components'
22

33
import type { TTestable } from '@/spec'
4-
import css from '@/utils/css'
4+
import css, { theme } from '@/utils/css'
55

66
export const Wrapper = styled.div.attrs(({ testid }: TTestable) => ({
77
'data-test-id': testid,
@@ -20,5 +20,6 @@ export const MainWrapper = styled.div`
2020
padding-left: 25px;
2121
padding-right: 80px;
2222
margin-right: 65px;
23-
border-right: 1px solid #eae9e9;
23+
border-right: 1px solid;
24+
border-right-color: ${theme('border')};
2425
`

‎src/containers/thread/HelpThread/styles/category.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ export const Item = styled.div<{ color: string }>`
4949
`
5050
export const MoreLink = styled.div`
5151
color: ${theme('link')};
52-
font-size: 13px;
52+
font-size: 12px;
5353
margin-top: 5px;
5454
margin-left: 24px;
5555

‎src/containers/thread/HelpThread/styles/index.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import styled from 'styled-components'
22

33
import type { TTestable } from '@/spec'
4-
import css from '@/utils/css'
4+
import css, { theme } from '@/utils/css'
55

66
export const Wrapper = styled.div.attrs(({ testid }: TTestable) => ({
77
'data-test-id': testid,
@@ -21,7 +21,8 @@ export const MainWrapper = styled.div`
2121
padding-left: 25px;
2222
padding-right: 80px;
2323
24-
border-right: 1px solid #eae9e9;
24+
border-right: 1px solid;
25+
border-right-color: ${theme('border')};
2526
`
2627
export const CatsWapper = styled.div`
2728
${css.flex()};

‎src/containers/unit/ArticleFooter/styles/author_info/index.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ export const Wrapper = styled.div.attrs(({ testid }: TTestable) => ({
1010
${css.flex('justify-between')};
1111
border-top: 1px solid;
1212
border-bottom: 3px solid;
13-
border-color: #ebebeb; // to-theme
13+
border-color: ${theme('border')};
1414
padding: 26px 5px;
1515
padding-bottom: 32px;
1616

‎src/widgets/Common/index.ts‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,9 +16,8 @@ export const SpaceGrow = styled.div`
1616
`
1717
export const Divider = styled.div<TSpace>`
1818
border-top: 1px solid;
19-
border-top-color: ${theme('thread.articleDigest')};
19+
border-top-color: ${theme('border')};
2020
width: 100%;
21-
opacity: 0.3;
2221
margin-top: ${({ top }) => `${top === undefined ? 20 : top}px`};
2322
margin-bottom: ${({ bottom }) => `${bottom === undefined ? 20 : bottom}px`};
2423
`

0 commit comments

Comments
 (0)