hc-materials/lib/layouts/flexContentLayout/style/index.less

基于react的通用组件库

@import '../../../components/footer/style/index.less';
@import '../../../components/breadCrumb/style/index.less';
@import '~antd/es/card/style/index.less';
@import '~antd/es/affix/style/index.less';
@import '~antd/es/drawer/style/index.less';
@import '~antd/es/divider/style/index.less';

@layout-flexContent-prefix-cls: ~'@{hc-prefix}-layout-flexContent';

.@{layout-flexContent-prefix-cls} {
  &-footer {
    width: 100%;
    bottom: 0;
  }
  .ant-card-wider-padding .ant-card-head{
    padding: 0 10px;
    .ant-card-head-title {
      padding: 10px 0;
    }
  }
  .ant-card-wider-padding .ant-card-body{
    padding: 10px;
  }
  &-body{
    margin: 16px 16px 0;
    background: transparent;
  }
  &-body > .ant-card-body{
    padding: 0;
    display: flex;
    align-items: stretch;
  }
  &-body > .ant-card-body &-body_wrap{
    flex: auto;
  }
  &-body > .ant-card-body &-body_overview {
    margin-left: 16px;
    flex-grow: 0;
    flex-shrink: 0;
  }
  &-iconbox {
    min-height: 40px;
    position: relative;
    padding: 0 10px;
    background: white;
    border-bottom: 2px solid #ddd;
    .anticon-compass,
    .anticon-environment-o,
    .anticon-appstore-o{
      float: left;
      margin: 8px 3px 0;
      padding: 2px;
      font-size: 20px;
      &:hover {
        cursor: pointer;
      }
    }
    .anticon-appstore-o {
      float: right;
    }
  }
  &-breadcrumb{
    margin-bottom: 0;
    border-bottom: 0 none;
    .ant-breadcrumb {
      padding-left: 5px;
      display: inline-block;
      zoom: 1;
      vertical-align: middle;
      width: 100%;
    }
  }
  &-connector{
    width: 40%;
    position: absolute;
    left: 30%;
    top: 0;
    height: 38px;
  }
}