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.

Commite3024f2

Browse files
committed
refactor(user-lister): improve scroll-bar
1 parent538b2ec commite3024f2

File tree

6 files changed

+20
-18
lines changed

6 files changed

+20
-18
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};

‎src/containers/Preview/styles/viewer.js‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
importstyledfrom'styled-components'
22

3-
exportconstWrapper=styled.div.attrs(({ id})=>({
4-
id,
5-
}))`
3+
exportconstWrapper=styled.div`
64
height: 100vh;
75
width: 100%;
86
`

‎src/containers/UserLister/index.js‎

Lines changed: 14 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
*/
66

77
importReactfrom'react'
8+
import{OverlayScrollbarsComponent}from'overlayscrollbars-react'
89

910
import{TYPE}from'@constant'
1011
import{connectStore,buildLog}from'@utils'
@@ -64,16 +65,20 @@ const UserListerContainer = ({ userLister }) => {
6465

6566
return(
6667
<Modalwidth="700px"show={show}showCloseBtnonClose={onClose}>
67-
<Wrapperid="userlist-scroller">
68-
<HeaderInfo
69-
type={type}
70-
brief={brief}
71-
totalCount={pagedUsersData.totalCount}
72-
curCommunity={curCommunity}
73-
/>
68+
<OverlayScrollbarsComponent
69+
options={{scrollbars:{autoHide:'scroll',autoHideDelay:200}}}
70+
>
71+
<Wrapper>
72+
<HeaderInfo
73+
type={type}
74+
brief={brief}
75+
totalCount={pagedUsersData.totalCount}
76+
curCommunity={curCommunity}
77+
/>
7478

75-
{renderContent(curView,pagedUsersData,accountInfo)}
76-
</Wrapper>
79+
{renderContent(curView,pagedUsersData,accountInfo)}
80+
</Wrapper>
81+
</OverlayScrollbarsComponent>
7782
</Modal>
7883
)
7984
}

‎src/containers/UserLister/logic.js‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
importRfrom'ramda'
22
import{useEffect}from'react'
33

4+
// eslint-disable-next-line import/named
45
import{PAGE_SIZE}from'@config'
56
import{TYPE,EVENT,ERR}from'@constant'
67
import{asyncSuit,buildLog,holdPage,unholdPage,errRescue}from'@utils'
@@ -167,9 +168,6 @@ export const useInit = _store => {
167168
// log('effect init')
168169
sub$=sr71$.data().subscribe($solver(DataSolver,ErrSolver))
169170

170-
/* eslint-disable no-undef */
171-
// OverlayScrollbars(document.getElementById('userlist-scroller'), {})
172-
173171
return()=>{
174172
// log('effect uninit')
175173
sr71$.stop()

‎src/containers/UserLister/styles/index.js‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,8 @@ import styled from 'styled-components'
33
// import Img from '@components/Img'
44
import{cs}from'@utils'
55

6-
exportconstWrapper=styled.div.attrs(({ id})=>({
7-
id,
8-
}))`
6+
exportconstWrapper=styled.div`
7+
height: 600px;
98
padding: 20px;
109
`
1110
exportconstMsgWrapper=styled.div`

‎utils/common_styles.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -89,6 +89,7 @@ const zIndex = {
8989
preview:2001,
9090
doraemonOverlay:2600,
9191
doraemon:2601,
92+
modalCloseBtn:2000,
9293

9394
//
9495
sidebar:1999,

0 commit comments

Comments
 (0)

[8]ページ先頭

©2009-2025 Movatter.jp