improve props

This commit is contained in:
SrGooglo 2023-07-08 18:27:07 +00:00
parent 3f7de0ef85
commit 0eb3449989
2 changed files with 26 additions and 10 deletions

View File

@ -124,16 +124,20 @@ export class PagePanelWithNavMenu extends React.Component {
app.history.replace(`${window.location.pathname}?type=${this.state.activeTab}`) app.history.replace(`${window.location.pathname}?type=${this.state.activeTab}`)
} }
tabChange = (key) => { tabChange = async (key) => {
if (this.props.onTabChange) { if (this.props.beforeTabChange) {
this.props.onTabChange(key) await this.props.beforeTabChange(key)
} }
this.setState({ activeTab: key }) await this.setState({ activeTab: key })
if (this.props.useSetQueryType) { if (this.props.useSetQueryType) {
this.replaceQueryTypeToCurrentTab() this.replaceQueryTypeToCurrentTab()
} }
if (this.props.onTabChange) {
this.props.onTabChange(key)
}
} }
handleTabChange = async (key) => { handleTabChange = async (key) => {
@ -230,6 +234,8 @@ export class PagePanelWithNavMenu extends React.Component {
<PagePanels <PagePanels
primaryPanelClassName={this.props.primaryPanelClassName} primaryPanelClassName={this.props.primaryPanelClassName}
panels={panels} panels={panels}
masked={this.props.masked}
no_top_padding={this.props.no_top_padding}
/> />
</> </>
} }
@ -262,7 +268,13 @@ export default class PagePanels extends React.Component {
} }
return <div return <div
className="pagePanels" className={classnames(
"pagePanels",
{
["masked"]: this.props.masked,
["withTopPadding"]: !!!this.props.no_top_padding
}
)}
style={this.generateGridStyle()} style={this.generateGridStyle()}
> >
{ {

View File

@ -4,9 +4,11 @@
&.mobile { &.mobile {
&.page-panel-spacer { &.page-panel-spacer {
.pagePanels { .pagePanels {
.panel { &.withTopPadding {
&.center { .panel {
padding-top: calc(@top_bar_height + @top_bar_padding * 2); &.center {
padding-top: calc(@top_bar_height + @top_bar_padding * 2);
}
} }
} }
} }
@ -28,8 +30,10 @@
padding: 0; padding: 0;
-webkit-mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 1) 5%, rgba(0, 0, 0, 1) 97%, transparent 100%); &.masked {
mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 1) 5%, rgba(0, 0, 0, 1) 97%, transparent 100%); -webkit-mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 1) 5%, rgba(0, 0, 0, 1) 97%, transparent 100%);
mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 1) 5%, rgba(0, 0, 0, 1) 97%, transparent 100%);
}
.panel { .panel {
width: 100%; width: 100%;