Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix: test antd dark theme component #20012

Merged
merged 32 commits into from
Dec 3, 2019
Merged

fix: test antd dark theme component #20012

Show file tree
Hide file tree
Changes from 29 commits
Commits
Show all changes
32 commits
Select commit Hold shift + click to select a range
8ad5b73
chore: test antd dark theme component
ycjcl868 Nov 29, 2019
c76467b
fix: just for preview
ycjcl868 Nov 29, 2019
673f86b
fix: pagination dark theme
ycjcl868 Dec 1, 2019
d388c1d
fix: cascader and input-number-handler bg
ycjcl868 Dec 1, 2019
689d9b7
feat: @mention-textarea-bg
ycjcl868 Dec 1, 2019
327011d
feat: @theme dark, default
ycjcl868 Dec 1, 2019
f7f17c8
feat: @dropdown-menu-submenu-disabled-bg
ycjcl868 Dec 1, 2019
5590ba0
Merge 4.0-prepare into fix-dark-theme
ycjcl868 Dec 1, 2019
99f8d84
feat: date-picker, steps less dark
ycjcl868 Dec 1, 2019
208d954
fix: @input-number-handler-bg
ycjcl868 Dec 1, 2019
aa963b5
fix: @mentions-dropdown-bg
ycjcl868 Dec 1, 2019
d94845f
fix: remove @import dark
ycjcl868 Dec 1, 2019
6fa168c
fix: reset site style
ycjcl868 Dec 1, 2019
646a1d0
fix: reset md style
ycjcl868 Dec 1, 2019
fcae72c
fix: md style
ycjcl868 Dec 1, 2019
28306fb
fix: colorPalette and @tree-bg
ycjcl868 Dec 2, 2019
dc1d187
feat: @radio-dot-disabled-color
ycjcl868 Dec 2, 2019
898311c
fix: datepicker bg @time-picker-panel-inner-bg
ycjcl868 Dec 2, 2019
505b12a
fix: table header dark
ycjcl868 Dec 2, 2019
d5d2051
fix: components notification
ycjcl868 Dec 2, 2019
3fd3ad6
feat: svg dark theme, Close, Close #19971.
ycjcl868 Dec 2, 2019
d6f41db
fix: default theme button danger color
ycjcl868 Dec 3, 2019
22aba08
fix: progress trailColor support dark theme
ycjcl868 Dec 3, 2019
e2251f5
fix: @theme condition
ycjcl868 Dec 3, 2019
dc90c21
fix: @theme default
ycjcl868 Dec 3, 2019
53e663a
tweak: antd dark theme in as required usage
ycjcl868 Dec 3, 2019
0da761d
:memo: dark theme usage
ycjcl868 Dec 3, 2019
d8ab994
fix: border-color use solid color
ycjcl868 Dec 3, 2019
62952a8
fix: empty prefix className, update snapshot
ycjcl868 Dec 3, 2019
7b82687
fix: @link hover,active color
ycjcl868 Dec 3, 2019
e16b17b
fix: dist build pipline
ycjcl868 Dec 3, 2019
4be9e9d
fix: remove dark.less import
ycjcl868 Dec 3, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
22 changes: 22 additions & 0 deletions .antd-tools.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
const fs = require('fs');
const path = require('path');
// eslint-disable-next-line import/no-extraneous-dependencies
const lessToJs = require('less-vars-to-js');
const packageInfo = require('./package.json');

// We need compile additional content for antd user
Expand Down Expand Up @@ -66,6 +68,26 @@ function finalizeDist() {

// eslint-disable-next-line
console.log('Built a entry less file to dist/antd-dark.less');

// Build antd-dark.js: dist/antd-dark.js, for less-loader
const stylePath = path.join(process.cwd(), 'lib', 'style');

const colorLess = fs.readFileSync(path.join(stylePath, 'color', 'colors.less'), 'utf8');
const defaultLess = fs.readFileSync(path.join(stylePath, 'themes', 'default.less'), 'utf8');
const darkLess = fs.readFileSync(path.join(stylePath, 'themes', 'dark.less'), 'utf8');

const darkPaletteLess = lessToJs(`${colorLess}${defaultLess}${darkLess}`, {
resolveVariables: false,
stripPrefix: true,
});

fs.writeFileSync(
path.join(process.cwd(), 'dist', 'antd-dark.js'),
`module.exports = ${JSON.stringify(darkPaletteLess, null, 2)};`,
);

// eslint-disable-next-line
console.log('Built a dark theme js file to dist/antd-dark.js');
}
}

Expand Down
61 changes: 45 additions & 16 deletions components/button/style/mixin.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,16 +32,30 @@

&:hover,
&:focus {
.button-color(
@color; ~`colorPalette('@{background}', 5) `; ~`colorPalette('@{background}', 5) `
);
& when (@theme = dark) {
.button-color(
@color; ~`colorPalette('@{background}', 7) `; ~`colorPalette('@{background}', 7) `
);
}
& when not (@theme = dark) {
.button-color(
@color; ~`colorPalette('@{background}', 5) `; ~`colorPalette('@{background}', 5) `
);
}
}

