clear less variables and add @text-color-secondary

This commit is contained in:
afc163 2016-11-08 20:45:56 +08:00
parent 64899c5da2
commit 9b81fe86d9
30 changed files with 63 additions and 74 deletions

View File

@ -71,7 +71,7 @@
cursor: pointer; cursor: pointer;
.@{iconfont-css-prefix}-cross { .@{iconfont-css-prefix}-cross {
color: @legend-color; color: @text-color-secondary;
transition: color .3s ease; transition: color .3s ease;
&:hover { &:hover {
color: #404040; color: #404040;

View File

@ -3,7 +3,7 @@
@breadcrumb-prefix-cls: ~"@{ant-prefix}-breadcrumb"; @breadcrumb-prefix-cls: ~"@{ant-prefix}-breadcrumb";
.@{breadcrumb-prefix-cls} { .@{breadcrumb-prefix-cls} {
color: #999; color: @text-color-secondary;
font-size: @font-size-base; font-size: @font-size-base;
a { a {

View File

@ -137,7 +137,7 @@
&.disabled, &.disabled,
&[disabled] { &[disabled] {
cursor: @cursor-disabled; cursor: not-allowed;
> * { > * {
pointer-events: none; pointer-events: none;
} }

View File

@ -4,7 +4,9 @@
.@{full-calendar-prefix-cls} { .@{full-calendar-prefix-cls} {
font-size: @font-size-base; font-size: @font-size-base;
line-height: 1.5; line-height: @line-height-base;
outline: none;
border-top: 1px solid @border-color-base;
&-month-select { &-month-select {
margin-left: 5px; margin-left: 5px;
@ -30,8 +32,6 @@
} }
} }
outline: none;
border-top: 1px solid @legend-border-color;
&-date-panel { &-date-panel {
position: relative; position: relative;
outline: none; outline: none;

View File

@ -63,7 +63,7 @@
cursor: pointer; cursor: pointer;
transition: color 0.3s ease, opacity 0.15s ease; transition: color 0.3s ease, opacity 0.15s ease;
&:hover { &:hover {
color: #999; color: @text-color-secondary;
} }
} }
@ -81,7 +81,7 @@
height: 12px; height: 12px;
margin-top: -6px; margin-top: -6px;
line-height: 12px; line-height: 12px;
color: #999; color: @text-color-secondary;
.iconfont-size-under-12px(9px); .iconfont-size-under-12px(9px);
&:before { &:before {
transition: transform 0.2s ease; transition: transform 0.2s ease;
@ -173,7 +173,7 @@
&:after { &:after {
.iconfont-font("\e61f"); .iconfont-font("\e61f");
.iconfont-size-under-12px(8px); .iconfont-size-under-12px(8px);
color: #999; color: @text-color-secondary;
position: absolute; position: absolute;
right: 15px; right: 15px;
} }

View File

@ -122,7 +122,7 @@
& + span { & + span {
color: #ccc; color: #ccc;
cursor: @cursor-disabled; cursor: not-allowed;
} }
} }

View File

@ -37,7 +37,7 @@
.@{calendar-prefix-cls}-next-year-btn { .@{calendar-prefix-cls}-next-year-btn {
position: absolute; position: absolute;
top: 0; top: 0;
color: #999; color: @text-color-secondary;
font-family: Arial, "Hiragino Sans GB", "Microsoft Yahei", "Microsoft Sans Serif", sans-serif; font-family: Arial, "Hiragino Sans GB", "Microsoft Yahei", "Microsoft Sans Serif", sans-serif;
padding: 0 5px; padding: 0 5px;
font-size: 16px; font-size: 16px;
@ -291,7 +291,7 @@
} }
.@{calendar-prefix-cls}-clear-btn:hover:after { .@{calendar-prefix-cls}-clear-btn:hover:after {
color: #999; color: @text-color-secondary;
} }
.@{calendar-prefix-cls}-ok-btn { .@{calendar-prefix-cls}-ok-btn {

View File

@ -53,7 +53,7 @@
cursor: pointer; cursor: pointer;
transition: color 0.3s ease, opacity 0.15s ease; transition: color 0.3s ease, opacity 0.15s ease;
&:hover { &:hover {
color: #999; color: @text-color-secondary;
} }
} }
@ -69,14 +69,14 @@
height: 12px; height: 12px;
line-height: 12px; line-height: 12px;
right: 8px; right: 8px;
color: #999; color: @text-color-secondary;
top: 50%; top: 50%;
margin-top: -6px; margin-top: -6px;
&:after { &:after {
content: "\e6bb"; content: "\e6bb";
font-family: "anticon"; font-family: "anticon";
font-size: 12px; font-size: 12px;
color: #999; color: @text-color-secondary;
display: inline-block; display: inline-block;
line-height: 1; line-height: 1;
vertical-align: bottom; vertical-align: bottom;

View File

@ -19,7 +19,7 @@
} }
.@{calendar-prefix-cls}-range-picker-separator { .@{calendar-prefix-cls}-range-picker-separator {
color: #999; color: @text-color-secondary;
} }
.@{calendar-prefix-cls}-range { .@{calendar-prefix-cls}-range {
@ -67,7 +67,7 @@
text-align: center; text-align: center;
height: @input-box-height; height: @input-box-height;
line-height: @input-box-height; line-height: @input-box-height;
color: #999; color: @text-color-secondary;
} }
&-right .@{calendar-prefix-cls}-date-input-wrap { &-right .@{calendar-prefix-cls}-date-input-wrap {

View File

@ -108,7 +108,7 @@
color: @btn-disable-color; color: @btn-disable-color;
&:hover { &:hover {
background: transparent; background: transparent;
cursor: @cursor-disabled; cursor: not-allowed;
} }
} }
} }

View File

@ -108,7 +108,7 @@
position: absolute; position: absolute;
content: "\e61f"; content: "\e61f";
right: 16px; right: 16px;
color: #999; color: @text-color-secondary;
.iconfont-size-under-12px(9px); .iconfont-size-under-12px(9px);
} }

View File

@ -32,7 +32,7 @@ input[type="radio"],
input[type="checkbox"] { input[type="checkbox"] {
&[disabled], &[disabled],
&.disabled { &.disabled {
cursor: @cursor-disabled; cursor: not-allowed;
} }
} }
@ -42,7 +42,7 @@ input[type="checkbox"] {
.@{ant-prefix}-checkbox-inline, .@{ant-prefix}-checkbox-inline,
.@{ant-prefix}-checkbox-vertical { .@{ant-prefix}-checkbox-vertical {
&.disabled { &.disabled {
cursor: @cursor-disabled; cursor: not-allowed;
} }
} }
@ -51,7 +51,7 @@ input[type="checkbox"] {
.@{ant-prefix}-checkbox { .@{ant-prefix}-checkbox {
&.disabled { &.disabled {
label { label {
cursor: @cursor-disabled; cursor: not-allowed;
} }
} }
} }
@ -116,7 +116,7 @@ input[type="checkbox"] {
.@{form-prefix-cls}-explain, .@{form-prefix-cls}-explain,
.@{form-prefix-cls}-extra { .@{form-prefix-cls}-extra {
color: #999; color: @text-color-secondary;
} }
.@{form-prefix-cls}-text { .@{form-prefix-cls}-text {
@ -426,7 +426,7 @@ form {
display: inline-block; display: inline-block;
animation: loadingCircle 1s infinite linear; animation: loadingCircle 1s infinite linear;
content: "\e6ae"; content: "\e6ae";
color: #999; color: @text-color-secondary;
} }
} }

View File

@ -52,9 +52,9 @@
margin-bottom: 20px; margin-bottom: 20px;
font-size: 14px; font-size: 14px;
line-height: inherit; line-height: inherit;
color: @legend-color; color: @text-color-secondary;
border: 0; border: 0;
border-bottom: 1px solid @legend-border-color; border-bottom: 1px solid @border-color-base;
} }
label { label {

View File

@ -29,7 +29,7 @@
line-height: 0; line-height: 0;
height: 14px; height: 14px;
overflow: hidden; overflow: hidden;
color: #999; color: @text-color-secondary;
position: relative; position: relative;
transition: all 0.1s linear; transition: all 0.1s linear;
display: block; display: block;
@ -55,7 +55,7 @@
transition: all 0.1s linear; transition: all 0.1s linear;
.iconfont-size-under-12px(7px); .iconfont-size-under-12px(7px);
right: 4px; right: 4px;
color: #999; color: @text-color-secondary;
} }
&:hover { &:hover {

View File

@ -29,7 +29,7 @@
.disabled() { .disabled() {
background-color: @input-disabled-bg; background-color: @input-disabled-bg;
opacity: 1; opacity: 1;
cursor: @cursor-disabled; cursor: not-allowed;
color: #ccc; color: #ccc;
&:hover { &:hover {
.hover(@input-border-color); .hover(@input-border-color);

View File

@ -25,7 +25,7 @@
} }
&-item-group-title { &-item-group-title {
color: #999; color: @text-color-secondary;
font-size: 12px; font-size: 12px;
line-height: 1.5; line-height: 1.5;
padding: 8px 16px; padding: 8px 16px;
@ -155,11 +155,11 @@
// Disabled state sets text to gray and nukes hover/tab effects // Disabled state sets text to gray and nukes hover/tab effects
&.@{menu-prefix-cls}-item-disabled, &.@{menu-prefix-cls}-item-disabled,
&.@{menu-prefix-cls}-submenu-disabled { &.@{menu-prefix-cls}-submenu-disabled {
color: #999 !important; color: @text-color-secondary !important;
cursor: not-allowed; cursor: not-allowed;
background: none; background: none;
> a { > a {
color: #999 !important; color: @text-color-secondary !important;
pointer-events: none; pointer-events: none;
} }
} }
@ -319,7 +319,7 @@
.@{menu-prefix-cls} { .@{menu-prefix-cls} {
&-dark, &-dark,
&-dark &-sub { &-dark &-sub {
color: #999; color: @text-color-secondary;
background: #404040; background: #404040;
} }
@ -340,7 +340,7 @@
&-dark &-item, &-dark &-item,
&-dark &-item > a { &-dark &-item > a {
color: #999; color: @text-color-secondary;
} }
&-dark&-inline, &-dark&-inline,

View File

@ -47,7 +47,7 @@
line-height: 1; line-height: 1;
text-decoration: none; text-decoration: none;
transition: color .3s ease; transition: color .3s ease;
color: #999; color: @text-color-secondary;
outline: 0; outline: 0;
&-x { &-x {

View File

@ -83,7 +83,7 @@
position: absolute; position: absolute;
right: 16px; right: 16px;
top: 10px; top: 10px;
color: @legend-color; color: @text-color-secondary;
outline: none; outline: none;
&:hover { &:hover {
color: #404040; color: #404040;

View File

@ -104,7 +104,7 @@
& + span { & + span {
color: #ccc; color: #ccc;
cursor: @cursor-disabled; cursor: not-allowed;
} }
} }

View File

@ -30,7 +30,7 @@
.iconfont-font("\e62e"); .iconfont-font("\e62e");
} }
&:hover { &:hover {
color: #999; color: @text-color-secondary;
} }
} }
@ -318,7 +318,7 @@
.@{select-prefix-cls}-selection__choice__remove { .@{select-prefix-cls}-selection__choice__remove {
.iconfont-mixin(); .iconfont-mixin();
color: #999; color: @text-color-secondary;
line-height: inherit; line-height: inherit;
cursor: pointer; cursor: pointer;
display: inline-block; display: inline-block;
@ -437,7 +437,7 @@
} }
&-item-group-title { &-item-group-title {
color: #999; color: @text-color-secondary;
line-height: 1.5; line-height: 1.5;
padding: 8px 16px; padding: 8px 16px;
} }

View File

@ -82,7 +82,7 @@
vertical-align: middle; vertical-align: middle;
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
color: #999; color: @text-color-secondary;
&-active { &-active {
color: #666; color: #666;

View File

@ -2,7 +2,7 @@
@import "../../style/mixins/index"; @import "../../style/mixins/index";
@spin-prefix-cls: ~"@{ant-prefix}-spin"; @spin-prefix-cls: ~"@{ant-prefix}-spin";
@spin-dot-default: #999; @spin-dot-default: @text-color-secondary;
@spin-dot-size-sm: 14px; @spin-dot-size-sm: 14px;
@spin-dot-size: 20px; @spin-dot-size: 20px;
@spin-dot-size-lg: 30px; @spin-dot-size-lg: 30px;

View File

@ -7,7 +7,7 @@
@process-description-color: @process-title-color; @process-description-color: @process-title-color;
@process-tail-color: @border-color-split; @process-tail-color: @border-color-split;
@wait-icon-color: #ccc; @wait-icon-color: #ccc;
@wait-title-color: #999; @wait-title-color: @text-color-secondary;
@wait-description-color: @wait-title-color; @wait-description-color: @wait-title-color;
@wait-tail-color: @process-tail-color; @wait-tail-color: @process-tail-color;
@finish-icon-color: @process-icon-color; @finish-icon-color: @process-icon-color;
@ -191,7 +191,7 @@
} }
.@{steps-prefix-cls}-description { .@{steps-prefix-cls}-description {
font-size: 12px; font-size: 12px;
color: #999; color: @text-color-secondary;
} }
.@{steps-prefix-cls}-tail { .@{steps-prefix-cls}-tail {
position: absolute; position: absolute;
@ -245,7 +245,7 @@
} }
.@{steps-prefix-cls}-description { .@{steps-prefix-cls}-description {
font-size: 12px; font-size: 12px;
color: #999; color: @text-color-secondary;
} }
.@{steps-prefix-cls}-tail { .@{steps-prefix-cls}-tail {
top: 8px; top: 8px;

View File

@ -84,7 +84,7 @@ a {
.@{ant-prefix}-divider { .@{ant-prefix}-divider {
margin: 0 4px; margin: 0 4px;
color: #999; color: @text-color-secondary;
display: inline-block; display: inline-block;
height: 8px; height: 8px;
width: 1px; width: 1px;

View File

@ -15,6 +15,7 @@
@code-family : Consolas,Menlo,Courier,monospace; @code-family : Consolas,Menlo,Courier,monospace;
@text-color : #666; @text-color : #666;
@heading-color : #404040; @heading-color : #404040;
@text-color-secondary : #999;
@font-size-base : 12px; @font-size-base : 12px;
@line-height-base : 1.5; @line-height-base : 1.5;
@line-height-computed : floor((@font-size-base * @line-height-base)); @line-height-computed : floor((@font-size-base * @line-height-base));
@ -31,9 +32,6 @@
@link-active-color : shade(@link-color, 5%); @link-active-color : shade(@link-color, 5%);
@link-hover-decoration : none; @link-hover-decoration : none;
// Disabled cursor for form controls and buttons.
@cursor-disabled : not-allowed;
// Animation // Animation
@ease-out : cubic-bezier(0.215, 0.61, 0.355, 1); @ease-out : cubic-bezier(0.215, 0.61, 0.355, 1);
@ease-in : cubic-bezier(0.55, 0.055, 0.675, 0.19); @ease-in : cubic-bezier(0.55, 0.055, 0.675, 0.19);
@ -91,10 +89,8 @@
@btn-disable-border : @border-color-base; @btn-disable-border : @border-color-base;
@btn-padding-base : 4px 15px; @btn-padding-base : 4px 15px;
@btn-font-size-lg : 14px; @btn-font-size-lg : 14px;
@btn-padding-lg : 4px 15px 5px 15px; @btn-padding-lg : 4px 15px 5px 15px;
@btn-padding-sm : 1px 7px; @btn-padding-sm : 1px 7px;
@btn-circle-size : 28px; @btn-circle-size : 28px;
@ -126,11 +122,6 @@
@grid-columns : 24; @grid-columns : 24;
@grid-gutter-width : 0; @grid-gutter-width : 0;
// Container sizes
@container-sm : (720px + @grid-gutter-width);
@container-md : (940px + @grid-gutter-width);
@container-lg : (1140px + @grid-gutter-width);
// z-index list // z-index list
@zindex-affix : 11; @zindex-affix : 11;
@zindex-back-top : 10; @zindex-back-top : 10;
@ -150,8 +141,6 @@
// Form // Form
// --- // ---
@legend-color : #999;
@legend-border-color : @border-color-base;
@label-required-color : #f50; @label-required-color : #f50;
@label-color : @text-color; @label-color : @text-color;
@form-item-margin-bottom : 24px; @form-item-margin-bottom : 24px;

View File

@ -293,7 +293,7 @@
position: relative; position: relative;
z-index: 2; z-index: 2;
font-size: 12px; font-size: 12px;
color: #999; color: @text-color-secondary;
.@{iconfont-css-prefix} { .@{iconfont-css-prefix} {
margin-right: 4px; margin-right: 4px;
} }

View File

@ -61,7 +61,7 @@
background-color: transparent; background-color: transparent;
position: absolute; position: absolute;
text-align: center; text-align: center;
color: #999; color: @text-color-secondary;
transition: color 0.3s ease; transition: color 0.3s ease;
&:hover { &:hover {
@ -339,7 +339,7 @@
} }
&&-card > &-bar &-tab .@{iconfont-css-prefix}-close { &&-card > &-bar &-tab .@{iconfont-css-prefix}-close {
margin-right: 0; margin-right: 0;
color: #999; color: @text-color-secondary;
transition: all 0.3s @ease-in-out; transition: all 0.3s @ease-in-out;
.iconfont-size-under-12px(9px); .iconfont-size-under-12px(9px);
transform-origin: 100% 50%; transform-origin: 100% 50%;
@ -378,7 +378,7 @@
border: 1px solid @border-color-base; border: 1px solid @border-color-base;
font-size: 12px; font-size: 12px;
.iconfont-size-under-12px(10px); .iconfont-size-under-12px(10px);
color: #999; color: @text-color-secondary;
transition: color 0.3s ease; transition: color 0.3s ease;
&:hover { &:hover {
color: #404040; color: #404040;

View File

@ -70,7 +70,7 @@
} }
&-clear-btn:hover:after { &-clear-btn:hover:after {
color: #999; color: @text-color-secondary;
} }
&-narrow &-input-wrap { &-narrow &-input-wrap {
@ -141,7 +141,7 @@
color: @btn-disable-color; color: @btn-disable-color;
&:hover { &:hover {
background: transparent; background: transparent;
cursor: @cursor-disabled; cursor: not-allowed;
} }
} }
} }
@ -212,14 +212,14 @@
height: 12px; height: 12px;
line-height: 12px; line-height: 12px;
right: 8px; right: 8px;
color: #999; color: @text-color-secondary;
top: 50%; top: 50%;
margin-top: -6px; margin-top: -6px;
&:after { &:after {
content: "\e641"; content: "\e641";
font-family: "anticon"; font-family: "anticon";
font-size: 12px; font-size: 12px;
color: #999; color: @text-color-secondary;
display: inline-block; display: inline-block;
line-height: 1; line-height: 1;
vertical-align: bottom; vertical-align: bottom;

View File

@ -40,7 +40,7 @@
font-size: 12px; font-size: 12px;
color: #ccc; color: #ccc;
&:hover { &:hover {
color: #999; color: @text-color-secondary;
} }
} }
} }

View File

@ -95,18 +95,18 @@
} }
p.@{upload-prefix-cls}-hint { p.@{upload-prefix-cls}-hint {
font-size: 12px; font-size: 12px;
color: #999; color: @text-color-secondary;
} }
.@{iconfont-css-prefix}-plus { .@{iconfont-css-prefix}-plus {
font-size: 30px; font-size: 30px;
transition: all 0.3s ease; transition: all 0.3s ease;
color: #ccc; color: #ccc;
&:hover { &:hover {
color: #999; color: @text-color-secondary;
} }
} }
&:hover .@{iconfont-css-prefix}-plus { &:hover .@{iconfont-css-prefix}-plus {
color: #999; color: @text-color-secondary;
} }
} }
} }
@ -127,7 +127,7 @@
.@{iconfont-css-prefix}-paper-clip { .@{iconfont-css-prefix}-paper-clip {
margin-right: 4px; margin-right: 4px;
font-size: 12px; font-size: 12px;
color: #999; color: @text-color-secondary;
} }
.@{iconfont-css-prefix}-cross { .@{iconfont-css-prefix}-cross {
.iconfont-size-under-12px(10px); .iconfont-size-under-12px(10px);
@ -135,7 +135,7 @@
opacity: 0; opacity: 0;
cursor: pointer; cursor: pointer;
float: right; float: right;
color: #999; color: @text-color-secondary;
line-height: 22px; line-height: 22px;
&:hover { &:hover {
color: #666; color: #666;
@ -213,7 +213,7 @@
.@{upload-item}-thumbnail.@{iconfont-css-prefix}:before { .@{upload-item}-thumbnail.@{iconfont-css-prefix}:before {
line-height: 48px; line-height: 48px;
font-size: 24px; font-size: 24px;
color: #999; color: @text-color-secondary;
} }
.@{upload-item}-name { .@{upload-item}-name {
@ -338,7 +338,7 @@
&-text { &-text {
margin-top: 18px; margin-top: 18px;
color: #999; color: @text-color-secondary;
} }
} }