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.

Commit98a6ed3

Browse files
committed
chore: merge branch 'custom-scrollbar' into dev
2 parentsb8755d8 +b4d3e68 commit98a6ed3

File tree

18 files changed

+93
-100
lines changed

18 files changed

+93
-100
lines changed

‎src/components/Modal/styles/index.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,7 @@ export const CloseBtn = styled(Img)`
4949
right: 15px;
5050
top: 15px;
5151
display:${({ show})=>(show ?'block' :'none')};
52+
z-index:${cs.zIndex.modalCloseBtn};
5253
5354
&:hover {
5455
animation:${animate.rotate360CloseRule};
Lines changed: 43 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
11
importReactfrom'react'
22
importRfrom'ramda'
33
importHighlighterfrom'react-highlight-words'
4+
import{OverlayScrollbarsComponent}from'overlayscrollbars-react'
45

6+
// eslint-disable-next-line import/named
57
import{ICON_CMD}from'@config'
68
import{THREAD}from'@constant'
79

@@ -30,43 +32,47 @@ const HintIcon = ({ index, active, cur, length }) => {
3032
}
3133

3234
constResultsList=({ searchValue, searchThread, suggestions, activeRaw})=>(
33-
<Wrapperid="suggestion-scroller">
34-
<SuggestionWrapperempty={suggestions.length===0}>
35-
{suggestions.map((suggestion,i)=>(
36-
<InfoBar
37-
active={activeRaw===suggestion.raw}
38-
key={suggestion.raw}
39-
id={suggestion.raw}
40-
onMouseEnter={navToSuggestion.bind(this,suggestion)}
41-
onClick={suggestionOnSelect}
42-
>
43-
<SuggestIcon
44-
raw={suggestion.raw}
45-
suggestion={suggestion}
46-
round={R.contains(searchThread,[THREAD.POST,THREAD.USER])}
47-
searchThread={searchThread}
48-
/>
49-
<ContentWraper>
50-
<Title>
51-
<Highlighter
52-
highlightClassName="doramon-search-highlighter"
53-
searchWords={[searchValue]}
54-
autoEscape
55-
textToHighlight={suggestion.title}
56-
/>
57-
</Title>
58-
<Desc>{suggestion.desc}</Desc>
59-
</ContentWraper>
60-
<HintIcon
61-
index={i}
62-
active={activeRaw}
63-
cur={suggestion.raw}
64-
length={suggestions.length}
65-
/>
66-
</InfoBar>
67-
))}
68-
</SuggestionWrapper>
69-
</Wrapper>
35+
<OverlayScrollbarsComponent
36+
options={{scrollbars:{autoHide:'scroll',autoHideDelay:200}}}
37+
>
38+
<Wrapper>
39+
<SuggestionWrapperempty={suggestions.length===0}>
40+
{suggestions.map((suggestion,i)=>(
41+
<InfoBar
42+
active={activeRaw===suggestion.raw}
43+
key={suggestion.raw}
44+
id={suggestion.raw}
45+
onMouseEnter={navToSuggestion.bind(this,suggestion)}
46+
onClick={suggestionOnSelect}
47+
>
48+
<SuggestIcon
49+
raw={suggestion.raw}
50+
suggestion={suggestion}
51+
round={R.contains(searchThread,[THREAD.POST,THREAD.USER])}
52+
searchThread={searchThread}
53+
/>
54+
<ContentWraper>
55+
<Title>
56+
<Highlighter
57+
highlightClassName="doramon-search-highlighter"
58+
searchWords={[searchValue]}
59+
autoEscape
60+
textToHighlight={suggestion.title}
61+
/>
62+
</Title>
63+
<Desc>{suggestion.desc}</Desc>
64+
</ContentWraper>
65+
<HintIcon
66+
index={i}
67+
active={activeRaw}
68+
cur={suggestion.raw}
69+
length={suggestions.length}
70+
/>
71+
</InfoBar>
72+
))}
73+
</SuggestionWrapper>
74+
</Wrapper>
75+
</OverlayScrollbarsComponent>
7076
)
7177

7278
exportdefaultResultsList

‎src/containers/Doraemon/index.js‎

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,6 @@
77
importReactfrom'react'
88

99
import{connectStore,buildLog}from'@utils'
10-
import{usePlatform}from'@hooks'
11-
12-
import{PageOverlay,PanelContainer}from'./styles'
1310

1411
importInputEditorfrom'./InputEditor'
1512
importResultsListfrom'./ResultsList'
@@ -18,15 +15,14 @@ import ThreadSelectBar from './ThreadSelectBar'
1815
importAlertBarfrom'./AlertBar'
1916
importUtilsBarfrom'./UtilsBar'
2017

21-
import{useInit,useScrollbar,hidePanel}from'./logic'
18+
import{PageOverlay,PanelContainer}from'./styles'
19+
import{useInit,hidePanel}from'./logic'
2220

2321
/* eslint-disable-next-line */
2422
constlog=buildLog('C:Doraemon')
2523

2624
constDoraemonContainer=({ doraemon})=>{
2725
useInit(doraemon)
28-
const{ isMacOS}=usePlatform()
29-
useScrollbar(isMacOS)
3026

3127
const{
3228
inputValue,

‎src/containers/Doraemon/logic/index.js‎

Lines changed: 1 addition & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import R from 'ramda'
22
import{useEffect}from'react'
33
importRouterfrom'next/router'
44

5+
// eslint-disable-next-line import/named
56
import{ISSUE_ADDR}from'@config'
67
import{TYPE,EVENT,ERR,THREAD}from'@constant'
78
import{
@@ -496,15 +497,6 @@ const initSpecCmdResolver = () => {
496497
// ###############################
497498
// init & uninit handlers
498499
// ###############################
499-
exportconstuseScrollbar=isMacOS=>{
500-
useEffect(()=>{
501-
if(isMacOS){
502-
/* eslint-disable no-undef */
503-
OverlayScrollbars(document.getElementById('suggestion-scroller'),{})
504-
}
505-
},[isMacOS])
506-
}
507-
508500
exportconstuseInit=_store=>{
509501
useEffect(()=>{
510502
store=_store

‎src/containers/Doraemon/styles/results_list.js‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,8 @@ import styled from 'styled-components'
33
importImgfrom'@components/Img'
44
import{theme,animate,cs}from'@utils'
55

6-
exportconstWrapper=styled.div.attrs(({ id})=>({
7-
id,
8-
}))`
6+
exportconstWrapper=styled.div`
97
width: 100%;
10-
overflow: hidden;
118
max-height: 400px;
129
`
1310
exportconstLoadingIcon=styled(Img)`

‎src/containers/GlobalLayout/index.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,9 +8,11 @@ import React from 'react'
88
importTfrom'prop-types'
99
importuseNetworkfrom'react-use/lib/useNetwork'
1010

11-
import'overlayscrollbars/js/OverlayScrollbars'
11+
// custom overlayscrollbars
12+
// see: https://github.com/KingSora/OverlayScrollbars/tree/master/packages/overlayscrollbars-react
1213
import'overlayscrollbars/css/OverlayScrollbars.css'
1314

15+
// eslint-disable-next-line import/named
1416
import{ICON_CMD}from'@config'
1517
import{connectStore}from'@utils'
1618
import{useShortcut,useMedia,usePlatform}from'@hooks'

‎src/containers/MailBox/MailsPanel.js‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
importReactfrom'react'
22
importRfrom'ramda'
3+
import{OverlayScrollbarsComponent}from'overlayscrollbars-react'
34

45
// eslint-disable-next-line import/named
56
import{ICON_CMD}from'@config'
67
importTabSelectorfrom'@components/TabSelector'
78

8-
import{Wrapper,SeeAllMessages}from'./styles/mails_panel'
9+
import{Wrapper,ContentWrapper,SeeAllMessages}from'./styles/mails_panel'
910
importMailListsfrom'./MailLists'
1011

1112
import{selectChange,seeAll}from'./logic'
@@ -48,7 +49,13 @@ const MailsPannel = ({ activeRaw, mailStatus, pagedMentions }) => {
4849
activeRaw={activeRaw}
4950
onChange={selectChange}
5051
/>
51-
<MailListsactiveRaw={activeRaw}pagedMentions={pagedMentions}/>
52+
<OverlayScrollbarsComponent
53+
options={{scrollbars:{autoHide:'scroll',autoHideDelay:200}}}
54+
>
55+
<ContentWrapper>
56+
<MailListsactiveRaw={activeRaw}pagedMentions={pagedMentions}/>
57+
</ContentWrapper>
58+
</OverlayScrollbarsComponent>
5259
<SeeAllMessagesonClick={seeAll}>查看全部消息</SeeAllMessages>
5360
</Wrapper>
5461
)

‎src/containers/MailBox/index.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import React from 'react'
88

99
import{connectStore,buildLog}from'@utils'
1010
importPopoverfrom'@components/Popover'
11+
1112
importMailsPanelfrom'./MailsPanel'
1213

1314
import{Wrapper,NofityDot,HeaderMailIcon}from'./styles'

‎src/containers/MailBox/styles/mails_panel.js‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,12 @@ import { theme } from '@utils'
55
exportconstWrapper=styled.div`
66
width: 370px;
77
min-height: 300px;
8-
height:auto;
8+
height:400px;
99
padding: 10px;
1010
`
11+
exportconstContentWrapper=styled.div`
12+
height: 300px;
13+
`
1114
exportconstSeeAllMessages=styled.div`
1215
color:${theme('banner.title')};
1316
text-align: center;

‎src/containers/MailBox/styles/mention_list.js‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,6 @@ export const Wrapper = styled.div`
99
`
1010
exportconstListsWrapper=styled.div`
1111
width: 340px;
12-
min-height: 280px;
13-
max-height: 400px;
14-
overflow-y: scroll;
15-
overflow-x: hidden;
1612
`
1713
exportconstUserLabel=styled.div`
1814
${cs.flex('align-center')};

0 commit comments

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