antd-mobile/lib/notice-bar/style/index.less

基于 React 的移动设计规范实现

@import '../../style/themes/default';
@import '../../style/mixins';

@noticeBarPrefixCls: am-notice-bar;

.@{noticeBarPrefixCls} {
  background-color: @notice-bar-fill;
  height: @notice-bar-height;
  overflow: hidden;
  font-size: @font-size-base;
  line-height: @notice-bar-height;
  color: @notice-bar-color;
  display: flex;

  &-content {
    flex: 1;
    width: 100%;
    margin: auto @h-spacing-lg;
    .ellipsis();
  }

  &-icon {
    margin-left: @h-spacing-lg;
    display: flex;
    align-items: center;

    & + div {
      margin-left: @h-spacing-sm;
    }
  }

  &-operation {
    display: flex;
    align-items: center;
    padding-right: @h-spacing-md;
  }
}