modify color calculate method

This commit is contained in:
simaQ 2015-06-30 11:32:00 +08:00
parent 4f8fa918d5
commit f1e92c1227

View File

@ -10,11 +10,11 @@
.button-color(@color; @background; @border);
&:hover {
.button-color(fadeout(@color, 30%); fadeout(@background, 30%); fadeout(@border, 30%));
.button-color(lighten(@color, 30%, 'relative'); lighten(@background, 30%, 'relative'); lighten(@border, 30%, 'relative'));
}
&:active,
&.active {
.button-color(fadeout(@color, 20%); fadeout(@background, 20%); fadeout(@border, 20%));
.button-color(lighten(@color, 20%, 'relative'); lighten(@background, 20%, 'relative'); lighten(@border, 20%, 'relative'));
}
&:active,
&.active {
@ -138,7 +138,6 @@
&:hover,
&:active,
&.active {
background-clip: padding-box;
color: @btn-primary-color;
}
}
@ -148,11 +147,11 @@
.button-variant(@btn-default-color; @btn-default-bg; @btn-default-border);
&:hover {
.button-color(fadeout(@primary-color, 30%); @white; fadeout(@primary-color, 30%));
.button-color(lighten(@primary-color, 30%, 'relative'); @white; lighten(@primary-color, 30%, 'relative'));
}
&:active,
&.active {
.button-color(fadeout(@primary-color, 20%); @white; fadeout(@primary-color, 20%));
.button-color(lighten(@primary-color, 20%, 'relative'); @white; lighten(@primary-color, 20%, 'relative'));
}
}
@ -161,11 +160,11 @@
.button-variant(@btn-ghost-color, @btn-ghost-bg, @btn-ghost-border);
&:hover {
.button-color(fadeout(@primary-color, 30%); @white; fadeout(@primary-color, 30%));
.button-color(lighten(@primary-color, 30%, 'relative'); @white; lighten(@primary-color, 30%, 'relative'));
}
&:active,
&.active {
.button-color(fadeout(@primary-color, 20%); @white; fadeout(@primary-color, 20%));
.button-color(lighten(@primary-color, 20%, 'relative'); @white; lighten(@primary-color, 20%, 'relative'));
}
}
@ -207,7 +206,6 @@
.transition(all @duration-300 @ease-in-out);
z-index: 0;
background-color: @primary-color;
background-clip: padding-box;
}
&:not([disabled]):hover,
@ -227,7 +225,7 @@
&:not([disabled]):active:before,
&:not([disabled]).active:before {
background-color: fadeout(@primary-color, 20%);
background-color: lighten(@primary-color, 20%, 'relative');
}
}