&:active,
&.active {
.button-color(
@color; ~`colorPalette('@{background}', 7) `; ~`colorPalette('@{background}', 7) `
);
& when (@theme = dark) {
.button-color(
@color; ~`colorPalette('@{background}', 5) `; ~`colorPalette('@{background}', 5) `
);
}
& when not (@theme = dark) {
.button-color(
@color; ~`colorPalette('@{background}', 7) `; ~`colorPalette('@{background}', 7) `
);
}
}

.button-disabled();
Expand All @@ -52,17 +66,33 @@

&:hover,
&:focus {
.button-color(
~`colorPalette('@{btn-primary-bg}', 5) `; @background; ~`colorPalette('@{btn-primary-bg}', 5)
`
);
& when (@theme = dark) {
.button-color(
~`colorPalette('@{btn-primary-bg}', 7) `; @background;
~`colorPalette('@{btn-primary-bg}', 7) `
);
}
& when not (@theme = dark) {
.button-color(
~`colorPalette('@{btn-primary-bg}', 5) `; @background;
~`colorPalette('@{btn-primary-bg}', 5) `
);
}
}
&:active,
&.active {
.button-color(
~`colorPalette('@{btn-primary-bg}', 7) `; @background; ~`colorPalette('@{btn-primary-bg}', 7)
`
);
& when (@theme = dark) {
.button-color(
~`colorPalette('@{btn-primary-bg}', 5) `; @background;
~`colorPalette('@{btn-primary-bg}', 5) `
);
}
& when not (@theme = default) {
.button-color(
~`colorPalette('@{btn-primary-bg}', 7) `; @background;
~`colorPalette('@{btn-primary-bg}', 7) `
);
}
}
.button-disabled();
}
Expand Down Expand Up @@ -92,8 +122,7 @@
.button-color(@color; @background; @border) {
color: @color;
background-color: @background;
border-color: @border;
// a inside Button which only work in Chrome
border-color: @border; // a inside Button which only work in Chrome
// http://stackoverflow.com/a/17253457
> a:only-child {
color: currentColor;
Expand Down
21 changes: 12 additions & 9 deletions components/cascader/__tests__/__snapshots__/index.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -381,6 +381,7 @@ exports[`Cascader have a notFoundContent that fit trigger input width 1`] = `
class="ant-empty-image"
>
<svg
class="ant-empty-img-simple"
height="41"
viewBox="0 0 64 41"
width="64"
Expand All @@ -392,22 +393,22 @@ exports[`Cascader have a notFoundContent that fit trigger input width 1`] = `
transform="translate(0 1)"
>
<ellipse
class="ant-empty-img-simple-ellipse"
cx="32"
cy="33"
fill="#F5F5F5"
rx="32"
ry="7"
/>
<g
class="ant-empty-img-simple-g"
fill-rule="nonzero"
stroke="#D9D9D9"
>
<path
d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"
/>
<path
class="ant-empty-img-simple-path"
d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z"
fill="#FAFAFA"
/>
</g>
</g>
Expand Down Expand Up @@ -1301,6 +1302,7 @@ exports[`Cascader should render not found content 1`] = `
>
<Simple>
<svg
className="ant-empty-img-simple"
height="41"
viewBox="0 0 64 41"
width="64"
Expand All @@ -1312,22 +1314,22 @@ exports[`Cascader should render not found content 1`] = `
transform="translate(0 1)"
>
<ellipse
className="ant-empty-img-simple-ellipse"
cx="32"
cy="33"
fill="#F5F5F5"
rx="32"
ry="7"
/>
<g
className="ant-empty-img-simple-g"
fillRule="nonzero"
stroke="#D9D9D9"
>
<path
d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"
/>
<path
className="ant-empty-img-simple-path"
d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z"
fill="#FAFAFA"
/>
</g>
</g>
Expand Down Expand Up @@ -1618,6 +1620,7 @@ exports[`Cascader should show not found content when options.length is 0 1`] = `
>
<Simple>
<svg
className="ant-empty-img-simple"
height="41"
viewBox="0 0 64 41"
width="64"
Expand All @@ -1629,22 +1632,22 @@ exports[`Cascader should show not found content when options.length is 0 1`] = `
transform="translate(0 1)"
>
<ellipse
className="ant-empty-img-simple-ellipse"
cx="32"
cy="33"
fill="#F5F5F5"
rx="32"
ry="7"
/>
<g
className="ant-empty-img-simple-g"
fillRule="nonzero"
stroke="#D9D9D9"
>
<path
d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"
/>
<path
className="ant-empty-img-simple-path"
d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z"
fill="#FAFAFA"
/>
</g>
</g>
Expand Down
4 changes: 2 additions & 2 deletions components/cascader/style/index.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@

position: relative;
display: inline-block;
background-color: @component-background;
background-color: @cascader-bg;
border-radius: @border-radius-base;
outline: 0;
cursor: pointer;
Expand Down Expand Up @@ -127,7 +127,7 @@
z-index: @zindex-dropdown;
font-size: @font-size-base;
white-space: nowrap;
background: @component-background;
background: @cascader-menu-bg;
border-radius: @border-radius-base;
box-shadow: @box-shadow-base;

Expand Down