与背景色不同的风格教学气泡

Question

我在教练标记内使用教学气泡，与此处的示例相同

enter link description here

如何将教学气泡显示为白色而不是蓝色？

Answer 1

您可以将styles属性传递给包含该对象的TeachingBubbleContent：

{
  closeButton: {
    color: 'red',
    selectors: {
      ':hover': {
        background: 'gainsboro',
        color: 'red'
      },
      ':active': {
        background: 'darkGray',
        color: 'red'
      }
    }
  },
  content: {
    border: '1px solid black',
    background: 'white',
  },
  headline: {
    color: 'black'
  },
  subText: {
    color: 'black'
  }
}

此代码笔中的示例：https://codepen.io/vitalius1/pen/xoEPzg。

您唯一不容易做的事情就是以一种仍然可见的方式更改Coachmark的拖放颜色。您可以尝试通过向其传递color道具并指定white来进行尝试，但是由于拖放周围没有边框或阴影，因此您看到的只是信标动画。而且，如果尝试给它添加边框，则由于放置的构造方式，它看起来不会很好（请参阅codepen）。另外，目前在传递beaconColorOne和beaconColorTwo道具以更改我现在要修复的信标颜色方面存在一个错误：）

希望有帮助！