dzeio/components
1
0
Fork 0
mirror of https://github.com/dzeiocom/components.git synced 2025-04-22 19:02:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fixed Problems

Browse Source 
Signed-off-by: Avior <florian.bouillon@delta-wings.net>
This commit is contained in:
Florian Bouillon 2021-03-30 01:47:40 +02:00
parent 5f51088ab0
commit bd0787d0ec
Signed by: Florian Bouillon
GPG Key ID: 50BD648F12C86AB6
3 changed files with 19 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/dzeio/Navbar/Navbar.module.styl
View File

@ -39,6 +39,7 @@
&.active &.active
background $mainGradient background $mainGradient
color $textOnMain
.userSpace .userSpace
@ -119,6 +120,7 @@
&.active &.active
background $mainGradient background $mainGradient
color $textOnMain
.userSpace .userSpace
cursor pointer cursor pointer
@ -167,12 +169,13 @@
.header .header
min-height 70px min-height 70px
> div
padding 0 padding 0
&:first-child margin 0
padding-left 16px > div p > div
p > div > div:first-child
padding 16px padding 16px
> div:last-child
padding 0
hr hr
margin 0 margin 0
@ -198,7 +201,7 @@
background-image $mainGradient background-image $mainGradient
&:hover &:hover
&.active &.active
color white color $textOnMain
&::before &::before
opacity 1 opacity 1
svg svg
@ -213,9 +216,7 @@
margin 0 margin 0
padding 0 padding 0
.userMenu .userMenu a
padding-bottom 16px
a
padding 16px 0 padding 16px 0

10
src/dzeio/Navbar/index.tsx
View File

@ -30,7 +30,7 @@ interface Props {
} }
items: Array<{ items: Array<{
path: string path: string
icon: FC icon?: FC
name: string name: string
}> }>
mobileMenu?: () => void mobileMenu?: () => void
@ -122,7 +122,7 @@ export default class Navbar extends React.Component<Props, State> {
public render = () => ( public render = () => (
<> <>
<nav className={buildClassName(css[this.getType()], [css.short, this.state.short && !this.props.mobileMenu], [css.mobile, this.props.mobileMenu])}> <nav className={buildClassName(css[this.getType()], [css.short, this.state.short && !this.props.mobileMenu], [css.mobile, this.props.mobileMenu])}>
<Row nowrap nomargin={this.getType() === 'sidebar'} className={css.header} align="center"> <Row nowrap className={css.header} align="center">
<Col className={css.imgContainer}><Link href="/"><Image {...this.props.logo} height={34} width={this.props.logo.width*34/this.props.logo.height} /></Link></Col> <Col className={css.imgContainer}><Link href="/"><Image {...this.props.logo} height={34} width={this.props.logo.width*34/this.props.logo.height} /></Link></Col>
{this.getType() === 'sidebar' && ( {this.getType() === 'sidebar' && (
<Col nogrow><Text><div onClick={this.onSidebarButton}> <Col nogrow><Text><div onClick={this.onSidebarButton}>
@ -141,7 +141,7 @@ export default class Navbar extends React.Component<Props, State> {
{!this.state.isMobile && this.props.items.map((item) => ( {!this.state.isMobile && this.props.items.map((item) => (
<li key={item.path}><Link noStyle href={item.path}><a> <li key={item.path}><Link noStyle href={item.path}><a>
<Text className={buildClassName([css.active, this.state.path?.startsWith(item.path)])}> <Text className={buildClassName([css.active, this.state.path?.startsWith(item.path)])}>
{this.getType() === 'sidebar' && ( {this.getType() === 'sidebar' && item.icon && (
<item.icon /> <item.icon />
)} )}
<span>{item.name}</span> <span>{item.name}</span>
@ -156,8 +156,6 @@ export default class Navbar extends React.Component<Props, State> {
<div onClick={() => this.setState({menuActive: !this.state.menuActive})} className={css.userSpace}> <div onClick={() => this.setState({menuActive: !this.state.menuActive})} className={css.userSpace}>
<Text> <Text>
<Menu size={38} className={css.mainGradient} /> <Menu size={38} className={css.mainGradient} />
{/* {this.props.user.name} */}
{/* <ChevronDown className={buildClassName([css.menuActive, this.state.menuActive])} /> */}
</Text> </Text>
</div> </div>
</div> </div>
@ -179,7 +177,7 @@ export default class Navbar extends React.Component<Props, State> {
</div> </div>
</div> </div>
<div className={buildClassName(css.userMenu, [css.menuActive, !this.state.isMobile && this.state.menuActive])}> <div className={buildClassName(css.userMenu, [css.menuActive, !this.state.isMobile && this.state.menuActive])}>
<Row nomargin> <Row>
{this.props.user.menu?.informations && ( {this.props.user.menu?.informations && (
<Col>{this.props.user.menu?.informations}</Col> <Col>{this.props.user.menu?.informations}</Col>
)} )}

12
src/dzeio/Row/Row.module.styl
View File

@ -3,14 +3,12 @@
.row .row
display flex display flex
flex-wrap wrap flex-wrap wrap
&:not(.nomargin)
margin (0 - $gapSize) 0 0
padding 0 $gapSize * 2 0 $gapSize
.row:not(.nomargin)
padding 0
margin (0 - $gapSize) 0 0 (0 - $gapSize) margin (0 - $gapSize) 0 0 (0 - $gapSize)
padding $gapSize
&.nomargin
.row
padding 0
.nowrap .nowrap
flex-wrap nowrap flex-wrap nowrap