Линейный стиль наведения радия в React не работает - PullRequest
Новая
       22

Линейный стиль наведения радия в React не работает

0 голосов
/ 01 апреля 2020

Я использовал компонент 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)
...