Я использовал компонент React UI для дизайна страницы, однако; Я хочу переопределить некоторые стили по умолчанию с Radium; но мой код не работает Я также установил babel-plugin-transform-decorators-legacy, но без разницы. Вот мой код, в чем проблема?
Редактировать: Radium здесь работает для любых других свойств и настроек, кроме hover
import React, { Component } from 'react'
import NavPanel from '@duik/nav-panel'
import NavTitle from '@duik/nav-title'
import NavSection from '@duik/nav-section'
import NavSectionTitle from '@duik/nav-section-title'
import NavLink from '@duik/nav-link'
import Radium, { Style } from 'radium'
var linkStyles = {
base: {
Color: 'white',
':hover': {
Color: 'green'
}
}
}
class Sidebar extends Component {
render () {
return (
<NavPanel dark style={{ backgroundColor: '#2d2e2e', height: '100vh', float: 'right' }}>
<NavTitle style={{ fontFamily: 'IranSans', textAlign: 'Center' }}>
لوگو اینجا قرار بگیرد
</NavTitle>
<NavSection>
<NavSectionTitle />
<NavSectionTitle />
<NavLink key='1' style={linkStyles.base}>
Nav Item
</NavLink>
<NavLink className='active' style={{ boxShadow: 'inset 3px 0 0 1px #50d48b', Color: 'green' }}>
Active Nav Item
</NavLink>
<NavLink leftEl='?'>
With left el
</NavLink>
<NavLink rightEl='3'>
With left and right el
</NavLink>
</NavSection>
</NavPanel>
)
}
}
export default Radium(Sidebar)