56 lines
2.4 KiB
JavaScript
56 lines
2.4 KiB
JavaScript
"use strict";
|
|
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.useStyle = useStyle;
|
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
var _proProvider = require("@ant-design/pro-provider");
|
|
var genSiderMenuStyle = function genSiderMenuStyle(token) {
|
|
var _token$layout, _token$layout2, _token$layout3;
|
|
return (0, _defineProperty2.default)({}, token.componentCls, {
|
|
position: 'absolute',
|
|
insetBlockStart: '18px',
|
|
zIndex: '101',
|
|
width: '24px',
|
|
height: '24px',
|
|
fontSize: ['14px', '16px'],
|
|
textAlign: 'center',
|
|
borderRadius: '40px',
|
|
insetInlineEnd: '-13px',
|
|
transition: 'transform 0.3s',
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
cursor: 'pointer',
|
|
color: (_token$layout = token.layout) === null || _token$layout === void 0 || (_token$layout = _token$layout.sider) === null || _token$layout === void 0 ? void 0 : _token$layout.colorTextCollapsedButton,
|
|
backgroundColor: (_token$layout2 = token.layout) === null || _token$layout2 === void 0 || (_token$layout2 = _token$layout2.sider) === null || _token$layout2 === void 0 ? void 0 : _token$layout2.colorBgCollapsedButton,
|
|
boxShadow: '0 2px 8px -2px rgba(0,0,0,0.05), 0 1px 4px -1px rgba(25,15,15,0.07), 0 0 1px 0 rgba(0,0,0,0.08)',
|
|
'&:hover': {
|
|
color: (_token$layout3 = token.layout) === null || _token$layout3 === void 0 || (_token$layout3 = _token$layout3.sider) === null || _token$layout3 === void 0 ? void 0 : _token$layout3.colorTextCollapsedButtonHover,
|
|
boxShadow: '0 4px 16px -4px rgba(0,0,0,0.05), 0 2px 8px -2px rgba(25,15,15,0.07), 0 1px 2px 0 rgba(0,0,0,0.08)'
|
|
},
|
|
'.anticon': {
|
|
fontSize: '14px'
|
|
},
|
|
'& > svg': {
|
|
transition: 'transform 0.3s',
|
|
transform: 'rotate(90deg)'
|
|
},
|
|
'&-collapsed': {
|
|
'& > svg': {
|
|
transform: 'rotate(-90deg)'
|
|
}
|
|
}
|
|
});
|
|
};
|
|
function useStyle(prefixCls) {
|
|
return (0, _proProvider.useStyle)('SiderMenuCollapsedIcon', function (token) {
|
|
var siderMenuToken = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, token), {}, {
|
|
componentCls: ".".concat(prefixCls)
|
|
});
|
|
return [genSiderMenuStyle(siderMenuToken)];
|
|
});
|
|
} |