@alicloud/console-base-theme 1.3.91 → 1.4.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/cjs/index.js +2 -2
- package/build/cjs/mixin/button.js +3 -2
- package/build/cjs/theme-style-dark/index.js +2 -4
- package/build/cjs/theme-style-light/index.js +2 -4
- package/build/cjs/util/index.js +23 -0
- package/build/cjs/var/size.js +2 -2
- package/build/cjs/var/z-index.js +2 -0
- package/build/es/index.js +1 -1
- package/build/es/mixin/button.js +3 -2
- package/build/es/theme-style-dark/index.js +1 -1
- package/build/es/theme-style-light/index.js +1 -1
- package/build/es/util/index.js +2 -0
- package/build/es/var/size.js +2 -2
- package/build/es/var/z-index.js +2 -0
- package/build/types/index.d.ts +1 -1
- package/build/types/mixin/button.d.ts +2 -1
- package/build/types/util/index.d.ts +2 -0
- package/build/types/var/index.d.ts +1 -0
- package/build/types/var/z-index.d.ts +1 -0
- package/package.json +6 -6
package/build/cjs/index.js
CHANGED
|
@@ -27,7 +27,7 @@ exports.mixinTopNavButtonDarkFix = void 0;
|
|
|
27
27
|
Object.defineProperty(exports, "toggleBodyClass", {
|
|
28
28
|
enumerable: true,
|
|
29
29
|
get: function get() {
|
|
30
|
-
return
|
|
30
|
+
return _util.toggleBodyClass;
|
|
31
31
|
}
|
|
32
32
|
});
|
|
33
33
|
|
|
@@ -65,7 +65,7 @@ var _themeStyleLight = _interopRequireDefault(require("./theme-style-light"));
|
|
|
65
65
|
|
|
66
66
|
var _themeStyleDark = _interopRequireDefault(require("./theme-style-dark"));
|
|
67
67
|
|
|
68
|
-
var
|
|
68
|
+
var _util = require("./util");
|
|
69
69
|
|
|
70
70
|
// 主题黑的时候,在顶栏上的 button 背景色不能是标准的... FIXME 我需要调整颜色的策略 primary-secondary-tertiary 区分 container 和 control
|
|
71
71
|
var mixinTopNavButtonDarkFix = (0, _styledComponents.css)([".theme-dark &{background-color:rgba(255,255,255,0.08);}"]);
|
|
@@ -19,9 +19,10 @@ var _shadow = require("./shadow");
|
|
|
19
19
|
* 对按钮样式进行重置:
|
|
20
20
|
* 1. 去掉 padding、background、border,定义 outline 以防止丑陋的 Chrome focus outline 样式
|
|
21
21
|
* 2. 设置字体(family、颜色、大小、行间距等)继承
|
|
22
|
-
* 3.
|
|
22
|
+
* 3. 避免 link hover 的样式干扰
|
|
23
|
+
* 4. 定义 disabled 的基础样式
|
|
23
24
|
*/
|
|
24
|
-
var mixinButtonReset = (0, _styledComponents.css)(["padding:0;border:1px solid transparent;box-sizing:border-box;outline:none;background:none;line-height:inherit;cursor:pointer;font-family:inherit;font-size:inherit;text-align:center;text-decoration:none;color:inherit;transition:all ease-out 0.3s;&:hover{text-decoration:none;}&[disabled]{cursor:not-allowed;}"]);
|
|
25
|
+
var mixinButtonReset = (0, _styledComponents.css)(["padding:0;border:1px solid transparent;box-sizing:border-box;outline:none;background:none;line-height:inherit;cursor:pointer;font-family:inherit;font-size:inherit;text-align:center;text-decoration:none;color:inherit;transition:all ease-out 0.3s;&:hover,&:link:hover{text-decoration:none;}&[disabled]{cursor:not-allowed;}"]);
|
|
25
26
|
exports.mixinButtonReset = mixinButtonReset;
|
|
26
27
|
var mixinButtonShadow = (0, _styledComponents.css)(["&:hover,&:focus{", "}&:active,&:disabled{box-shadow:none;}"], _shadow.mixinShadowLDown); // size mixins
|
|
27
28
|
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
3
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
4
|
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
@@ -9,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
9
7
|
});
|
|
10
8
|
exports.default = void 0;
|
|
11
9
|
|
|
12
|
-
var
|
|
10
|
+
var _util = require("../util");
|
|
13
11
|
|
|
14
12
|
var VARS = _interopRequireWildcard(require("./var"));
|
|
15
13
|
|
|
@@ -17,6 +15,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
17
15
|
|
|
18
16
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
19
17
|
|
|
20
|
-
var _default = (0,
|
|
18
|
+
var _default = (0, _util.createThemeGlobalStyle)(VARS);
|
|
21
19
|
|
|
22
20
|
exports.default = _default;
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
3
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
4
|
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
@@ -11,12 +9,12 @@ exports.default = void 0;
|
|
|
11
9
|
|
|
12
10
|
var VARS = _interopRequireWildcard(require("../var"));
|
|
13
11
|
|
|
14
|
-
var
|
|
12
|
+
var _util = require("../util");
|
|
15
13
|
|
|
16
14
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
17
15
|
|
|
18
16
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
19
17
|
|
|
20
|
-
var _default = (0,
|
|
18
|
+
var _default = (0, _util.createThemeGlobalStyle)(VARS);
|
|
21
19
|
|
|
22
20
|
exports.default = _default;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
Object.defineProperty(exports, "createThemeGlobalStyle", {
|
|
9
|
+
enumerable: true,
|
|
10
|
+
get: function get() {
|
|
11
|
+
return _createThemeGlobalStyle.default;
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
Object.defineProperty(exports, "toggleBodyClass", {
|
|
15
|
+
enumerable: true,
|
|
16
|
+
get: function get() {
|
|
17
|
+
return _toggleBodyClass.default;
|
|
18
|
+
}
|
|
19
|
+
});
|
|
20
|
+
|
|
21
|
+
var _createThemeGlobalStyle = _interopRequireDefault(require("./create-theme-global-style"));
|
|
22
|
+
|
|
23
|
+
var _toggleBodyClass = _interopRequireDefault(require("./toggle-body-class"));
|
package/build/cjs/var/size.js
CHANGED
|
@@ -62,9 +62,9 @@ var _default = {
|
|
|
62
62
|
HEIGHT_TOP_NAV: 50,
|
|
63
63
|
// 顶栏高度
|
|
64
64
|
// 表单控件(按钮、输入框)的高度梯度
|
|
65
|
-
HEIGHT_FORM_CONTROL_XS:
|
|
66
|
-
HEIGHT_FORM_CONTROL_S: 24,
|
|
65
|
+
HEIGHT_FORM_CONTROL_XS: 24,
|
|
67
66
|
// 对标 xconsole 的 small
|
|
67
|
+
HEIGHT_FORM_CONTROL_S: 28,
|
|
68
68
|
HEIGHT_FORM_CONTROL_M: 32,
|
|
69
69
|
// 对标 xconsole 的 medium
|
|
70
70
|
HEIGHT_FORM_CONTROL_L: 36,
|
package/build/cjs/var/z-index.js
CHANGED
package/build/es/index.js
CHANGED
|
@@ -3,6 +3,6 @@ export * from './var';
|
|
|
3
3
|
export * from './mixin';
|
|
4
4
|
export { default as ThemeStyleLight } from './theme-style-light';
|
|
5
5
|
export { default as ThemeStyleDark } from './theme-style-dark';
|
|
6
|
-
export {
|
|
6
|
+
export { toggleBodyClass } from './util'; // 主题黑的时候,在顶栏上的 button 背景色不能是标准的... FIXME 我需要调整颜色的策略 primary-secondary-tertiary 区分 container 和 control
|
|
7
7
|
|
|
8
8
|
export var mixinTopNavButtonDarkFix = css([".theme-dark &{background-color:rgba(255,255,255,0.08);}"]);
|
package/build/es/mixin/button.js
CHANGED
|
@@ -6,10 +6,11 @@ import { mixinShadowLDown } from './shadow';
|
|
|
6
6
|
* 对按钮样式进行重置:
|
|
7
7
|
* 1. 去掉 padding、background、border,定义 outline 以防止丑陋的 Chrome focus outline 样式
|
|
8
8
|
* 2. 设置字体(family、颜色、大小、行间距等)继承
|
|
9
|
-
* 3.
|
|
9
|
+
* 3. 避免 link hover 的样式干扰
|
|
10
|
+
* 4. 定义 disabled 的基础样式
|
|
10
11
|
*/
|
|
11
12
|
|
|
12
|
-
export var mixinButtonReset = css(["padding:0;border:1px solid transparent;box-sizing:border-box;outline:none;background:none;line-height:inherit;cursor:pointer;font-family:inherit;font-size:inherit;text-align:center;text-decoration:none;color:inherit;transition:all ease-out 0.3s;&:hover{text-decoration:none;}&[disabled]{cursor:not-allowed;}"]);
|
|
13
|
+
export var mixinButtonReset = css(["padding:0;border:1px solid transparent;box-sizing:border-box;outline:none;background:none;line-height:inherit;cursor:pointer;font-family:inherit;font-size:inherit;text-align:center;text-decoration:none;color:inherit;transition:all ease-out 0.3s;&:hover,&:link:hover{text-decoration:none;}&[disabled]{cursor:not-allowed;}"]);
|
|
13
14
|
export var mixinButtonShadow = css(["&:hover,&:focus{", "}&:active,&:disabled{box-shadow:none;}"], mixinShadowLDown); // size mixins
|
|
14
15
|
|
|
15
16
|
export var mixinButtonSizeXs = css(["padding:0 ", "px;height:", "px;line-height:", "px;font-size:", "px;"], SIZE.PADDING_X_FORM_CONTROL_XS, SIZE.HEIGHT_FORM_CONTROL_XS, SIZE.HEIGHT_FORM_CONTROL_XS - 2, SIZE.FONT_SIZE_FORM_CONTROL_XS);
|
package/build/es/var/size.js
CHANGED
|
@@ -55,9 +55,9 @@ export default {
|
|
|
55
55
|
HEIGHT_TOP_NAV: 50,
|
|
56
56
|
// 顶栏高度
|
|
57
57
|
// 表单控件(按钮、输入框)的高度梯度
|
|
58
|
-
HEIGHT_FORM_CONTROL_XS:
|
|
59
|
-
HEIGHT_FORM_CONTROL_S: 24,
|
|
58
|
+
HEIGHT_FORM_CONTROL_XS: 24,
|
|
60
59
|
// 对标 xconsole 的 small
|
|
60
|
+
HEIGHT_FORM_CONTROL_S: 28,
|
|
61
61
|
HEIGHT_FORM_CONTROL_M: 32,
|
|
62
62
|
// 对标 xconsole 的 medium
|
|
63
63
|
HEIGHT_FORM_CONTROL_L: 36,
|
package/build/es/var/z-index.js
CHANGED
package/build/types/index.d.ts
CHANGED
|
@@ -2,6 +2,6 @@ export * from './var';
|
|
|
2
2
|
export * from './mixin';
|
|
3
3
|
export { default as ThemeStyleLight } from './theme-style-light';
|
|
4
4
|
export { default as ThemeStyleDark } from './theme-style-dark';
|
|
5
|
-
export {
|
|
5
|
+
export { toggleBodyClass } from './util';
|
|
6
6
|
export declare const mixinTopNavButtonDarkFix: import("styled-components").FlattenSimpleInterpolation;
|
|
7
7
|
export type { IPropsEllipsisLines as EllipsisLinesProps } from './types';
|
|
@@ -2,7 +2,8 @@
|
|
|
2
2
|
* 对按钮样式进行重置:
|
|
3
3
|
* 1. 去掉 padding、background、border,定义 outline 以防止丑陋的 Chrome focus outline 样式
|
|
4
4
|
* 2. 设置字体(family、颜色、大小、行间距等)继承
|
|
5
|
-
* 3.
|
|
5
|
+
* 3. 避免 link hover 的样式干扰
|
|
6
|
+
* 4. 定义 disabled 的基础样式
|
|
6
7
|
*/
|
|
7
8
|
export declare const mixinButtonReset: import("styled-components").FlattenSimpleInterpolation;
|
|
8
9
|
export declare const mixinButtonShadow: import("styled-components").FlattenSimpleInterpolation;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@alicloud/console-base-theme",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.4.2",
|
|
4
4
|
"description": "控制台主题 - 基于 css variable 和 styled-components",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -25,15 +25,15 @@
|
|
|
25
25
|
],
|
|
26
26
|
"devDependencies": {
|
|
27
27
|
"@alicloud/console-toolkit-cli": "^1.2.30",
|
|
28
|
-
"@alicloud/console-toolkit-preset-component": "^1.2.
|
|
29
|
-
"@alicloud/demo-rc-elements": "^1.
|
|
28
|
+
"@alicloud/console-toolkit-preset-component": "^1.2.53",
|
|
29
|
+
"@alicloud/demo-rc-elements": "^1.5.2",
|
|
30
30
|
"@types/lodash": "^4.14.178",
|
|
31
|
-
"@types/react": "^17.0.
|
|
32
|
-
"@types/styled-components": "^5.1.
|
|
31
|
+
"@types/react": "^17.0.39",
|
|
32
|
+
"@types/styled-components": "^5.1.23",
|
|
33
33
|
"lodash": "^4.17.21",
|
|
34
34
|
"react": "^17.0.2",
|
|
35
35
|
"styled-components": "^5.3.3",
|
|
36
|
-
"typescript": "^4.5.
|
|
36
|
+
"typescript": "^4.5.5"
|
|
37
37
|
},
|
|
38
38
|
"peerDependencies": {
|
|
39
39
|
"styled-components": ">=5"
|