小编con*_*der的帖子

我一直在努力实现这个简单的事情.我试图<TreeMenu/>用伪选择器在材料UI v1中显示/隐藏我的组件但不知何故它不起作用.这是代码:CSS:

      root: {
        backgroundColor: 'white',
        '&:hover': {
          backgroundColor: '#99f',
        },
      },

  hoverEle: {
    visibility: 'hidden',
    '&:hover': {
      visibility: 'inherit',
    },
  },
      rootListItem: {
        backgroundColor: 'white',
        display: 'none',
        '&:hover': {
          display: 'block',
          backgroundColor: '#99f',
        },
      },
      '@global': {
        'li > div.nth-of-type(1)': {
          display: 'block !important',
          backgroundColor: "'yellow',",
        },
      },

root css类在列表上工作正常但是rootListItem甚至@global li选择器都不起作用.我不确定我在选择器上做错了什么.我读了材料-ui文档并说V1支持伪选择器.

JSX:

<div>
      {props.treeNode.map(node => (
        <ListItem
          key={`${node.Type}|${node.NodeID}`}
          id={`${node.Type}|${node.NodeID}`}
          className={(classes.nested, classes.root)}
          button
          divider
          disableGutters={false}
          dense
          onClick={() => props.onNodeClick(node.Type, node.NodeID, node.NodeName)}
          title={props.adminUser ? node.NodeID : ''}
          onMouseOver={() => …

我们在应用程序中使用 1.4.5 Material-ui。现在我们尝试为应用程序中的所有组件设置一种字体大小。例如我们要设置fontSize: 14px,标题/按钮/段落/列表...等等。这是我们的示例主题配置：

import { createMuiTheme } from '@material-ui/core/styles';
import purple from '@material-ui/core/colors/purple';
import green from '@material-ui/core/colors/green';

const theme = createMuiTheme({
  typography: {
    fontSize: 14,
  },
  palette: {
    primary: purple,
    secondary: green,
  },
  status: {
    danger: 'orange',
  },
});

如果您注意到我们尝试在对象中定义字体大小typography，但使用此配置，material-ui 会根据此链接中给出的公式计算字体大小。

我们正在尝试实现 14px 字体大小的应用程序宽度，但我们找不到执行此操作的选项。一个选项可以是一个pxToRem函数，但我不确定应该如何覆盖该函数以及我的函数应该是什么？另一个选择是在每个组件中定义样式，我认为这有点矫枉过正，因为我们应该能够使用主题对象来做到这一点。如果您能想出一种全局设置字体大小的方法，请帮助我。对你的帮助表示感谢。

这应该是一件非常简单的事情，但我对material-ui还很陌生。我正在使用material-ui v1，并且我正在尝试更改主题的主要颜色。这是我的主题对象在不使用自定义颜色的情况下的样子：

import { createMuiTheme } from 'material-ui-next/styles';
import blue from 'material-ui-next/colors/purple';
import green from 'material-ui-next/colors/green';
import red from 'material-ui-next/colors/red';


const theme = createMuiTheme({
    palette: {
        primary: green, 
        secondary: {
          ...green,
         },
       error: red,
     },
});


export default theme;

在原色中，我想使用我的自定义颜色“#6699CC”。如果我分配主要：'#6699CC'，它会给出以下错误：

“Material-UI：主色缺少以下色调：50,100,200,300,400,500,600,700,800,900,A100,A200,A400,A700,contrastDefaultColor 请参阅从material-ui/colors导出的默认颜色，靛蓝或粉红色。警告@bundle.js:37805 ”

这用于 0.19 beta 版本，但不适用于 V1-beta。谁能帮我解决这个问题吗？