SAP Spartacus B2B 页面 info icon 设计 - 版本1.0

现在的做法：引入了新的section标签，包裹cx-icon和h3：

<cx-icon
              [cxPopover]="listHint"
              [cxPopoverOptions]="{
                placement: 'auto',
                class: 'my-company-popover',
                appendToBody: true,
                displayCloseButton: false
              }"
              [type]="iconTypes.INFO"
            >
            </cx-icon>

然后给这个section添加样式：

这个section确实需要吗？

section {
        display: flex;
        cx-icon {
          align-self: flex-start;
          margin-top: 4px;
          color: var(--cx-color, var(--cx-color-info));
          margin-inline-end: 1rem;
        }
      }

try avoid of unnecesary html layers (breaking changes) (is section required?)

原始的设计：

在detail header和detail children header，修改card可以同时覆盖这两处UI：

div class=title只影响这一小块区域：

更多Jerry的原创文章，尽在：“汪子熙”: