Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings
This repository was archived by the owner on Nov 8, 2022. It is now read-only.

Commit97bd129

Browse files
committed
Merge branch 'pages' into dev
2 parentsefcdda3 +eeaa83d commit97bd129

File tree

15 files changed

+196
-170
lines changed

15 files changed

+196
-170
lines changed
Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
importReactfrom'react'
2+
importRfrom'ramda'
3+
4+
import{ICON_CMD}from'../../config'
5+
6+
import{
7+
Wrapper,
8+
ThemeDot,
9+
IntroBox,
10+
IntroDesc,
11+
ThemeTitle,
12+
ThemeDesc,
13+
AuthorInfo,
14+
AuthorIcon,
15+
AuthorName,
16+
}from'./style/card_selector'
17+
18+
import{themeMeta,uid}from'../../utils'
19+
20+
constCardSelector=({ curTheme, changeTheme})=>(
21+
<Wrapper>
22+
{R.keys(themeMeta).map(name=>(
23+
<IntroBoxkey={uid.gen()}active={curTheme===name}>
24+
<ThemeDot
25+
large
26+
active={curTheme===name}
27+
name={name}
28+
onClick={changeTheme.bind(this,name)}
29+
/>
30+
<IntroDesc>
31+
<ThemeTitle
32+
active={curTheme===name}
33+
onClick={changeTheme.bind(this,name)}
34+
>
35+
{name}
36+
</ThemeTitle>
37+
<ThemeDesconClick={changeTheme.bind(this,name)}>
38+
{themeMeta[name].desc}
39+
</ThemeDesc>
40+
<AuthorInfo>
41+
<AuthorIconsrc={`${ICON_CMD}/author.svg`}/>
42+
<AuthorName
43+
href="https://www.github.com/mydearxym"
44+
rel="noopener noreferrer"
45+
target="_blank"
46+
>
47+
mydearxym
48+
</AuthorName>
49+
</AuthorInfo>
50+
</IntroDesc>
51+
</IntroBox>
52+
))}
53+
</Wrapper>
54+
)
55+
56+
exportdefaultCardSelector
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
importReactfrom'react'
2+
importRfrom'ramda'
3+
4+
import{Wrapper,ThemeDot}from'./style/dot_selector'
5+
6+
import{themeMeta,uid}from'../../utils'
7+
8+
constDotSelector=({ curTheme, changeTheme})=>(
9+
<Wrapper>
10+
{R.keys(themeMeta).map(name=>(
11+
<ThemeDot
12+
key={uid.gen()}
13+
active={curTheme===name}
14+
name={name}
15+
onClick={changeTheme.bind(this,name)}
16+
/>
17+
))}
18+
</Wrapper>
19+
)
20+
21+
exportdefaultDotSelector

‎components/ThemeSelector/index.js‎

Lines changed: 6 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -6,89 +6,27 @@
66

77
importReactfrom'react'
88
importPropTypesfrom'prop-types'
9-
importRfrom'ramda'
109

11-
import{ICON_CMD}from'../../config'
10+
importDotSelectorfrom'./DotSelector'
11+
importCardSelectorfrom'./CardSelector'
1212

13-
import{
14-
FlexWrapper,
15-
ThemeDot,
16-
DetailWrapper,
17-
IntroBox,
18-
IntroDesc,
19-
ThemeTitle,
20-
ThemeDesc,
21-
AuthorInfo,
22-
AuthorIcon,
23-
AuthorName,
24-
}from'./style'
25-
26-
import{makeDebugger,themeMeta,uid}from'../../utils'
13+
import{makeDebugger}from'../../utils'
2714

2815
/* eslint-disable no-unused-vars */
2916
constdebug=makeDebugger('c:ThemeSelector:index')
3017
/* eslint-enable no-unused-vars */
3118

