acud/lib/style/themes/default/components/card.less

acg react 组件库

@import '../config.less';

// card 
// 基础配置
@card-font-weight: @font-weight-400;
// 描边
@card-border-width: @border-width-base;
@card-border-radius-size: @border-radius-base;
// 字体
@card-font-size: @T2;
// tab标题、图片title字体
@card-tabs-title-font-size: @T3;
// 头部 title 字重
@card-title-font-weight: @font-weight-500;
// 头部 title 字体颜色
@card-head-title-color: @G2;
// 内容字体颜色
@card-content-color: @G4;
// footer 次要说明颜色
@card-footer-description-color: @G5;
// margin
@card-margin-top: 2 * @P;
// padding
@card-padding-jump: 2 * @P;

@card-head-height: 6 * @P;

// extra margin right
@card-extra-margin: 4 * @P;

// 按钮模式下，禁用态的颜色 
@card-simple-disabled-tp: tp7;
@card-simple-disabled-p: p41;

// 默认颜色 
@card-default-tp: tp7;
@card-default-p: p41;

// 头部操作颜色
@card-head-extra-default-tp: tp2;
@card-head-extra-default-p: p0;

// tabs卡片 头部操作颜色
@card-head-extra-withtab-default-tp: tp3;

// 底部操作颜色
@card-footer-extra-default-tp: tp5;
@card-footer-extra-default-p: p0;

@card-prefix-cls: ~'@{acud-prefix}-card';
@card-hoverable-hover-border: transparent;
@card-action-icon-size: 16px;

// border-radius
@card-radius: @R4;
@card-background: @G11;
@card-skeleton-bg: #cfd8dc;
@gradient-min: fade(@card-skeleton-bg, 20%);
@gradient-max: fade(@card-skeleton-bg, 40%);
@border-color-split: hsv(0, 0, 94%);
@card-img-radius: @R3;

@font-size-base: @card-font-size;
@font-size-lg: @font-size-base + 2px;
@component-background: @G11;

@card-image-padding: 4 * @P;
@card-image-margin: 4 * @P;

@card-meta-padding: 3 * @P;
@card-meta-padding-top: 2 * @P;
@card-meta-margin: 4 * @P;
@card-meta-content-margin: 2 * @P;

@text-color: @G2;
@card-head-color: @G2;
@card-head-background: transparent;
@card-actions-background: @component-background;
@card-actions-li-margin: 4 * @P 0;
@card-actions-margin: 4 * @P;
@card-skeleton-bg: #cfd8dc;
@card-background: @component-background;
@card-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12),
  0 5px 12px 4px rgba(0, 0, 0, 0.09);
@card-head-tabs-margin-bottom: -17px;