improve account page for mobile

This commit is contained in:
SrGooglo 2022-11-24 12:02:16 +00:00
parent 118ee393c5
commit 7cf9e92678
2 changed files with 22 additions and 1 deletions

View File

@ -99,6 +99,8 @@ export default class Account extends React.Component {
coverComponent = React.createRef()
tabNavigatorRef = React.createRef()
api = window.app.api.withEndpoints("main")
componentDidMount = async () => {
@ -215,8 +217,18 @@ export default class Account extends React.Component {
// if component scrolled foward set cover height to 0
if (e.target.scrollTop > 0) {
this.coverComponent.current.style.height = "0px"
if (window.isMobile) {
this.tabNavigatorRef.current.style.overflow = "hidden"
this.tabNavigatorRef.current.style.height = "0px"
}
} else {
this.coverComponent.current.style.height = ""
if (window.isMobile) {
this.tabNavigatorRef.current.style.overflow = ""
this.tabNavigatorRef.current.style.height = ""
}
}
}
@ -293,7 +305,7 @@ export default class Account extends React.Component {
</div>
<div className="contents">
<div className="tabMenuWrapper">
<div className="tabMenuWrapper" ref={this.tabNavigatorRef}>
<antd.Menu
className="tabMenu"
mode={window.isMobile ? "horizontal" : "vertical"}

View File

@ -330,6 +330,15 @@ html {
padding: 0;
margin-top: -4.5vh;
padding: 0;
.tabContent {
padding: 0;
padding-top: 20px;
}
.tabMenuWrapper{
display: flex;
flex-direction: column;