32-
constDotStyle=({ curTheme, changeTheme})=>(
33-
<FlexWrapper>
34-
{R.keys(themeMeta).map(name=>(
35-
<ThemeDot
36-
key={uid.gen()}
37-
active={curTheme===name}
38-
name={name}
39-
onClick={changeTheme.bind(this,name)}
40-
/>
41-
))}
42-
</FlexWrapper>
43-
)
44-
45-
constDetailStyle=({ curTheme, changeTheme})=>(
46-
<DetailWrapper>
47-
{R.keys(themeMeta).map(name=>(
48-
<IntroBoxkey={uid.gen()}active={curTheme===name}>
49-
<ThemeDot
50-
large
51-
active={curTheme===name}
52-
name={name}
53-
onClick={changeTheme.bind(this,name)}
54-
/>
55-
<IntroDesc>
56-
<ThemeTitle
57-
active={curTheme===name}
58-
onClick={changeTheme.bind(this,name)}
59-
>
60-
{name}
61-
</ThemeTitle>
62-
<ThemeDesconClick={changeTheme.bind(this,name)}>
63-
{themeMeta[name].desc}
64-
</ThemeDesc>
65-
<AuthorInfo>
66-
<AuthorIconsrc={`${ICON_CMD}/author.svg`}/>
67-
<AuthorName
68-
href="https://www.github.com/mydearxym"
69-
rel="noopener noreferrer"
70-
target="_blank"
71-
>
72-
mydearxym
73-
</AuthorName>
74-
</AuthorInfo>
75-
</IntroDesc>
76-
</IntroBox>
77-
))}
78-
</DetailWrapper>
79-
)
80-
8119
constThemeSelector=({ displayStyle, curTheme, changeTheme})=>{
8220
returndisplayStyle==='default' ?(
83-
<DotStylecurTheme={curTheme}changeTheme={changeTheme}/>
21+
<DotSelectorcurTheme={curTheme}changeTheme={changeTheme}/>
8422
) :(
85-
<DetailStylecurTheme={curTheme}changeTheme={changeTheme}/>
23+
<CardSelectorcurTheme={curTheme}changeTheme={changeTheme}/>
8624
)
8725
}
8826

8927
ThemeSelector.propTypes={
9028
curTheme:PropTypes.string,
91-
displayStyle:PropTypes.oneOf(['default','detail']),
29+
displayStyle:PropTypes.oneOf(['default','card']),
9230
changeTheme:PropTypes.func.isRequired,
9331
// https://www.npmjs.com/package/prop-types
9432
}
Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
importstyledfrom'styled-components'
2+
3+
import{Dot}from'./index'
4+
importImgfrom'../../Img'
5+
import{theme}from'../../../utils'
6+
7+
exportconstWrapper=styled.div`
8+
display: flex;
9+
flex-wrap: wrap;
10+
`
11+
12+
exportconstThemeDot=styled(Dot)``
13+
14+
/* background: ${({ active }) => (active ? theme('banner.bg') : '')}; */
15+
exportconstIntroBox=styled.div`
16+
display: flex;
17+
border: 1px solid;
18+
border:${({ active})=>(active ?'2px solid' :'1px dashed')};
19+
border-color:${theme('banner.desc')};
20+
margin-right: 15px;
21+
margin-bottom: 18px;
22+
height: 130px;
23+
width: 210px;
24+
padding: 10px;
25+
border-radius: 5px;
26+
&:hover {
27+
border-top: 2px solid;
28+
border-bottom: 2px solid;
29+
border-color:${theme('banner.desc')};
30+
}
31+
transition: border 0.3s;
32+
`
33+
34+
exportconstIntroDesc=styled.div`
35+
display: flex;
36+
flex-direction: column;
37+
width: 80%;
38+
position: relative;
39+
`
40+
41+
exportconstThemeTitle=styled.div`
42+
color:${theme('banner.title')};
43+
font-size: 1.1rem;
44+
font-weight:${({ active})=>(active ?'bolder' :'')};
45+
cursor: pointer;
46+
margin-top: -2px;
47+
opacity:${({ active})=>(active ?1 :0.8)};
48+
`
49+
50+
exportconstThemeDesc=styled.div`
51+
font-size: 0.8rem;
52+
color:${theme('banner.desc')};
53+
cursor: pointer;
54+
`
55+
56+
exportconstAuthorInfo=styled.div`
57+
font-size: 0.8rem;
58+
color:${theme('banner.desc')};
59+
position: absolute;
60+
bottom: -5px;
61+
left: 0;
62+
display: flex;
63+
`
64+
65+
exportconstAuthorIcon=styled(Img)`
66+
fill:${theme('banner.desc')};
67+
width: 13px;
68+
height: 13px;
69+
margin-right: 5px;
70+
margin-top: 3px;
71+
`
72+
73+
exportconstAuthorName=styled.a`
74+
color:${theme('banner.desc')};
75+
transition: color 0.3s;
76+
&:hover {
77+
text-decoration: underline;
78+
color:${theme('banner.title')};
79+
}
80+
`
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
importstyledfrom'styled-components'
2+
3+
import{Dot}from'./index'
4+
5+
exportconstWrapper=styled.div`
6+
display: flex;
7+
justify-content: center;
8+
`
9+
exportconstThemeDot=styled(Dot)``
Lines changed: 2 additions & 80 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,8 @@
11
importstyledfrom'styled-components'
22

