mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-07-30 11:26:27 +08:00
Code Issues Actions 26 Packages Projects Releases Wiki Activity

replace components colors

Browse Source
This commit is contained in:
zombiej 2018-12-11 22:45:03 +08:00
parent ee128020e7
commit 2029762297
3 changed files with 28 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
components/button/style/mixin.less
View File

@ -29,16 +29,12 @@
&:hover,
&:focus {
.button-color(
@color; ~`colorPalette('@{background}', 5) `; ~`colorPalette('@{background}', 5) `
);
.button-color(@color; color-palette(@background, 5) ; color-palette(@background, 5));
}
&:active,
&.active {
.button-color(
@color; ~`colorPalette('@{background}', 7) `; ~`colorPalette('@{background}', 7) `
);
.button-color(@color; color-palette(@background, 7) ; color-palette(@background, 7));
}
.button-disabled();
@ -64,20 +60,16 @@
.button-color(@color; @background; @border);
&:hover {
.button-color(
@btn-primary-color; ~`colorPalette('@{color}', 5) `; ~`colorPalette('@{color}', 5) `
);
.button-color(@btn-primary-color; color-palette(@color, 5) ; color-palette(@color, 5));
}
&:focus {
.button-color(~`colorPalette('@{color}', 5) `; #fff; ~`colorPalette('@{color}', 5) `);
.button-color(color-palette(@color, 5) ; #fff; color-palette(@color, 5));
}
&:active,
&.active {
.button-color(
@btn-primary-color; ~`colorPalette('@{color}', 7) `; ~`colorPalette('@{color}', 7) `
);
.button-color(@btn-primary-color; color-palette(@color, 7) ; color-palette(@color, 7));
}
.button-disabled();
@ -89,12 +81,12 @@
&:hover,
&:focus {
.button-color(~`colorPalette('@{color}', 5) `; transparent; ~`colorPalette('@{color}', 5) `);
.button-color(color-palette(@color, 5) ; transparent; color-palette(@color, 5));
}
&:active,
&.active {
.button-color(~`colorPalette('@{color}', 7) `; transparent; ~`colorPalette('@{color}', 7) `);
.button-color(color-palette(@color, 7) ; transparent; color-palette(@color, 7));
}
.button-disabled();

4
components/input/style/mixin.less
View File

@ -18,7 +18,7 @@
// input status
// == when focus or actived
.active(@color: @outline-color) {
border-color: ~`colorPalette('@{color}', 5) `;
border-color: color-palette(@color, 5);
outline: 0;
box-shadow: @input-outline-offset @outline-blur-size @outline-width fade(@color, 20%);
border-right-width: @border-width-base !important;
@ -26,7 +26,7 @@
// == when hoverd
.hover(@color: @input-hover-border-color) {
border-color: ~`colorPalette('@{color}', 5) `;
border-color: color-palette(@color, 5);
border-right-width: @border-width-base !important;
}

37
components/style/themes/default.less
View File

@ -16,18 +16,19 @@
// Color used by default to control hover and active backgrounds and for
// alert info backgrounds.
@primary-1: color(~`colorPalette('@{primary-color}', 1) `); // replace tint(@primary-color, 90%)
@primary-2: color(~`colorPalette('@{primary-color}', 2) `); // replace tint(@primary-color, 80%)
@primary-3: color(~`colorPalette('@{primary-color}', 3) `); // unused
@primary-4: color(~`colorPalette('@{primary-color}', 4) `); // unused
@primary-5: color(
~`colorPalette('@{primary-color}', 5) `
@primary-1: color-palette(@primary-color, 1); // replace tint(@primary-color, 90%)
@primary-2: color-palette(@primary-color, 2); // replace tint(@primary-color, 80%)
@primary-3: color-palette(@primary-color, 3); // unused
@primary-4: color-palette(@primary-color, 4); // unused
@primary-5: color-palette(
@primary-color,
5
); // color used to control the text color in many active and hover states, replace tint(@primary-color, 20%)
@primary-6: @primary-color; // color used to control the text color of active buttons, don't use, use @primary-color
@primary-7: color(~`colorPalette('@{primary-color}', 7) `); // replace shade(@primary-color, 5%)
@primary-8: color(~`colorPalette('@{primary-color}', 8) `); // unused
@primary-9: color(~`colorPalette('@{primary-color}', 9) `); // unused
@primary-10: color(~`colorPalette('@{primary-color}', 10) `); // unused
@primary-7: color-palette(@primary-color, 7); // replace shade(@primary-color, 5%)
@primary-8: color-palette(@primary-color, 8); // unused
@primary-9: color-palette(@primary-color, 9); // unused
@primary-10: color-palette(@primary-color, 10); // unused
// Base Scaffolding Variables
// ---
@ -520,17 +521,17 @@
// Alert
// ---
@alert-success-border-color: ~`colorPalette('@{success-color}', 3) `;
@alert-success-bg-color: ~`colorPalette('@{success-color}', 1) `;
@alert-success-border-color: color-palette(@success-color, 3);
@alert-success-bg-color: color-palette(@success-color, 1);
@alert-success-icon-color: @success-color;
@alert-info-border-color: ~`colorPalette('@{info-color}', 3) `;
@alert-info-bg-color: ~`colorPalette('@{info-color}', 1) `;
@alert-info-border-color: color-palette(@info-color, 3);
@alert-info-bg-color: color-palette(@info-color, 1);
@alert-info-icon-color: @info-color;
@alert-warning-border-color: ~`colorPalette('@{warning-color}', 3) `;
@alert-warning-bg-color: ~`colorPalette('@{warning-color}', 1) `;
@alert-warning-border-color: color-palette(@warning-color, 3);
@alert-warning-bg-color: color-palette(@warning-color, 1);
@alert-warning-icon-color: @warning-color;
@alert-error-border-color: ~`colorPalette('@{error-color}', 3) `;
@alert-error-bg-color: ~`colorPalette('@{error-color}', 1) `;
@alert-error-border-color: color-palette(@error-color, 3);
@alert-error-bg-color: color-palette(@error-color, 1);
@alert-error-icon-color: @error-color;
// List