storybookjs/storybook

Storybook theming does not allow for changing top level headers in sidebar

Open

#17,260 建立於 2022年1月17日

在 GitHub 查看
 (2 留言) (1 反應) (0 負責人)TypeScript (89,909 star) (10,058 fork)batch import
buggood first issuehelp wantedsev:S4theming

描述

Describe the bug Using the documentation here: https://storybook.js.org/docs/react/configure/theming I haven't found a way to change the coloring of the top level headers in the side menu. They are stuck with the color of #999, and there doesn't appear to be an easily targeted class to override it, css-ulso1l.

To Reproduce

  1. Create a custom theme
import { create } from '@storybook/theming';
export default create({
  base: 'light',
  colorPrimary: '#ff0000',
  colorSecondary: '#cc0000',

  // UI
  appBg: '#555',
  appContentBg: '#eee',
  appBorderColor: 'grey',
  appBorderRadius: 4,
  textColor: '#000',
  textInverseColor: '#fff',
  textMutedColor: '#444',

  // Typography
  fontBase: '"Open Sans", sans-serif',
  fontCode: 'monospace',

  // Toolbar default and active colors
  barTextColor: 'silver',
  barSelectedColor: '#222',
  barBg: 'grey',

  // Form colors
  inputBg: 'grey',
  inputBorder: 'silver',
  inputTextColor: 'white',
  inputBorderRadius: 4
});
  1. View Sidebar contents with a Grouped set of stories. In the image below, the Form Components text is the text I'm trying to target.

貢獻者指南