3-
importImgfrom'../../Img'
43
import{theme,themeCoverMap,themeCoverIndexMap}from'../../../utils'
54

6-
exportconstFlexWrapper=styled.div`
7-
display: flex;
8-
justify-content: center;
9-
`
10-
11-
exportconstThemeDot=styled.div`
5+
exportconstDot=styled.div`
126
width: 25px;
137
height: 25px;
148
border-radius: 100%;
@@ -28,76 +22,4 @@ export const ThemeDot = styled.div`
2822
left: 34%;
2923
}
3024
`
31-
32-
exportconstDetailWrapper=styled.div`
33-
display: flex;
34-
flex-wrap: wrap;
35-
`
36-
37-
/* background: ${({ active }) => (active ? theme('banner.bg') : '')}; */
38-
exportconstIntroBox=styled.div`
39-
display: flex;
40-
border: 1px solid;
41-
border:${({ active})=>(active ?'2px solid' :'1px dashed')};
42-
border-color:${theme('banner.desc')};
43-
margin-right: 15px;
44-
margin-bottom: 18px;
45-
height: 130px;
46-
width: 210px;
47-
padding: 10px;
48-
border-radius: 5px;
49-
&:hover {
50-
border-top: 2px solid;
51-
border-bottom: 2px solid;
52-
border-color:${theme('banner.desc')};
53-
}
54-
transition: border 0.3s;
55-
`
56-
57-
exportconstIntroDesc=styled.div`
58-
display: flex;
59-
flex-direction: column;
60-
width: 80%;
61-
position: relative;
62-
`
63-
64-
exportconstThemeTitle=styled.div`
65-
color:${theme('banner.title')};
66-
font-size: 1.1rem;
67-
font-weight:${({ active})=>(active ?'bolder' :'')};
68-
cursor: pointer;
69-
margin-top: -2px;
70-
opacity:${({ active})=>(active ?1 :0.8)};
71-
`
72-
73-
exportconstThemeDesc=styled.div`
74-
font-size: 0.8rem;
75-
color:${theme('banner.desc')};
76-
cursor: pointer;
77-
`
78-
79-
exportconstAuthorInfo=styled.div`
80-
font-size: 0.8rem;
81-
color:${theme('banner.desc')};
82-
position: absolute;
83-
bottom: -5px;
84-
left: 0;
85-
display: flex;
86-
`
87-
88-
exportconstAuthorIcon=styled(Img)`
89-
fill:${theme('banner.desc')};
90-
width: 13px;
91-
height: 13px;
92-
margin-right: 5px;
93-
margin-top: 3px;
94-
`
95-
96-
exportconstAuthorName=styled.a`
97-
color:${theme('banner.desc')};
98-
transition: color 0.3s;
99-
&:hover {
100-
text-decoration: underline;
101-
color:${theme('banner.title')};
102-
}
103-
`
25+
exportconstholder=1

‎containers/UserSettings/index.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,7 @@ class UserSettingsContainer extends React.Component {
6060
<ThemeSelector
6161
curTheme={curTheme}
6262
changeTheme={logic.changeTheme}
63-
displayStyle="detail"
63+
displayStyle="card"
6464
/>
6565
<SectionLabel
6666
title="打赏设置"

‎utils/themes/skins/Blue.js‎renamed to ‎utils/themes/skins/blue.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*
2-
* a theme inspired byMuzli && unbuntu
2+
* a theme inspired bydribble
33
*/
44
import{lighten,darken}from'polished'
55

@@ -15,7 +15,7 @@ const markdownFont = '#7F8189'
1515
constdescText='#4a455a'
1616
constprimaryMate='#a7674d'
1717

18-
constBlue={
18+
constblue={
1919
logoText:primaryColor,
2020
cover:'#586ABD',
2121
coverIndex:'#9e96c3',
@@ -286,4 +286,4 @@ const Blue = {
286286
},
287287
}
288288

289-
exportdefaultBlue
289+
exportdefaultblue

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp