为盖茨比的查克拉伊扩展主题

Question

我在Gatbsy工作，当我尝试使用gatsby-plugin-chakra-ui文件夹中的阴影theme.js文件覆盖核心查克拉主题时，它没有效果。

有什么想法吗？我正在使用

import { extendTheme } from '@chakra-ui/core'
const theme = extendTheme({
components: {
Input: {
variants: {
outline: {
borderColor: 'blue.500',
},
},
},
},
})

编辑：修改主题适用于按钮组件，但不适用于输入

Answer 1

要自定义Input元素字段，只需要在outline对象中添加field属性，如下所示：

import { extendTheme } from '@chakra-ui/core'
const theme = extendTheme({
components: {
Input: {
variants: {
outline: {
field: {
borderColor: 'blue.500',
},
},
},
},
},
})