Feat(Theme): Support dark mode
This commit is contained in:
311
package-lock.json
generated
311
package-lock.json
generated
@@ -33,6 +33,7 @@
|
|||||||
"@typescript/ata": "^0.9.7",
|
"@typescript/ata": "^0.9.7",
|
||||||
"@vitejs/plugin-react": "^4.3.2",
|
"@vitejs/plugin-react": "^4.3.2",
|
||||||
"antd": "^5.21.4",
|
"antd": "^5.21.4",
|
||||||
|
"antd-style": "^3.7.0",
|
||||||
"axios": "^1.7.4",
|
"axios": "^1.7.4",
|
||||||
"custom-protocol-check": "^1.4.0",
|
"custom-protocol-check": "^1.4.0",
|
||||||
"dayjs": "^1.11.13",
|
"dayjs": "^1.11.13",
|
||||||
@@ -910,6 +911,84 @@
|
|||||||
"node": ">= 10.0.0"
|
"node": ">= 10.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/@emotion/babel-plugin": {
|
||||||
|
"version": "11.12.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.12.0.tgz",
|
||||||
|
"integrity": "sha512-y2WQb+oP8Jqvvclh8Q55gLUyb7UFvgv7eJfsj7td5TToBrIUtPay2kMrZi4xjq9qw2vD0ZR5fSho0yqoFgX7Rw==",
|
||||||
|
"dev": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@babel/helper-module-imports": "^7.16.7",
|
||||||
|
"@babel/runtime": "^7.18.3",
|
||||||
|
"@emotion/hash": "^0.9.2",
|
||||||
|
"@emotion/memoize": "^0.9.0",
|
||||||
|
"@emotion/serialize": "^1.2.0",
|
||||||
|
"babel-plugin-macros": "^3.1.0",
|
||||||
|
"convert-source-map": "^1.5.0",
|
||||||
|
"escape-string-regexp": "^4.0.0",
|
||||||
|
"find-root": "^1.1.0",
|
||||||
|
"source-map": "^0.5.7",
|
||||||
|
"stylis": "4.2.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/babel-plugin/node_modules/@emotion/hash": {
|
||||||
|
"version": "0.9.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz",
|
||||||
|
"integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/babel-plugin/node_modules/convert-source-map": {
|
||||||
|
"version": "1.9.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.9.0.tgz",
|
||||||
|
"integrity": "sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/babel-plugin/node_modules/source-map": {
|
||||||
|
"version": "0.5.7",
|
||||||
|
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
|
||||||
|
"integrity": "sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==",
|
||||||
|
"dev": true,
|
||||||
|
"engines": {
|
||||||
|
"node": ">=0.10.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/babel-plugin/node_modules/stylis": {
|
||||||
|
"version": "4.2.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/stylis/-/stylis-4.2.0.tgz",
|
||||||
|
"integrity": "sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/cache": {
|
||||||
|
"version": "11.13.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.13.1.tgz",
|
||||||
|
"integrity": "sha512-iqouYkuEblRcXmylXIwwOodiEK5Ifl7JcX7o6V4jI3iW4mLXX3dmt5xwBtIkJiQEXFAI+pC8X0i67yiPkH9Ucw==",
|
||||||
|
"dev": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@emotion/memoize": "^0.9.0",
|
||||||
|
"@emotion/sheet": "^1.4.0",
|
||||||
|
"@emotion/utils": "^1.4.0",
|
||||||
|
"@emotion/weak-memoize": "^0.4.0",
|
||||||
|
"stylis": "4.2.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/cache/node_modules/stylis": {
|
||||||
|
"version": "4.2.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/stylis/-/stylis-4.2.0.tgz",
|
||||||
|
"integrity": "sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/css": {
|
||||||
|
"version": "11.13.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/css/-/css-11.13.4.tgz",
|
||||||
|
"integrity": "sha512-CthbOD5EBw+iN0rfM96Tuv5kaZN4nxPyYDvGUs0bc7wZBBiU/0mse+l+0O9RshW2d+v5HH1cme+BAbLJ/3Folw==",
|
||||||
|
"dev": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@emotion/babel-plugin": "^11.12.0",
|
||||||
|
"@emotion/cache": "^11.13.0",
|
||||||
|
"@emotion/serialize": "^1.3.0",
|
||||||
|
"@emotion/sheet": "^1.4.0",
|
||||||
|
"@emotion/utils": "^1.4.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/@emotion/hash": {
|
"node_modules/@emotion/hash": {
|
||||||
"version": "0.8.0",
|
"version": "0.8.0",
|
||||||
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz",
|
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz",
|
||||||
@@ -917,6 +996,67 @@
|
|||||||
"dev": true,
|
"dev": true,
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"node_modules/@emotion/memoize": {
|
||||||
|
"version": "0.9.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.9.0.tgz",
|
||||||
|
"integrity": "sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/react": {
|
||||||
|
"version": "11.13.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.13.3.tgz",
|
||||||
|
"integrity": "sha512-lIsdU6JNrmYfJ5EbUCf4xW1ovy5wKQ2CkPRM4xogziOxH1nXxBSjpC9YqbFAP7circxMfYp+6x676BqWcEiixg==",
|
||||||
|
"dev": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@babel/runtime": "^7.18.3",
|
||||||
|
"@emotion/babel-plugin": "^11.12.0",
|
||||||
|
"@emotion/cache": "^11.13.0",
|
||||||
|
"@emotion/serialize": "^1.3.1",
|
||||||
|
"@emotion/use-insertion-effect-with-fallbacks": "^1.1.0",
|
||||||
|
"@emotion/utils": "^1.4.0",
|
||||||
|
"@emotion/weak-memoize": "^0.4.0",
|
||||||
|
"hoist-non-react-statics": "^3.3.1"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": ">=16.8.0"
|
||||||
|
},
|
||||||
|
"peerDependenciesMeta": {
|
||||||
|
"@types/react": {
|
||||||
|
"optional": true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/serialize": {
|
||||||
|
"version": "1.3.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.3.2.tgz",
|
||||||
|
"integrity": "sha512-grVnMvVPK9yUVE6rkKfAJlYZgo0cu3l9iMC77V7DW6E1DUIrU68pSEXRmFZFOFB1QFo57TncmOcvcbMDWsL4yA==",
|
||||||
|
"dev": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@emotion/hash": "^0.9.2",
|
||||||
|
"@emotion/memoize": "^0.9.0",
|
||||||
|
"@emotion/unitless": "^0.10.0",
|
||||||
|
"@emotion/utils": "^1.4.1",
|
||||||
|
"csstype": "^3.0.2"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/serialize/node_modules/@emotion/hash": {
|
||||||
|
"version": "0.9.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz",
|
||||||
|
"integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/serialize/node_modules/@emotion/unitless": {
|
||||||
|
"version": "0.10.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.10.0.tgz",
|
||||||
|
"integrity": "sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/sheet": {
|
||||||
|
"version": "1.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.4.0.tgz",
|
||||||
|
"integrity": "sha512-fTBW9/8r2w3dXWYM4HCB1Rdp8NLibOw2+XELH5m5+AkWiL/KqYX6dc0kKYlaYyKjrQ6ds33MCdMPEwgs2z1rqg==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"node_modules/@emotion/unitless": {
|
"node_modules/@emotion/unitless": {
|
||||||
"version": "0.7.5",
|
"version": "0.7.5",
|
||||||
"resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz",
|
"resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz",
|
||||||
@@ -924,6 +1064,27 @@
|
|||||||
"dev": true,
|
"dev": true,
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"node_modules/@emotion/use-insertion-effect-with-fallbacks": {
|
||||||
|
"version": "1.1.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.1.0.tgz",
|
||||||
|
"integrity": "sha512-+wBOcIV5snwGgI2ya3u99D7/FJquOIniQT1IKyDsBmEgwvpxMNeS65Oib7OnE2d2aY+3BU4OiH+0Wchf8yk3Hw==",
|
||||||
|
"dev": true,
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": ">=16.8.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/utils": {
|
||||||
|
"version": "1.4.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.4.1.tgz",
|
||||||
|
"integrity": "sha512-BymCXzCG3r72VKJxaYVwOXATqXIZ85cuvg0YOUDxMGNrKc1DJRZk8MgV5wyXRyEayIMd4FuXJIUgTBXvDNW5cA==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/weak-memoize": {
|
||||||
|
"version": "0.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.4.0.tgz",
|
||||||
|
"integrity": "sha512-snKqtPW01tN0ui7yu9rGv69aJXr/a/Ywvl11sUjNtEcRc+ng/mQriFL0wLXMef74iHa/EkftbDzU9F8iFbH+zg==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"node_modules/@esbuild/aix-ppc64": {
|
"node_modules/@esbuild/aix-ppc64": {
|
||||||
"version": "0.21.5",
|
"version": "0.21.5",
|
||||||
"resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz",
|
"resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz",
|
||||||
@@ -3061,6 +3222,12 @@
|
|||||||
"undici-types": "~6.19.2"
|
"undici-types": "~6.19.2"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/@types/parse-json": {
|
||||||
|
"version": "4.0.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.2.tgz",
|
||||||
|
"integrity": "sha512-dISoDXWWQwUquiKsyZ4Ng+HX2KsPL7LyHKHQwgGFEA3IaKac4Obd+h2a/a6waisAoepJlBcx9paWqjA8/HVjCw==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"node_modules/@types/plist": {
|
"node_modules/@types/plist": {
|
||||||
"version": "3.0.5",
|
"version": "3.0.5",
|
||||||
"resolved": "https://registry.npmjs.org/@types/plist/-/plist-3.0.5.tgz",
|
"resolved": "https://registry.npmjs.org/@types/plist/-/plist-3.0.5.tgz",
|
||||||
@@ -3608,6 +3775,26 @@
|
|||||||
"react-dom": ">=16.9.0"
|
"react-dom": ">=16.9.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/antd-style": {
|
||||||
|
"version": "3.7.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/antd-style/-/antd-style-3.7.1.tgz",
|
||||||
|
"integrity": "sha512-CQOfddVp4aOvBfCepa+Kj2e7ap+2XBINg1Kn2osdE3oQvrD7KJu/K0sfnLcFLkgCJygbxmuazYdWLKb+drPDYA==",
|
||||||
|
"dev": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@ant-design/cssinjs": "^1.21.1",
|
||||||
|
"@babel/runtime": "^7.24.1",
|
||||||
|
"@emotion/cache": "^11.11.0",
|
||||||
|
"@emotion/css": "^11.11.2",
|
||||||
|
"@emotion/react": "^11.11.4",
|
||||||
|
"@emotion/serialize": "^1.1.3",
|
||||||
|
"@emotion/utils": "^1.2.1",
|
||||||
|
"use-merge-value": "^1.2.0"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"antd": ">=5.8.1",
|
||||||
|
"react": ">=18"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/app-builder-bin": {
|
"node_modules/app-builder-bin": {
|
||||||
"version": "4.0.0",
|
"version": "4.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/app-builder-bin/-/app-builder-bin-4.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/app-builder-bin/-/app-builder-bin-4.0.0.tgz",
|
||||||
@@ -3878,6 +4065,37 @@
|
|||||||
"proxy-from-env": "^1.1.0"
|
"proxy-from-env": "^1.1.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/babel-plugin-macros": {
|
||||||
|
"version": "3.1.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-3.1.0.tgz",
|
||||||
|
"integrity": "sha512-Cg7TFGpIr01vOQNODXOOaGz2NpCU5gl8x1qJFbb6hbZxR7XrcE2vtbAsTAbJ7/xwJtUuJEw8K8Zr/AE0LHlesg==",
|
||||||
|
"dev": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@babel/runtime": "^7.12.5",
|
||||||
|
"cosmiconfig": "^7.0.0",
|
||||||
|
"resolve": "^1.19.0"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=10",
|
||||||
|
"npm": ">=6"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/babel-plugin-macros/node_modules/cosmiconfig": {
|
||||||
|
"version": "7.1.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-7.1.0.tgz",
|
||||||
|
"integrity": "sha512-AdmX6xUzdNASswsFtmwSt7Vj8po9IuqXm0UXz7QKPuEUmPB4XyjGfaAr2PSuELMwkRMVH1EpIkX5bTZGRB3eCA==",
|
||||||
|
"dev": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@types/parse-json": "^4.0.0",
|
||||||
|
"import-fresh": "^3.2.1",
|
||||||
|
"parse-json": "^5.0.0",
|
||||||
|
"path-type": "^4.0.0",
|
||||||
|
"yaml": "^1.10.0"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=10"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/balanced-match": {
|
"node_modules/balanced-match": {
|
||||||
"version": "1.0.2",
|
"version": "1.0.2",
|
||||||
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
|
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
|
||||||
@@ -5982,6 +6200,12 @@
|
|||||||
"node": ">=8"
|
"node": ">=8"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/find-root": {
|
||||||
|
"version": "1.1.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
|
||||||
|
"integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"node_modules/find-up": {
|
"node_modules/find-up": {
|
||||||
"version": "5.0.0",
|
"version": "5.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
|
||||||
@@ -6154,8 +6378,8 @@
|
|||||||
"version": "1.1.2",
|
"version": "1.1.2",
|
||||||
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
|
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
|
||||||
"integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
|
"integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
|
||||||
|
"devOptional": true,
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"optional": true,
|
|
||||||
"funding": {
|
"funding": {
|
||||||
"url": "https://github.com/sponsors/ljharb"
|
"url": "https://github.com/sponsors/ljharb"
|
||||||
}
|
}
|
||||||
@@ -6439,8 +6663,8 @@
|
|||||||
"version": "2.0.2",
|
"version": "2.0.2",
|
||||||
"resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
|
"resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
|
||||||
"integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
|
"integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
|
||||||
|
"devOptional": true,
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"optional": true,
|
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"function-bind": "^1.1.2"
|
"function-bind": "^1.1.2"
|
||||||
},
|
},
|
||||||
@@ -6448,6 +6672,21 @@
|
|||||||
"node": ">= 0.4"
|
"node": ">= 0.4"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/hoist-non-react-statics": {
|
||||||
|
"version": "3.3.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
|
||||||
|
"integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
|
||||||
|
"dev": true,
|
||||||
|
"dependencies": {
|
||||||
|
"react-is": "^16.7.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/hoist-non-react-statics/node_modules/react-is": {
|
||||||
|
"version": "16.13.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
||||||
|
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"node_modules/hosted-git-info": {
|
"node_modules/hosted-git-info": {
|
||||||
"version": "4.1.0",
|
"version": "4.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-4.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-4.1.0.tgz",
|
||||||
@@ -6700,6 +6939,21 @@
|
|||||||
"is-ci": "bin.js"
|
"is-ci": "bin.js"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/is-core-module": {
|
||||||
|
"version": "2.15.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.15.1.tgz",
|
||||||
|
"integrity": "sha512-z0vtXSwucUJtANQWldhbtbt7BnL0vxiFjIdDLAatwhDYty2bad6s+rijD6Ri4YuYJubLzIJLUidCh09e1djEVQ==",
|
||||||
|
"dev": true,
|
||||||
|
"dependencies": {
|
||||||
|
"hasown": "^2.0.2"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">= 0.4"
|
||||||
|
},
|
||||||
|
"funding": {
|
||||||
|
"url": "https://github.com/sponsors/ljharb"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/is-extglob": {
|
"node_modules/is-extglob": {
|
||||||
"version": "2.1.1",
|
"version": "2.1.1",
|
||||||
"resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
|
"resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
|
||||||
@@ -7886,6 +8140,12 @@
|
|||||||
"node": ">=8"
|
"node": ">=8"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/path-parse": {
|
||||||
|
"version": "1.0.7",
|
||||||
|
"resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
|
||||||
|
"integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"node_modules/path-scurry": {
|
"node_modules/path-scurry": {
|
||||||
"version": "1.11.1",
|
"version": "1.11.1",
|
||||||
"resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
|
"resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
|
||||||
@@ -9032,6 +9292,23 @@
|
|||||||
"dev": true,
|
"dev": true,
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"node_modules/resolve": {
|
||||||
|
"version": "1.22.8",
|
||||||
|
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz",
|
||||||
|
"integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==",
|
||||||
|
"dev": true,
|
||||||
|
"dependencies": {
|
||||||
|
"is-core-module": "^2.13.0",
|
||||||
|
"path-parse": "^1.0.7",
|
||||||
|
"supports-preserve-symlinks-flag": "^1.0.0"
|
||||||
|
},
|
||||||
|
"bin": {
|
||||||
|
"resolve": "bin/resolve"
|
||||||
|
},
|
||||||
|
"funding": {
|
||||||
|
"url": "https://github.com/sponsors/ljharb"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/resolve-alpn": {
|
"node_modules/resolve-alpn": {
|
||||||
"version": "1.2.1",
|
"version": "1.2.1",
|
||||||
"resolved": "https://registry.npmjs.org/resolve-alpn/-/resolve-alpn-1.2.1.tgz",
|
"resolved": "https://registry.npmjs.org/resolve-alpn/-/resolve-alpn-1.2.1.tgz",
|
||||||
@@ -9628,6 +9905,18 @@
|
|||||||
"node": ">=8"
|
"node": ">=8"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/supports-preserve-symlinks-flag": {
|
||||||
|
"version": "1.0.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz",
|
||||||
|
"integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==",
|
||||||
|
"dev": true,
|
||||||
|
"engines": {
|
||||||
|
"node": ">= 0.4"
|
||||||
|
},
|
||||||
|
"funding": {
|
||||||
|
"url": "https://github.com/sponsors/ljharb"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/svg-parser": {
|
"node_modules/svg-parser": {
|
||||||
"version": "2.0.4",
|
"version": "2.0.4",
|
||||||
"resolved": "https://registry.npmjs.org/svg-parser/-/svg-parser-2.0.4.tgz",
|
"resolved": "https://registry.npmjs.org/svg-parser/-/svg-parser-2.0.4.tgz",
|
||||||
@@ -10200,6 +10489,15 @@
|
|||||||
"requires-port": "^1.0.0"
|
"requires-port": "^1.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/use-merge-value": {
|
||||||
|
"version": "1.2.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/use-merge-value/-/use-merge-value-1.2.0.tgz",
|
||||||
|
"integrity": "sha512-DXgG0kkgJN45TcyoXL49vJnn55LehnrmoHc7MbKi+QDBvr8dsesqws8UlyIWGHMR+JXgxc1nvY+jDGMlycsUcw==",
|
||||||
|
"dev": true,
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": ">= 16.x"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/utf8-byte-length": {
|
"node_modules/utf8-byte-length": {
|
||||||
"version": "1.0.5",
|
"version": "1.0.5",
|
||||||
"resolved": "https://registry.npmjs.org/utf8-byte-length/-/utf8-byte-length-1.0.5.tgz",
|
"resolved": "https://registry.npmjs.org/utf8-byte-length/-/utf8-byte-length-1.0.5.tgz",
|
||||||
@@ -10505,6 +10803,15 @@
|
|||||||
"dev": true,
|
"dev": true,
|
||||||
"license": "ISC"
|
"license": "ISC"
|
||||||
},
|
},
|
||||||
|
"node_modules/yaml": {
|
||||||
|
"version": "1.10.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz",
|
||||||
|
"integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==",
|
||||||
|
"dev": true,
|
||||||
|
"engines": {
|
||||||
|
"node": ">= 6"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/yargs": {
|
"node_modules/yargs": {
|
||||||
"version": "17.7.2",
|
"version": "17.7.2",
|
||||||
"resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
|
"resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
|
||||||
|
|||||||
@@ -54,6 +54,7 @@
|
|||||||
"@typescript/ata": "^0.9.7",
|
"@typescript/ata": "^0.9.7",
|
||||||
"@vitejs/plugin-react": "^4.3.2",
|
"@vitejs/plugin-react": "^4.3.2",
|
||||||
"antd": "^5.21.4",
|
"antd": "^5.21.4",
|
||||||
|
"antd-style": "^3.7.0",
|
||||||
"axios": "^1.7.4",
|
"axios": "^1.7.4",
|
||||||
"custom-protocol-check": "^1.4.0",
|
"custom-protocol-check": "^1.4.0",
|
||||||
"dayjs": "^1.11.13",
|
"dayjs": "^1.11.13",
|
||||||
|
|||||||
@@ -1,27 +1,65 @@
|
|||||||
|
import { theme } from 'antd'
|
||||||
|
import zh_CN from 'antd/locale/zh_CN'
|
||||||
|
import BaseStyles from '@/assets/css/base.style'
|
||||||
|
import CommonStyles from '@/assets/css/common.style'
|
||||||
|
import { COLOR_PRODUCTION } from '@/constants/common.constants'
|
||||||
import { getRouter } from '@/router'
|
import { getRouter } from '@/router'
|
||||||
import FullscreenLoadingMask from '@/components/common/FullscreenLoadingMask'
|
import FullscreenLoadingMask from '@/components/common/FullscreenLoadingMask'
|
||||||
|
|
||||||
export const AppContext = createContext<{ refreshRouter: () => void }>({
|
export const AppContext = createContext({
|
||||||
refreshRouter: () => undefined
|
refreshRouter: () => {},
|
||||||
|
isDarkMode: false
|
||||||
})
|
})
|
||||||
|
|
||||||
const App = () => {
|
const App = () => {
|
||||||
const [routerState, setRouterState] = useState(getRouter)
|
const [routerState, setRouterState] = useState(getRouter)
|
||||||
|
const [isDarkMode, setIsDarkMode] = useState(false)
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)')
|
||||||
|
setIsDarkMode(darkThemeMq.matches)
|
||||||
|
const listener = (ev: MediaQueryListEvent) => {
|
||||||
|
setIsDarkMode(ev.matches)
|
||||||
|
}
|
||||||
|
darkThemeMq.addEventListener('change', listener)
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
darkThemeMq.removeEventListener('change', listener)
|
||||||
|
}
|
||||||
|
}, [])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<AntdConfigProvider
|
||||||
|
theme={{
|
||||||
|
cssVar: true,
|
||||||
|
algorithm: isDarkMode ? theme.darkAlgorithm : undefined,
|
||||||
|
token: {
|
||||||
|
colorPrimary: COLOR_PRODUCTION,
|
||||||
|
colorLinkHover: COLOR_PRODUCTION
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
Tree: {
|
||||||
|
colorBgContainer: 'transparent'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
locale={zh_CN}
|
||||||
|
>
|
||||||
|
<BaseStyles />
|
||||||
|
<CommonStyles />
|
||||||
<AppContext.Provider
|
<AppContext.Provider
|
||||||
value={{
|
value={{
|
||||||
refreshRouter: () => {
|
refreshRouter: () => {
|
||||||
setRouterState(getRouter())
|
setRouterState(getRouter())
|
||||||
}
|
},
|
||||||
|
isDarkMode
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Suspense fallback={<FullscreenLoadingMask />}>
|
<Suspense fallback={<FullscreenLoadingMask />}>
|
||||||
<RouterProvider router={routerState} />
|
<RouterProvider router={routerState} />
|
||||||
</Suspense>
|
</Suspense>
|
||||||
</AppContext.Provider>
|
</AppContext.Provider>
|
||||||
</>
|
</AntdConfigProvider>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,60 +0,0 @@
|
|||||||
* {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
html {
|
|
||||||
scroll-behavior: smooth;
|
|
||||||
}
|
|
||||||
|
|
||||||
em, i {
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
li {
|
|
||||||
list-style: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
border: 0;
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: #666;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
button, input {
|
|
||||||
font-family: Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif;
|
|
||||||
border: 0;
|
|
||||||
outline: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
background-color: #fff;
|
|
||||||
font: 12px/1.5 Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif;
|
|
||||||
color: #666;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hide, .none {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.clearfix:after {
|
|
||||||
visibility: hidden;
|
|
||||||
clear: both;
|
|
||||||
display: block;
|
|
||||||
content: ".";
|
|
||||||
height: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.clearfix {
|
|
||||||
zoom: 1;
|
|
||||||
}
|
|
||||||
32
src/renderer/src/assets/css/base.style.ts
Normal file
32
src/renderer/src/assets/css/base.style.ts
Normal file
@@ -0,0 +1,32 @@
|
|||||||
|
import { createGlobalStyle } from 'antd-style'
|
||||||
|
|
||||||
|
export default createGlobalStyle(() => ({
|
||||||
|
'*': { margin: 0, padding: 0, boxSizing: 'border-box' },
|
||||||
|
html: { scrollBehavior: 'smooth' },
|
||||||
|
'em, i': { fontStyle: 'normal' },
|
||||||
|
li: { listStyle: 'none' },
|
||||||
|
img: { border: 0, verticalAlign: 'middle' },
|
||||||
|
button: { cursor: 'pointer' },
|
||||||
|
a: { color: '#666', textDecoration: 'none' },
|
||||||
|
'button, input': {
|
||||||
|
fontFamily:
|
||||||
|
'Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\\5B8B\\4F53", sans-serif',
|
||||||
|
border: 0,
|
||||||
|
outline: 'none'
|
||||||
|
},
|
||||||
|
body: {
|
||||||
|
WebkitFontSmoothing: 'antialiased',
|
||||||
|
backgroundColor: '#fff',
|
||||||
|
font: '12px/1.5 Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\\5B8B\\4F53", sans-serif',
|
||||||
|
color: '#666'
|
||||||
|
},
|
||||||
|
'.hide, .none': { display: 'none' },
|
||||||
|
'.clearfix:after': {
|
||||||
|
visibility: 'hidden',
|
||||||
|
clear: 'both',
|
||||||
|
display: 'block',
|
||||||
|
content: '"."',
|
||||||
|
height: 0
|
||||||
|
},
|
||||||
|
'.clearfix': { zoom: 1 }
|
||||||
|
}))
|
||||||
@@ -1,118 +0,0 @@
|
|||||||
@import '@/assets/css/constants';
|
|
||||||
|
|
||||||
#root {
|
|
||||||
height: 100vh;
|
|
||||||
width: 100vw;
|
|
||||||
}
|
|
||||||
|
|
||||||
.body {
|
|
||||||
background-color: @background-color;
|
|
||||||
color: @font-main-color;
|
|
||||||
user-select: none;
|
|
||||||
min-width: 900px;
|
|
||||||
min-height: 400px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.fill {
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.fill-with {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.fill-height {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.background-origin {
|
|
||||||
background-color: @origin-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.center-box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.vertical-center-box {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.horizontal-center-box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-size-xs {
|
|
||||||
width: 16px;
|
|
||||||
height: 16px;
|
|
||||||
|
|
||||||
> use {
|
|
||||||
width: 16px;
|
|
||||||
height: 16px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-size-sm {
|
|
||||||
width: 20px;
|
|
||||||
height: 20px;
|
|
||||||
|
|
||||||
> use {
|
|
||||||
width: 20px;
|
|
||||||
height: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-size-md {
|
|
||||||
width: 24px;
|
|
||||||
height: 24px;
|
|
||||||
|
|
||||||
> use {
|
|
||||||
width: 24px;
|
|
||||||
height: 24px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-size-lg {
|
|
||||||
width: 32px;
|
|
||||||
height: 32px;
|
|
||||||
|
|
||||||
> use {
|
|
||||||
|
|
||||||
width: 32px;
|
|
||||||
height: 32px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-size-xl {
|
|
||||||
width: 64px;
|
|
||||||
height: 64px;
|
|
||||||
|
|
||||||
> use {
|
|
||||||
width: 64px;
|
|
||||||
height: 64px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-size-menu {
|
|
||||||
width: 23px;
|
|
||||||
height: 23px;
|
|
||||||
|
|
||||||
> use {
|
|
||||||
width: 23px;
|
|
||||||
height: 23px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.flex-horizontal {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
|
|
||||||
.flex-vertical {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
43
src/renderer/src/assets/css/common.style.ts
Normal file
43
src/renderer/src/assets/css/common.style.ts
Normal file
@@ -0,0 +1,43 @@
|
|||||||
|
import { createGlobalStyle } from 'antd-style'
|
||||||
|
|
||||||
|
export default createGlobalStyle(() => ({
|
||||||
|
'.center-box': {
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'center',
|
||||||
|
alignItems: 'center'
|
||||||
|
},
|
||||||
|
'.vertical-center-box': { display: 'flex', alignItems: 'center' },
|
||||||
|
'.horizontal-center-box': { display: 'flex', justifyContent: 'center' },
|
||||||
|
'.icon-size-xs': {
|
||||||
|
width: 16,
|
||||||
|
height: 16,
|
||||||
|
'> use': { width: 16, height: 16 }
|
||||||
|
},
|
||||||
|
'.icon-size-sm': {
|
||||||
|
width: 20,
|
||||||
|
height: 20,
|
||||||
|
'> use': { width: 20, height: 20 }
|
||||||
|
},
|
||||||
|
'.icon-size-md': {
|
||||||
|
width: 24,
|
||||||
|
height: 24,
|
||||||
|
'> use': { width: 24, height: 24 }
|
||||||
|
},
|
||||||
|
'.icon-size-lg': {
|
||||||
|
width: 32,
|
||||||
|
height: 32,
|
||||||
|
'> use': { width: 32, height: 32 }
|
||||||
|
},
|
||||||
|
'.icon-size-xl': {
|
||||||
|
width: 64,
|
||||||
|
height: 64,
|
||||||
|
'> use': { width: 64, height: 64 }
|
||||||
|
},
|
||||||
|
'.icon-size-menu': {
|
||||||
|
width: 23,
|
||||||
|
height: 23,
|
||||||
|
'> use': { width: 23, height: 23 }
|
||||||
|
},
|
||||||
|
'.flex-horizontal': { display: 'flex', flexDirection: 'row' },
|
||||||
|
'.flex-vertical': { display: 'flex', flexDirection: 'column' }
|
||||||
|
}))
|
||||||
@@ -1,8 +0,0 @@
|
|||||||
@import '@/assets/css/constants';
|
|
||||||
|
|
||||||
.cardBox {
|
|
||||||
background-color: @origin-color;
|
|
||||||
border-radius: 8px;
|
|
||||||
overflow: hidden;
|
|
||||||
box-shadow: 5px 5px 15px 0 rgba(0,0,0,0.1);
|
|
||||||
}
|
|
||||||
10
src/renderer/src/assets/css/components/common/card.style.ts
Normal file
10
src/renderer/src/assets/css/components/common/card.style.ts
Normal file
@@ -0,0 +1,10 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
cardBox: {
|
||||||
|
backgroundColor: token.colorBgContainer,
|
||||||
|
borderRadius: token.borderRadiusLG,
|
||||||
|
overflow: 'hidden',
|
||||||
|
boxShadow: token.boxShadowTertiary
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,7 +0,0 @@
|
|||||||
.fitCenter {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(() => ({
|
||||||
|
fitCenter: {
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'center',
|
||||||
|
alignItems: 'center',
|
||||||
|
width: '100%',
|
||||||
|
height: '100%'
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,5 +0,0 @@
|
|||||||
.fitFullscreen {
|
|
||||||
position: relative;
|
|
||||||
width: 100%;
|
|
||||||
height: 100vh;
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,9 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(() => ({
|
||||||
|
fitFullscreen: {
|
||||||
|
position: 'relative',
|
||||||
|
width: '100%',
|
||||||
|
height: '100vh'
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,5 +0,0 @@
|
|||||||
.flexBox {
|
|
||||||
> * {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,9 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(() => ({
|
||||||
|
flexBox: {
|
||||||
|
'> *': {
|
||||||
|
flex: 1
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,10 +0,0 @@
|
|||||||
.fullscreenLoadingMask {
|
|
||||||
position: absolute;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
z-index: 100;
|
|
||||||
background-color: rgba(200, 200, 200, 0.2);
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,14 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
fullscreenLoadingMask: {
|
||||||
|
position: 'absolute',
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'center',
|
||||||
|
alignItems: 'center',
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
zIndex: 100,
|
||||||
|
backgroundColor: token.colorBgContainer
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,90 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
@import "@/assets/css/mixins";
|
|
||||||
|
|
||||||
.hideScrollbarMask {
|
|
||||||
position: relative;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
.hideScrollbarSelection {
|
|
||||||
position: relative;
|
|
||||||
overflow: scroll;
|
|
||||||
scrollbar-width: none;
|
|
||||||
-ms-overflow-style: none;
|
|
||||||
|
|
||||||
.hideScrollbarContent {
|
|
||||||
min-width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.scrollbar {
|
|
||||||
position: absolute;
|
|
||||||
z-index: 1000;
|
|
||||||
opacity: .5;
|
|
||||||
touch-action: none;
|
|
||||||
|
|
||||||
.box {
|
|
||||||
position: relative;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
border-radius: 8px;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
|
|
||||||
.block {
|
|
||||||
position: absolute;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
border-radius: 8px;
|
|
||||||
background-color: @font-secondary-color;
|
|
||||||
transition: background-color .2s;
|
|
||||||
}
|
|
||||||
|
|
||||||
:hover {
|
|
||||||
background-color: @font-main-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.hide {
|
|
||||||
display: block;
|
|
||||||
opacity: 0;
|
|
||||||
animation: 0.4s linear;
|
|
||||||
|
|
||||||
.keyframes(m7t06K, {
|
|
||||||
0% {
|
|
||||||
opacity: 0.5;
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.verticalScrollbar {
|
|
||||||
height: 100%;
|
|
||||||
left: 100%;
|
|
||||||
top: 0;
|
|
||||||
transform: translateX(-100%);
|
|
||||||
|
|
||||||
.box {
|
|
||||||
width: 6px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.horizontalScrollbar {
|
|
||||||
width: 100%;
|
|
||||||
left: 0;
|
|
||||||
top: 100%;
|
|
||||||
transform: translateY(-100%);
|
|
||||||
|
|
||||||
.box {
|
|
||||||
height: 8px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,84 @@
|
|||||||
|
import { createStyles, keyframes } from 'antd-style'
|
||||||
|
|
||||||
|
const fadeOut = keyframes`
|
||||||
|
0% {
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
export default createStyles(({ css, cx, token }) => {
|
||||||
|
const scrollbarBox = cx(css`
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: ${token.borderRadiusLG};
|
||||||
|
overflow: hidden;
|
||||||
|
`)
|
||||||
|
|
||||||
|
return {
|
||||||
|
hideScrollbarMask: {
|
||||||
|
position: 'relative',
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
overflow: 'hidden',
|
||||||
|
'::-webkit-scrollbar': {
|
||||||
|
display: 'none'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
hideScrollbarSelection: {
|
||||||
|
position: 'relative',
|
||||||
|
overflow: 'scroll',
|
||||||
|
scrollbarWidth: 'none',
|
||||||
|
msOverflowStyle: 'none'
|
||||||
|
},
|
||||||
|
hideScrollbarContent: {
|
||||||
|
minWidth: '100%'
|
||||||
|
},
|
||||||
|
scrollbar: {
|
||||||
|
position: 'absolute',
|
||||||
|
zIndex: 1000,
|
||||||
|
opacity: 0.5,
|
||||||
|
touchAction: 'none'
|
||||||
|
},
|
||||||
|
scrollbarBox,
|
||||||
|
scrollbarBoxBlock: {
|
||||||
|
position: 'absolute',
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
borderRadius: token.borderRadiusLG,
|
||||||
|
backgroundColor: token.colorTextSecondary,
|
||||||
|
transition: 'background-color 0.2s',
|
||||||
|
':hover': {
|
||||||
|
backgroundColor: token.colorTextLabel
|
||||||
|
}
|
||||||
|
},
|
||||||
|
verticalScrollbar: css`
|
||||||
|
height: 100%;
|
||||||
|
left: 100%;
|
||||||
|
top: 0;
|
||||||
|
transform: translateX(-100%);
|
||||||
|
|
||||||
|
.${scrollbarBox} {
|
||||||
|
width: ${token.sizeXXS}px;
|
||||||
|
}
|
||||||
|
`,
|
||||||
|
horizontalScrollbar: css`
|
||||||
|
width: 100%;
|
||||||
|
left: 0;
|
||||||
|
top: 100%;
|
||||||
|
transform: translateY(-100%);
|
||||||
|
|
||||||
|
.${scrollbarBox} {
|
||||||
|
height: ${token.sizeXXS}px;
|
||||||
|
}
|
||||||
|
`,
|
||||||
|
hide: {
|
||||||
|
display: 'block',
|
||||||
|
opacity: 0,
|
||||||
|
animation: `${fadeOut} 0.4s linear`
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
@@ -1,30 +0,0 @@
|
|||||||
@import '@/assets/css/constants';
|
|
||||||
|
|
||||||
.dotList {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
.item {
|
|
||||||
flex: auto;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
.dot {
|
|
||||||
width: 10px;
|
|
||||||
height: 10px;
|
|
||||||
border-radius: 50%;
|
|
||||||
border: 2px solid @font-secondary-color;
|
|
||||||
transition: all .2s;
|
|
||||||
}
|
|
||||||
|
|
||||||
:hover {
|
|
||||||
background-color: @focus-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.active > * {
|
|
||||||
background-color: @font-secondary-color !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,8 +0,0 @@
|
|||||||
.loadingMask {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
z-index: 100;
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,12 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(() => ({
|
||||||
|
loadingMask: {
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'center',
|
||||||
|
alignItems: 'center',
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
zIndex: 100
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,361 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
@import "@/assets/css/mixins";
|
|
||||||
|
|
||||||
.sidebar {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
height: 100%;
|
|
||||||
user-select: none;
|
|
||||||
transition: all .3s;
|
|
||||||
white-space: nowrap;
|
|
||||||
|
|
||||||
.title {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
font-weight: bold;
|
|
||||||
padding: 10px 14px;
|
|
||||||
color: @main-color;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
.iconBox {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
padding: 10px;
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
font-size: @SIZE_ICON_SM;
|
|
||||||
border-radius: 8px;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
span {
|
|
||||||
transform: rotateZ(180deg);
|
|
||||||
transition: all .3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: @background-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.text {
|
|
||||||
flex: 1;
|
|
||||||
font-size: 2em;
|
|
||||||
text-align: center;
|
|
||||||
letter-spacing: 0.2em;
|
|
||||||
transform: translateX(0.1em);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.content, .bottomFixed {
|
|
||||||
display: flex;
|
|
||||||
min-height: 0;
|
|
||||||
flex-direction: column;
|
|
||||||
flex: 1;
|
|
||||||
|
|
||||||
.scroll {
|
|
||||||
min-height: 0;
|
|
||||||
flex: 1;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul {
|
|
||||||
> li, > div > li {
|
|
||||||
padding: 2px 14px;
|
|
||||||
|
|
||||||
&.item {
|
|
||||||
position: relative;
|
|
||||||
font-size: 1rem;
|
|
||||||
|
|
||||||
> .menuBt {
|
|
||||||
border-radius: 8px;
|
|
||||||
overflow: hidden;
|
|
||||||
height: 40px;
|
|
||||||
|
|
||||||
.iconBox {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
padding: 0 10px;
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
font-size: @SIZE_ICON_SM;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
transition: all 0.2s;
|
|
||||||
background-color: @origin-color;
|
|
||||||
|
|
||||||
.text {
|
|
||||||
flex: 1;
|
|
||||||
padding-left: 8px;
|
|
||||||
width: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.active {
|
|
||||||
color: @origin-color;
|
|
||||||
background-color: @main-color;
|
|
||||||
|
|
||||||
img {
|
|
||||||
filter: drop-shadow(1000px 0 0 @origin-color);
|
|
||||||
transform: translate(-1000px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
> * {
|
|
||||||
background-color: @background-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.submenu {
|
|
||||||
visibility: hidden;
|
|
||||||
position: fixed;
|
|
||||||
padding-left: 10px;
|
|
||||||
z-index: 10000;
|
|
||||||
animation: 0.1s ease forwards;
|
|
||||||
.keyframes(XxrGiu, {
|
|
||||||
0% {
|
|
||||||
transform: translateX(0);
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
transform: translateX(-10px);
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
.content {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 2px;
|
|
||||||
padding: 10px 10px;
|
|
||||||
background-color: @origin-color;
|
|
||||||
border-radius: 8px;
|
|
||||||
box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.1);
|
|
||||||
|
|
||||||
.item {
|
|
||||||
border-radius: 8px;
|
|
||||||
white-space: nowrap;
|
|
||||||
overflow: hidden;
|
|
||||||
padding: 0;
|
|
||||||
|
|
||||||
a {
|
|
||||||
display: block;
|
|
||||||
padding: 8px 16px;
|
|
||||||
transition: all 0.2s;
|
|
||||||
|
|
||||||
.text {
|
|
||||||
width: unset;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.active {
|
|
||||||
color: @origin-color;
|
|
||||||
background-color: @main-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover a:not(.active) {
|
|
||||||
background-color: @background-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
> .menu-bt {
|
|
||||||
a:not(.active) {
|
|
||||||
background-color: @background-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.submenu {
|
|
||||||
visibility: visible;
|
|
||||||
animation: 0.3s ease;
|
|
||||||
.keyframes(f6yTZM, {
|
|
||||||
0% {
|
|
||||||
transform: translateX(-10px);
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
transform: translateX(0);
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
:global .delete {
|
|
||||||
:local .menuBt {
|
|
||||||
border: 1px dashed @error-secondary-color;
|
|
||||||
filter: drop-shadow(1000px 0 0 @error-secondary-color);
|
|
||||||
transform: translate(-1000px);
|
|
||||||
|
|
||||||
> a {
|
|
||||||
background-color: transparent !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.separate {
|
|
||||||
height: 0;
|
|
||||||
margin: 10px 5px;
|
|
||||||
border: 1px solid @font-secondary-color;
|
|
||||||
opacity: 0.4;
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
font-weight: bold;
|
|
||||||
padding: 8px 14px;
|
|
||||||
color: @main-color;
|
|
||||||
|
|
||||||
.iconUser {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
flex: 0 0 auto;
|
|
||||||
margin-left: 4px;
|
|
||||||
width: 36px;
|
|
||||||
height: 36px;
|
|
||||||
font-size: @SIZE_ICON_XS;
|
|
||||||
border: 2px @font-secondary-color solid;
|
|
||||||
color: @font-secondary-color;
|
|
||||||
border-radius: 50%;
|
|
||||||
overflow: hidden;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.text {
|
|
||||||
flex: 1;
|
|
||||||
padding-left: 10px;
|
|
||||||
font-size: 1.4em;
|
|
||||||
color: @font-main-color;
|
|
||||||
user-select: text;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: @main-color;
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.iconExit {
|
|
||||||
font-size: @SIZE_ICON_XS;
|
|
||||||
color: @error-color;
|
|
||||||
padding: 6px 10px;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
border-radius: 8px;
|
|
||||||
background-color: @background-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.hide {
|
|
||||||
width: 68px !important;
|
|
||||||
|
|
||||||
.title {
|
|
||||||
.iconBox {
|
|
||||||
span {
|
|
||||||
transform: rotateZ(360deg);
|
|
||||||
transition: all .3s;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.text {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.menuBt {
|
|
||||||
.text, .extend {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.submenu {
|
|
||||||
.menuBt {
|
|
||||||
.text {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer {
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
.text {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.submenuExit {
|
|
||||||
display: none;
|
|
||||||
position: absolute;
|
|
||||||
padding-left: 6px;
|
|
||||||
left: 100%;
|
|
||||||
z-index: 1000;
|
|
||||||
box-shadow: 5px 5px 15px 0 rgba(0, 0, 0, 0.1);
|
|
||||||
|
|
||||||
.content {
|
|
||||||
padding: 8px;
|
|
||||||
border-radius: 8px;
|
|
||||||
background-color: @origin-color;
|
|
||||||
|
|
||||||
.iconExit {
|
|
||||||
padding: 4px 8px;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
border-radius: 8px;
|
|
||||||
background-color: @background-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.hide {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover .submenuExit {
|
|
||||||
display: block;
|
|
||||||
animation: 0.3s ease;
|
|
||||||
.keyframes(mfdCZC, {
|
|
||||||
0% {
|
|
||||||
transform: translateX(-10px);
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
transform: translateX(0);
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,110 @@
|
|||||||
|
import { createStyles, keyframes } from 'antd-style'
|
||||||
|
|
||||||
|
const slideIn = keyframes`
|
||||||
|
0% {
|
||||||
|
transform: translateX(-10px);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: translateX(0);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
export default createStyles(({ cx, css, token }) => {
|
||||||
|
const collapsedExit = cx(css`
|
||||||
|
display: none;
|
||||||
|
position: absolute;
|
||||||
|
padding-left: ${token.paddingXS}px;
|
||||||
|
left: 100%;
|
||||||
|
z-index: 1000;
|
||||||
|
box-shadow: 5px 5px 15px 0 ${token.colorBorder};
|
||||||
|
`)
|
||||||
|
|
||||||
|
return {
|
||||||
|
footer: css`
|
||||||
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
align-items: center;
|
||||||
|
font-weight: bold;
|
||||||
|
padding: ${token.paddingXS}px ${token.paddingSM}px;
|
||||||
|
color: ${token.colorPrimary};
|
||||||
|
|
||||||
|
&:hover .${collapsedExit} {
|
||||||
|
display: block;
|
||||||
|
animation: ${slideIn} 0.3s ease;
|
||||||
|
}
|
||||||
|
`,
|
||||||
|
|
||||||
|
icon: {
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'center',
|
||||||
|
alignItems: 'center',
|
||||||
|
flex: '0 0 auto',
|
||||||
|
marginLeft: token.marginXXS,
|
||||||
|
width: token.sizeXL,
|
||||||
|
height: token.sizeXL,
|
||||||
|
fontSize: token.sizeMS,
|
||||||
|
border: `2px ${token.colorBorder} solid`,
|
||||||
|
color: token.colorBorder,
|
||||||
|
borderRadius: '50%',
|
||||||
|
overflow: 'hidden',
|
||||||
|
cursor: 'pointer',
|
||||||
|
|
||||||
|
img: {
|
||||||
|
width: '100%',
|
||||||
|
height: '100%'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
text: {
|
||||||
|
flex: 1,
|
||||||
|
paddingLeft: token.paddingXS,
|
||||||
|
fontSize: token.fontSizeLG,
|
||||||
|
color: token.colorTextLabel,
|
||||||
|
userSelect: 'text',
|
||||||
|
overflow: 'hidden',
|
||||||
|
textOverflow: 'ellipsis',
|
||||||
|
a: {
|
||||||
|
color: token.colorPrimary,
|
||||||
|
textDecoration: 'underline'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
collapsedText: {
|
||||||
|
display: 'none'
|
||||||
|
},
|
||||||
|
|
||||||
|
collapsedExit,
|
||||||
|
|
||||||
|
hide: {
|
||||||
|
display: 'none !important'
|
||||||
|
},
|
||||||
|
|
||||||
|
exitContent: {
|
||||||
|
display: 'flex',
|
||||||
|
backgroundColor: token.colorBgContainer
|
||||||
|
},
|
||||||
|
|
||||||
|
collapsedExitContent: {
|
||||||
|
padding: token.paddingXS,
|
||||||
|
borderRadius: token.borderRadiusLG
|
||||||
|
},
|
||||||
|
|
||||||
|
exitIcon: {
|
||||||
|
fontSize: token.sizeMS,
|
||||||
|
color: token.colorError,
|
||||||
|
padding: `${token.paddingXXS}px ${token.paddingXS}px`,
|
||||||
|
cursor: 'pointer',
|
||||||
|
|
||||||
|
'&:hover': {
|
||||||
|
borderRadius: token.borderRadiusLG,
|
||||||
|
backgroundColor: token.colorBgLayout
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
collapsedExitIcon: {
|
||||||
|
padding: `${token.paddingXXS}px ${token.paddingXS}px`
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
@@ -0,0 +1,85 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ cx, css, token }) => {
|
||||||
|
const title = cx(css`
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-weight: bold;
|
||||||
|
padding: ${token.paddingXS}px ${token.paddingSM}px;
|
||||||
|
color: ${token.colorPrimary};
|
||||||
|
overflow: hidden;
|
||||||
|
`)
|
||||||
|
|
||||||
|
const titleIcon = cx(css`
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
padding: ${token.paddingXS}px;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
font-size: ${token.sizeMD}px;
|
||||||
|
border-radius: ${token.borderRadiusLG}px;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
span {
|
||||||
|
transform: rotateZ(180deg);
|
||||||
|
transition: all 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: ${token.colorBgLayout};
|
||||||
|
}
|
||||||
|
`)
|
||||||
|
|
||||||
|
const titleText = cx(css`
|
||||||
|
flex: 1;
|
||||||
|
font-size: ${token.fontSizeHeading3}px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: ${token.sizeXS}px;
|
||||||
|
`)
|
||||||
|
|
||||||
|
return {
|
||||||
|
sidebar: {
|
||||||
|
display: 'flex',
|
||||||
|
flexDirection: 'column',
|
||||||
|
height: '100%',
|
||||||
|
userSelect: 'none',
|
||||||
|
transition: 'all .3s',
|
||||||
|
whiteSpace: 'nowrap'
|
||||||
|
},
|
||||||
|
|
||||||
|
title,
|
||||||
|
|
||||||
|
titleIcon,
|
||||||
|
|
||||||
|
titleText,
|
||||||
|
|
||||||
|
content: {
|
||||||
|
display: 'flex',
|
||||||
|
minHeight: 0,
|
||||||
|
flexDirection: 'column',
|
||||||
|
flex: 1,
|
||||||
|
|
||||||
|
'ul > li, ul > div > li': {
|
||||||
|
padding: `${token.paddingXXS}px ${token.paddingSM}px`
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
collapse: cx(css`
|
||||||
|
width: ${token.sizeXL * 2}px !important;
|
||||||
|
|
||||||
|
.${title} {
|
||||||
|
.${titleIcon} {
|
||||||
|
span {
|
||||||
|
transform: rotateZ(360deg);
|
||||||
|
transition: all 0.3s;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.${titleText} {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`)
|
||||||
|
}
|
||||||
|
})
|
||||||
@@ -0,0 +1,83 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ cx, css, token }) => {
|
||||||
|
const menuBt = cx(css`
|
||||||
|
border-radius: ${token.borderRadiusLG}px;
|
||||||
|
overflow: hidden;
|
||||||
|
height: 40px;
|
||||||
|
|
||||||
|
a {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
transition: all 0.2s;
|
||||||
|
background-color: ${token.colorBgContainer};
|
||||||
|
}
|
||||||
|
`)
|
||||||
|
|
||||||
|
const active = cx(css`
|
||||||
|
color: ${token.colorTextLightSolid};
|
||||||
|
background-color: ${token.colorPrimary} !important;
|
||||||
|
`)
|
||||||
|
|
||||||
|
return {
|
||||||
|
item: css`
|
||||||
|
position: relative;
|
||||||
|
font-size: ${token.fontSizeHeading5}px;
|
||||||
|
|
||||||
|
&:hover > div > a:not(.${active}),
|
||||||
|
&:hover > a:not(.${active}) {
|
||||||
|
background-color: ${token.colorBgLayout};
|
||||||
|
}
|
||||||
|
`,
|
||||||
|
|
||||||
|
submenuItem: css`
|
||||||
|
border-radius: ${token.borderRadiusLG}px;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 0 !important;
|
||||||
|
|
||||||
|
a {
|
||||||
|
display: block;
|
||||||
|
padding: ${token.paddingXS}px ${token.paddingMD}px;
|
||||||
|
transition: all 0.2s;
|
||||||
|
}
|
||||||
|
`,
|
||||||
|
|
||||||
|
menuBt,
|
||||||
|
|
||||||
|
active,
|
||||||
|
|
||||||
|
icon: {
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'center',
|
||||||
|
alignItems: 'center',
|
||||||
|
padding: `0 ${token.paddingXS}px`,
|
||||||
|
width: 40,
|
||||||
|
height: 40,
|
||||||
|
fontSize: token.sizeMD,
|
||||||
|
cursor: 'pointer',
|
||||||
|
|
||||||
|
img: {
|
||||||
|
width: '100%'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
text: {
|
||||||
|
flex: 1,
|
||||||
|
paddingLeft: token.paddingXS,
|
||||||
|
width: 0,
|
||||||
|
overflow: 'hidden',
|
||||||
|
textOverflow: 'ellipsis'
|
||||||
|
},
|
||||||
|
|
||||||
|
collapsedText: {
|
||||||
|
display: 'none'
|
||||||
|
},
|
||||||
|
|
||||||
|
collapsedExtend: {
|
||||||
|
display: 'none'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
@@ -0,0 +1,9 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(() => ({
|
||||||
|
scroll: {
|
||||||
|
minHeight: 0,
|
||||||
|
flex: 1,
|
||||||
|
width: '100%'
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -0,0 +1,9 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
separate: {
|
||||||
|
height: 0,
|
||||||
|
margin: `${token.marginSM}px ${token.marginXS}px`,
|
||||||
|
border: `1px solid ${token.colorBorder}`
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -0,0 +1,50 @@
|
|||||||
|
import { createStyles, keyframes } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => {
|
||||||
|
const slideIn = keyframes`
|
||||||
|
0% {
|
||||||
|
transform: translateX(-${token.sizeSM}px);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: translateX(0);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const slideOut = keyframes`
|
||||||
|
0% {
|
||||||
|
transform: translateX(0);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: translateX(-${token.sizeSM}px);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
return {
|
||||||
|
submenu: {
|
||||||
|
visibility: 'hidden',
|
||||||
|
position: 'fixed',
|
||||||
|
paddingLeft: token.paddingXS,
|
||||||
|
zIndex: 10000,
|
||||||
|
animation: `${slideOut} 0.1s ease forwards`
|
||||||
|
},
|
||||||
|
|
||||||
|
hoveredSubmenu: {
|
||||||
|
visibility: 'visible',
|
||||||
|
animation: `${slideIn} 0.3s ease`
|
||||||
|
},
|
||||||
|
|
||||||
|
content: {
|
||||||
|
display: 'flex',
|
||||||
|
flexDirection: 'column',
|
||||||
|
gap: token.sizeXXS,
|
||||||
|
padding: token.paddingSM,
|
||||||
|
backgroundColor: token.colorBgContainer,
|
||||||
|
borderRadius: token.borderRadiusLG,
|
||||||
|
boxShadow: token.boxShadow
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
@@ -1,28 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
.urlCard {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
margin-top: 80px;
|
|
||||||
text-align: center;
|
|
||||||
gap: 42px;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
color: @production-color;
|
|
||||||
font-size: @SIZE_ICON_XL;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text {
|
|
||||||
font-weight: bolder;
|
|
||||||
font-size: 2em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,24 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
root: {
|
||||||
|
width: 180,
|
||||||
|
height: 290,
|
||||||
|
textAlign: 'center',
|
||||||
|
gap: token.sizeXXL,
|
||||||
|
cursor: 'pointer',
|
||||||
|
'> *': {
|
||||||
|
flex: '0 0 auto',
|
||||||
|
display: 'block'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
icon: {
|
||||||
|
marginTop: 80,
|
||||||
|
color: token.colorPrimary,
|
||||||
|
fontSize: token.sizeXXL
|
||||||
|
},
|
||||||
|
text: {
|
||||||
|
fontWeight: 'bolder',
|
||||||
|
fontSize: token.fontSizeXL
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,5 +0,0 @@
|
|||||||
.root {
|
|
||||||
background-color: transparent;
|
|
||||||
color: unset;
|
|
||||||
cursor: grab;
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,9 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(() => ({
|
||||||
|
root: {
|
||||||
|
backgroundColor: 'transparent',
|
||||||
|
color: 'unset',
|
||||||
|
cursor: 'grab'
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,22 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
padding: 0 10px 10px;
|
|
||||||
background-color: @origin-color;
|
|
||||||
|
|
||||||
.dropMaskBorder {
|
|
||||||
display: flex;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
border: 2px dashed @font-secondary-color;
|
|
||||||
border-radius: 8px;
|
|
||||||
font-size: 1.8em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,24 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
root: {
|
||||||
|
position: 'absolute',
|
||||||
|
left: 0,
|
||||||
|
top: 0,
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
padding: `0 ${token.paddingSM}px ${token.paddingSM}px`,
|
||||||
|
backgroundColor: token.colorBgContainer
|
||||||
|
},
|
||||||
|
|
||||||
|
dropMaskBorder: {
|
||||||
|
display: 'flex',
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
justifyContent: 'center',
|
||||||
|
alignItems: 'center',
|
||||||
|
border: `2px dashed ${token.colorBorder}`,
|
||||||
|
borderRadius: token.borderRadiusLG,
|
||||||
|
fontSize: token.fontSizeHeading3
|
||||||
|
}
|
||||||
|
}))
|
||||||
15
src/renderer/src/assets/css/components/dnd/sortable.style.ts
Normal file
15
src/renderer/src/assets/css/components/dnd/sortable.style.ts
Normal file
@@ -0,0 +1,15 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
delete: {
|
||||||
|
'.dnd-delete-mask': {
|
||||||
|
border: `1px dashed ${token.colorErrorHover}`,
|
||||||
|
filter: `drop-shadow(1000px 0 0 ${token.colorErrorHover})`,
|
||||||
|
transform: 'translate(-1000px)',
|
||||||
|
|
||||||
|
'> a': {
|
||||||
|
backgroundColor: 'transparent !important'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,33 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
.settingsCard {
|
|
||||||
padding: 20px;
|
|
||||||
gap: 20px;
|
|
||||||
color: @main-color;
|
|
||||||
|
|
||||||
> .head {
|
|
||||||
align-items: center;
|
|
||||||
gap: 5px;
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
font-size: @SIZE_ICON_MD;
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.title {
|
|
||||||
display: flex;
|
|
||||||
font-size: 1.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
:nth-child(n+3) {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
color: @font-main-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btSave {
|
|
||||||
color: @main-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,32 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
root: {
|
||||||
|
padding: token.paddingLG,
|
||||||
|
gap: token.paddingLG,
|
||||||
|
color: token.colorPrimary
|
||||||
|
},
|
||||||
|
|
||||||
|
head: {
|
||||||
|
alignItems: 'center',
|
||||||
|
gap: token.sizeXXS,
|
||||||
|
|
||||||
|
'>:nth-child(n+3)': {
|
||||||
|
flex: '0 0 auto'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
icon: {
|
||||||
|
fontSize: token.sizeLG,
|
||||||
|
flex: '0 0 auto'
|
||||||
|
},
|
||||||
|
|
||||||
|
title: {
|
||||||
|
display: 'flex',
|
||||||
|
fontSize: token.fontSize
|
||||||
|
},
|
||||||
|
|
||||||
|
btSave: {
|
||||||
|
color: token.colorPrimary
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,78 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
.statisticsCard {
|
|
||||||
padding: 20px;
|
|
||||||
gap: 20px;
|
|
||||||
|
|
||||||
> .head {
|
|
||||||
align-items: center;
|
|
||||||
gap: 5px;
|
|
||||||
color: @main-color;
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
font-size: @SIZE_ICON_MD;
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.title {
|
|
||||||
display: flex;
|
|
||||||
font-size: 1.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
:nth-child(n+3) {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
color: @font-main-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
:global .card-content {
|
|
||||||
font-size: 1.1em;
|
|
||||||
padding: 0 10px;
|
|
||||||
gap: 10px;
|
|
||||||
|
|
||||||
.key, .value-percent {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
color: @font-main-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.value {
|
|
||||||
color: @font-secondary-color;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
white-space: nowrap;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.value-chart {
|
|
||||||
justify-content: space-around;
|
|
||||||
width: 0;
|
|
||||||
|
|
||||||
> div {
|
|
||||||
max-height: 12px;
|
|
||||||
height: 12px;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
transform: translateY(1px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.value-percent {
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
.big-chart {
|
|
||||||
width: 0;
|
|
||||||
height: 400px;
|
|
||||||
}
|
|
||||||
|
|
||||||
> * {
|
|
||||||
gap: 5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,28 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
root: {
|
||||||
|
padding: token.paddingLG,
|
||||||
|
gap: token.paddingLG
|
||||||
|
},
|
||||||
|
|
||||||
|
head: {
|
||||||
|
alignItems: 'center',
|
||||||
|
gap: token.sizeXXS,
|
||||||
|
color: token.colorPrimary,
|
||||||
|
|
||||||
|
'>:nth-child(n+3)': {
|
||||||
|
flex: '0 0 auto'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
icon: {
|
||||||
|
fontSize: token.sizeLG,
|
||||||
|
flex: '0 0 auto'
|
||||||
|
},
|
||||||
|
|
||||||
|
title: {
|
||||||
|
display: 'flex',
|
||||||
|
fontSize: token.fontSize
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,27 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
.loadMoreCard {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
text-align: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
display: flex;
|
|
||||||
font-size: @SIZE_ICON_XXL;
|
|
||||||
color: @production-color;
|
|
||||||
align-items: center;
|
|
||||||
transform: translateY(-20px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.text {
|
|
||||||
position: absolute;
|
|
||||||
top: 60%;
|
|
||||||
font-size: 1.2em;
|
|
||||||
font-weight: bolder;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,26 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
root: {
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
textAlign: 'center',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
cursor: 'pointer',
|
||||||
|
|
||||||
|
'>*': {
|
||||||
|
flex: '0 0 auto'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
icon: {
|
||||||
|
fontSize: token.sizeXXL,
|
||||||
|
color: token.colorPrimary
|
||||||
|
},
|
||||||
|
|
||||||
|
text: {
|
||||||
|
fontSize: token.fontSizeXL,
|
||||||
|
fontWeight: 'bolder'
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,112 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
height: 100%;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
.localCard {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
text-align: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
display: block;
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header {
|
|
||||||
display: flex;
|
|
||||||
width: 100%;
|
|
||||||
padding: 10px;
|
|
||||||
justify-content: space-between;
|
|
||||||
|
|
||||||
.version {
|
|
||||||
width: 0;
|
|
||||||
transition: all 0.2s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.operation {
|
|
||||||
display: flex;
|
|
||||||
font-size: 1.6em;
|
|
||||||
gap: 4px;
|
|
||||||
opacity: 0;
|
|
||||||
transition: all 0.2s;
|
|
||||||
|
|
||||||
> *:hover {
|
|
||||||
color: @font-secondary-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
display: flex;
|
|
||||||
padding-top: 10px;
|
|
||||||
padding-bottom: 20px;
|
|
||||||
color: @production-color;
|
|
||||||
font-size: @SIZE_ICON_XL;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: @SIZE_ICON_XL;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.info {
|
|
||||||
padding-top: 20px;
|
|
||||||
|
|
||||||
.toolName {
|
|
||||||
font-weight: bolder;
|
|
||||||
font-size: 1.6em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.toolDesc {
|
|
||||||
margin: 10px auto 0;
|
|
||||||
color: @font-secondary-color;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
max-height: 40px;
|
|
||||||
width: 80%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.author {
|
|
||||||
display: flex;
|
|
||||||
margin-top: auto;
|
|
||||||
flex-direction: row;
|
|
||||||
justify-content: end;
|
|
||||||
padding-bottom: 10px;
|
|
||||||
gap: 10px;
|
|
||||||
|
|
||||||
.avatar {
|
|
||||||
> * {
|
|
||||||
width: 24px;
|
|
||||||
height: 24px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.authorName {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
:hover {
|
|
||||||
.header {
|
|
||||||
.version {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.operation {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.androidQrcode {
|
|
||||||
align-items: center;
|
|
||||||
transform: translateX(-16px);
|
|
||||||
gap: 20px;
|
|
||||||
}
|
|
||||||
110
src/renderer/src/assets/css/components/tools/local-card.style.ts
Normal file
110
src/renderer/src/assets/css/components/tools/local-card.style.ts
Normal file
@@ -0,0 +1,110 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ cx, css, token }) => {
|
||||||
|
const version = cx(css`
|
||||||
|
width: 0;
|
||||||
|
transition: all 0.2s;
|
||||||
|
`)
|
||||||
|
|
||||||
|
const operation = cx(css`
|
||||||
|
display: flex;
|
||||||
|
font-size: 1.6em;
|
||||||
|
gap: ${token.sizeXXS}px;
|
||||||
|
opacity: 0;
|
||||||
|
transition: all 0.2s;
|
||||||
|
z-index: 100;
|
||||||
|
|
||||||
|
> *:hover {
|
||||||
|
color: ${token.colorIconHover};
|
||||||
|
}
|
||||||
|
`)
|
||||||
|
|
||||||
|
return {
|
||||||
|
root: css`
|
||||||
|
width: 180px;
|
||||||
|
height: 290px;
|
||||||
|
text-align: center;
|
||||||
|
gap: ${token.sizeSM}px;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
> * {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
.${version} {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.${operation} {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`,
|
||||||
|
|
||||||
|
header: {
|
||||||
|
display: 'flex',
|
||||||
|
width: '100%',
|
||||||
|
padding: token.paddingSM,
|
||||||
|
justifyContent: 'space-between'
|
||||||
|
},
|
||||||
|
|
||||||
|
version,
|
||||||
|
|
||||||
|
operation,
|
||||||
|
|
||||||
|
icon: {
|
||||||
|
img: {
|
||||||
|
width: token.sizeXL * 2
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
info: {
|
||||||
|
padding: `0 ${token.paddingSM}px`
|
||||||
|
},
|
||||||
|
|
||||||
|
toolName: {
|
||||||
|
fontSize: token.fontSizeXL,
|
||||||
|
fontWeight: 'bolder',
|
||||||
|
overflow: 'hidden',
|
||||||
|
textOverflow: 'ellipsis',
|
||||||
|
whiteSpace: 'nowrap'
|
||||||
|
},
|
||||||
|
|
||||||
|
toolDesc: {
|
||||||
|
marginTop: token.marginXS,
|
||||||
|
color: token.colorTextDescription
|
||||||
|
},
|
||||||
|
|
||||||
|
author: {
|
||||||
|
display: 'flex',
|
||||||
|
marginTop: 'auto',
|
||||||
|
paddingBottom: token.paddingSM,
|
||||||
|
flexDirection: 'row',
|
||||||
|
justifyContent: 'center',
|
||||||
|
gap: token.sizeXS,
|
||||||
|
|
||||||
|
'&:hover': {
|
||||||
|
color: token.colorPrimary
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
avatar: {
|
||||||
|
'> *': {
|
||||||
|
width: token.sizeLG,
|
||||||
|
height: token.sizeLG
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
authorName: {
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center'
|
||||||
|
},
|
||||||
|
|
||||||
|
androidQrcode: {
|
||||||
|
alignItems: 'center',
|
||||||
|
transform: 'translateX(-16px)',
|
||||||
|
gap: token.sizeMD
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
@@ -1,94 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
height: 100%;
|
|
||||||
|
|
||||||
.repositoryCard {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
text-align: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
display: block;
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header {
|
|
||||||
display: flex;
|
|
||||||
width: 100%;
|
|
||||||
align-items: center;
|
|
||||||
padding: 10px;
|
|
||||||
|
|
||||||
:global .version-select {
|
|
||||||
width: 9em;
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
>:not(:global .version-select) {
|
|
||||||
font-size: 1.6em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
display: flex;
|
|
||||||
padding-top: 10px;
|
|
||||||
padding-bottom: 20px;
|
|
||||||
color: @production-color;
|
|
||||||
font-size: @SIZE_ICON_XL;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: @SIZE_ICON_XL;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.info {
|
|
||||||
transform: translateY(40px);
|
|
||||||
transition: all 0.1s ease;
|
|
||||||
|
|
||||||
.toolName {
|
|
||||||
font-weight: bolder;
|
|
||||||
font-size: 1.6em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
.info {
|
|
||||||
transform: translateY(-10px);
|
|
||||||
transition: all 0.2s ease;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.operation {
|
|
||||||
display: flex;
|
|
||||||
flex: 1;
|
|
||||||
justify-content: center;
|
|
||||||
padding-bottom: 20px;
|
|
||||||
gap: 4px;
|
|
||||||
width: 70%;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
visibility: hidden;
|
|
||||||
opacity: 0;
|
|
||||||
|
|
||||||
> *, .edit > * {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.edit {
|
|
||||||
> * {
|
|
||||||
> :first-child {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover .operation {
|
|
||||||
visibility: visible;
|
|
||||||
opacity: 1;
|
|
||||||
transition: all 0.4s ease;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,108 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ cx, css, token }) => {
|
||||||
|
const info = cx(css`
|
||||||
|
padding: 0 ${token.paddingSM}px;
|
||||||
|
transform: translateY(${token.sizeXL}px);
|
||||||
|
transition: all 0.1s ease;
|
||||||
|
`)
|
||||||
|
|
||||||
|
const edit = cx(css`
|
||||||
|
> * {
|
||||||
|
> :first-child {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`)
|
||||||
|
|
||||||
|
const toolDesc = cx(css`
|
||||||
|
position: relative;
|
||||||
|
margin-top: ${token.marginXS}px;
|
||||||
|
color: ${token.colorTextDescription};
|
||||||
|
transition: all 0.1s ease;
|
||||||
|
`)
|
||||||
|
|
||||||
|
const operation = cx(css`
|
||||||
|
display: flex;
|
||||||
|
position: absolute;
|
||||||
|
flex: 1;
|
||||||
|
gap: ${token.sizeXXS}px;
|
||||||
|
bottom: ${token.sizeLG}px;
|
||||||
|
padding: 0 ${token.paddingLG}px;
|
||||||
|
width: 100%;
|
||||||
|
flex-direction: column;
|
||||||
|
opacity: 0;
|
||||||
|
|
||||||
|
> *,
|
||||||
|
.${edit} > * {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
`)
|
||||||
|
|
||||||
|
return {
|
||||||
|
root: css`
|
||||||
|
width: 180px;
|
||||||
|
height: 290px;
|
||||||
|
text-align: center;
|
||||||
|
gap: ${token.sizeSM}px;
|
||||||
|
|
||||||
|
> * {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
.${info} {
|
||||||
|
transform: translateY(-${token.sizeXXS}px);
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.${toolDesc} {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.${operation} {
|
||||||
|
opacity: 1;
|
||||||
|
transition: all 0.4s ease;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`,
|
||||||
|
|
||||||
|
header: {
|
||||||
|
display: 'flex',
|
||||||
|
width: '100%',
|
||||||
|
padding: token.paddingSM,
|
||||||
|
gap: token.paddingXS,
|
||||||
|
|
||||||
|
'> :first-child': {
|
||||||
|
width: 0,
|
||||||
|
flex: 1
|
||||||
|
},
|
||||||
|
|
||||||
|
'> :not(:first-child)': {
|
||||||
|
fontSize: token.size
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
icon: {
|
||||||
|
img: {
|
||||||
|
width: token.sizeXL * 2
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
info,
|
||||||
|
|
||||||
|
toolName: {
|
||||||
|
fontSize: token.fontSizeXL,
|
||||||
|
fontWeight: 'bolder',
|
||||||
|
overflow: 'hidden',
|
||||||
|
textOverflow: 'ellipsis',
|
||||||
|
whiteSpace: 'nowrap'
|
||||||
|
},
|
||||||
|
|
||||||
|
toolDesc,
|
||||||
|
|
||||||
|
operation,
|
||||||
|
|
||||||
|
edit
|
||||||
|
}
|
||||||
|
})
|
||||||
@@ -1,114 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
height: 100%;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
.storeCard {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
text-align: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
display: block;
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header {
|
|
||||||
display: flex;
|
|
||||||
width: 100%;
|
|
||||||
padding: 10px;
|
|
||||||
justify-content: space-between;
|
|
||||||
|
|
||||||
.version {
|
|
||||||
width: 0;
|
|
||||||
transition: all 0.2s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.operation {
|
|
||||||
display: flex;
|
|
||||||
font-size: 1.6em;
|
|
||||||
gap: 4px;
|
|
||||||
opacity: 0;
|
|
||||||
transition: all 0.2s;
|
|
||||||
z-index: 100;
|
|
||||||
|
|
||||||
> *:hover {
|
|
||||||
color: @font-secondary-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
display: flex;
|
|
||||||
padding-top: 10px;
|
|
||||||
padding-bottom: 20px;
|
|
||||||
color: @production-color;
|
|
||||||
font-size: @SIZE_ICON_XL;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: @SIZE_ICON_XL;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.info {
|
|
||||||
padding-top: 20px;
|
|
||||||
|
|
||||||
.toolName {
|
|
||||||
font-weight: bolder;
|
|
||||||
font-size: 1.6em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.toolDesc {
|
|
||||||
margin: 10px auto 0;
|
|
||||||
color: @font-secondary-color;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
max-height: 40px;
|
|
||||||
width: 80%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.author {
|
|
||||||
display: flex;
|
|
||||||
margin-top: auto;
|
|
||||||
padding-top: 8px;
|
|
||||||
flex-direction: row;
|
|
||||||
justify-content: end;
|
|
||||||
padding-bottom: 10px;
|
|
||||||
gap: 10px;
|
|
||||||
|
|
||||||
.avatar {
|
|
||||||
> * {
|
|
||||||
width: 24px;
|
|
||||||
height: 24px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.authorName {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
:hover {
|
|
||||||
.header {
|
|
||||||
.version {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.operation {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.androidQrcode {
|
|
||||||
align-items: center;
|
|
||||||
transform: translateX(-16px);
|
|
||||||
gap: 20px;
|
|
||||||
}
|
|
||||||
110
src/renderer/src/assets/css/components/tools/store-card.style.ts
Normal file
110
src/renderer/src/assets/css/components/tools/store-card.style.ts
Normal file
@@ -0,0 +1,110 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ cx, css, token }) => {
|
||||||
|
const version = cx(css`
|
||||||
|
width: 0;
|
||||||
|
transition: all 0.2s;
|
||||||
|
`)
|
||||||
|
|
||||||
|
const operation = cx(css`
|
||||||
|
display: flex;
|
||||||
|
font-size: 1.6em;
|
||||||
|
gap: ${token.sizeXXS}px;
|
||||||
|
opacity: 0;
|
||||||
|
transition: all 0.2s;
|
||||||
|
z-index: 100;
|
||||||
|
|
||||||
|
> *:hover {
|
||||||
|
color: ${token.colorIconHover};
|
||||||
|
}
|
||||||
|
`)
|
||||||
|
|
||||||
|
return {
|
||||||
|
root: css`
|
||||||
|
width: 180px;
|
||||||
|
height: 290px;
|
||||||
|
text-align: center;
|
||||||
|
gap: ${token.sizeSM}px;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
> * {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
.${version} {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.${operation} {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`,
|
||||||
|
|
||||||
|
header: {
|
||||||
|
display: 'flex',
|
||||||
|
width: '100%',
|
||||||
|
padding: token.paddingSM,
|
||||||
|
justifyContent: 'space-between'
|
||||||
|
},
|
||||||
|
|
||||||
|
version,
|
||||||
|
|
||||||
|
operation,
|
||||||
|
|
||||||
|
icon: {
|
||||||
|
img: {
|
||||||
|
width: token.sizeXL * 2
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
info: {
|
||||||
|
padding: `0 ${token.paddingSM}px`
|
||||||
|
},
|
||||||
|
|
||||||
|
toolName: {
|
||||||
|
fontSize: token.fontSizeXL,
|
||||||
|
fontWeight: 'bolder',
|
||||||
|
overflow: 'hidden',
|
||||||
|
textOverflow: 'ellipsis',
|
||||||
|
whiteSpace: 'nowrap'
|
||||||
|
},
|
||||||
|
|
||||||
|
toolDesc: {
|
||||||
|
marginTop: token.marginXS,
|
||||||
|
color: token.colorTextDescription
|
||||||
|
},
|
||||||
|
|
||||||
|
author: {
|
||||||
|
display: 'flex',
|
||||||
|
marginTop: 'auto',
|
||||||
|
paddingBottom: token.paddingSM,
|
||||||
|
flexDirection: 'row',
|
||||||
|
justifyContent: 'center',
|
||||||
|
gap: token.sizeXS,
|
||||||
|
|
||||||
|
'&:hover': {
|
||||||
|
color: token.colorPrimary
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
avatar: {
|
||||||
|
'> *': {
|
||||||
|
width: token.sizeLG,
|
||||||
|
height: token.sizeLG
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
authorName: {
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center'
|
||||||
|
},
|
||||||
|
|
||||||
|
androidQrcode: {
|
||||||
|
alignItems: 'center',
|
||||||
|
transform: 'translateX(-16px)',
|
||||||
|
gap: token.sizeMD
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
@@ -1,22 +0,0 @@
|
|||||||
@origin-color: white;
|
|
||||||
@production-color: #4E47BB;
|
|
||||||
@main-color: @production-color;
|
|
||||||
@secondary-color: #BAB8E5;
|
|
||||||
@error-color: #FF4D4F;
|
|
||||||
@error-secondary-color: #FF7875;
|
|
||||||
@blue-color: #1677FF;
|
|
||||||
@active-color: #EBECFD;
|
|
||||||
@background-color: #F5F5F5;
|
|
||||||
@font-main-color: #4D4D4D;
|
|
||||||
@font-secondary-color: #9E9E9E;
|
|
||||||
@focus-color: #DDDDDD;
|
|
||||||
@divide-color: rgba(204, 204, 204, 0.66);
|
|
||||||
@border-color: rgba(204, 204, 204, 0.33);
|
|
||||||
@url-color: rgba(102, 102, 102, .8);
|
|
||||||
@url-active-color: #ccc;
|
|
||||||
@SIZE_ICON_XS: 16px;
|
|
||||||
@SIZE_ICON_SM: 20px;
|
|
||||||
@SIZE_ICON_MD: 24px;
|
|
||||||
@SIZE_ICON_LG: 32px;
|
|
||||||
@SIZE_ICON_XL: 64px;
|
|
||||||
@SIZE_ICON_XXL: 96px;
|
|
||||||
@@ -1,15 +0,0 @@
|
|||||||
.keyframes(@animationName, @content) {
|
|
||||||
animation-name: @animationName;
|
|
||||||
@-webkit-keyframes @animationName {
|
|
||||||
@content();
|
|
||||||
}
|
|
||||||
@-moz-keyframes @animationName {
|
|
||||||
@content();
|
|
||||||
}
|
|
||||||
@-o-keyframes @animationName {
|
|
||||||
@content();
|
|
||||||
}
|
|
||||||
@keyframes @animationName {
|
|
||||||
@content();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,40 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
.title {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
transform: translateY(-10px);
|
|
||||||
|
|
||||||
.primary {
|
|
||||||
font-size: 2.4em;
|
|
||||||
font-weight: bolder;
|
|
||||||
color: @production-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.secondary {
|
|
||||||
font-size: 1.2em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.form {
|
|
||||||
width: 300px;
|
|
||||||
font-size: 14px;
|
|
||||||
|
|
||||||
.retry, .success {
|
|
||||||
margin-bottom: 16px;
|
|
||||||
|
|
||||||
a {
|
|
||||||
font-weight: bolder;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer {
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: @production-color;
|
|
||||||
font-weight: bolder;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
35
src/renderer/src/assets/css/pages/sign/forget.style.ts
Normal file
35
src/renderer/src/assets/css/pages/sign/forget.style.ts
Normal file
@@ -0,0 +1,35 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
title: {
|
||||||
|
marginBottom: token.marginMD,
|
||||||
|
transform: `translateY(-${token.sizeSM}px)`
|
||||||
|
},
|
||||||
|
|
||||||
|
primary: {
|
||||||
|
fontSize: token.fontSizeHeading3,
|
||||||
|
fontWeight: 'bolder',
|
||||||
|
color: token.colorPrimary
|
||||||
|
},
|
||||||
|
|
||||||
|
secondary: {
|
||||||
|
fontSize: token.fontSize
|
||||||
|
},
|
||||||
|
|
||||||
|
form: {
|
||||||
|
width: 300,
|
||||||
|
fontSize: token.fontSize
|
||||||
|
},
|
||||||
|
|
||||||
|
retry: {
|
||||||
|
marginBottom: token.margin
|
||||||
|
},
|
||||||
|
|
||||||
|
success: {
|
||||||
|
marginBottom: token.margin
|
||||||
|
},
|
||||||
|
|
||||||
|
footer: {
|
||||||
|
textAlign: 'center'
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,80 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
background-color: #D2D0DD;
|
|
||||||
user-select: none;
|
|
||||||
|
|
||||||
a {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
a:hover {
|
|
||||||
color: @production-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.signBox {
|
|
||||||
position: relative;
|
|
||||||
background-color: @origin-color;
|
|
||||||
width: 900px;
|
|
||||||
height: 600px;
|
|
||||||
overflow: hidden;
|
|
||||||
border-radius: 12px;
|
|
||||||
|
|
||||||
.left, .right {
|
|
||||||
opacity: 1;
|
|
||||||
transition: all 1s ease;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.hidden {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.cover {
|
|
||||||
position: absolute;
|
|
||||||
height: 100%;
|
|
||||||
width: 50%;
|
|
||||||
background-color: #F3F4F8;
|
|
||||||
transition: all 0.8s ease;
|
|
||||||
|
|
||||||
.ballBox {
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
background-color: #F1F2F7;
|
|
||||||
|
|
||||||
.ball {
|
|
||||||
position: absolute;
|
|
||||||
width: 128px;
|
|
||||||
height: 128px;
|
|
||||||
background-color: @production-color;
|
|
||||||
border-radius: 50%;
|
|
||||||
bottom: 0;
|
|
||||||
left: 50%;
|
|
||||||
transform: translateX(-50%) translateY(50%);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.mask {
|
|
||||||
transform: rotateZ(180deg);
|
|
||||||
filter: blur(12px);
|
|
||||||
|
|
||||||
.ball {
|
|
||||||
width: 140px;
|
|
||||||
height: 140px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.switch {
|
|
||||||
.cover {
|
|
||||||
transform: translateX(100%);
|
|
||||||
transition: all 0.8s ease;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
82
src/renderer/src/assets/css/pages/sign/index.style.ts
Normal file
82
src/renderer/src/assets/css/pages/sign/index.style.ts
Normal file
@@ -0,0 +1,82 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ cx, css, token }) => {
|
||||||
|
const cover = cx(css`
|
||||||
|
position: absolute;
|
||||||
|
height: 100%;
|
||||||
|
width: 50%;
|
||||||
|
background-color: ${token.colorBgLayout};
|
||||||
|
transition: all 0.8s ease;
|
||||||
|
`)
|
||||||
|
|
||||||
|
const ball = cx(css`
|
||||||
|
position: absolute;
|
||||||
|
width: ${token.sizeXL * 4}px;
|
||||||
|
height: ${token.sizeXL * 4}px;
|
||||||
|
background-color: ${token.colorPrimary};
|
||||||
|
border-radius: 50%;
|
||||||
|
bottom: 0;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%) translateY(50%);
|
||||||
|
`)
|
||||||
|
|
||||||
|
return {
|
||||||
|
root: {
|
||||||
|
backgroundColor: token.colorBorderSecondary,
|
||||||
|
userSelect: 'none',
|
||||||
|
|
||||||
|
a: {
|
||||||
|
fontWeight: 'bold'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
signBox: {
|
||||||
|
position: 'relative',
|
||||||
|
backgroundColor: token.colorBgContainer,
|
||||||
|
width: 900,
|
||||||
|
height: 600,
|
||||||
|
overflow: 'hidden',
|
||||||
|
borderRadius: token.borderRadiusLG
|
||||||
|
},
|
||||||
|
|
||||||
|
switch: css`
|
||||||
|
.${cover} {
|
||||||
|
transform: translateX(100%);
|
||||||
|
transition: all 0.8s ease;
|
||||||
|
}
|
||||||
|
`,
|
||||||
|
|
||||||
|
side: {
|
||||||
|
opacity: 1,
|
||||||
|
transition: 'all 1s ease',
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
width: '100%',
|
||||||
|
height: '100%'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
hidden: {
|
||||||
|
opacity: 0
|
||||||
|
},
|
||||||
|
|
||||||
|
cover,
|
||||||
|
|
||||||
|
ballBox: {
|
||||||
|
position: 'relative',
|
||||||
|
overflow: 'hidden'
|
||||||
|
},
|
||||||
|
|
||||||
|
ball,
|
||||||
|
|
||||||
|
mask: css`
|
||||||
|
transform: rotateZ(180deg);
|
||||||
|
filter: blur(${token.sizeSM}px);
|
||||||
|
|
||||||
|
.${ball} {
|
||||||
|
width: 140px;
|
||||||
|
height: 140px;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
}
|
||||||
|
})
|
||||||
@@ -1,41 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
.title {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
transform: translateY(-10px);
|
|
||||||
|
|
||||||
.primary {
|
|
||||||
font-size: 2.4em;
|
|
||||||
font-weight: bolder;
|
|
||||||
color: @production-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.secondary {
|
|
||||||
font-size: 1.2em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.form {
|
|
||||||
width: 300px;
|
|
||||||
font-size: 14px;
|
|
||||||
|
|
||||||
.addition {
|
|
||||||
justify-content: space-between;
|
|
||||||
margin-bottom: 14px;
|
|
||||||
|
|
||||||
a {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer {
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: @production-color;
|
|
||||||
font-weight: bolder;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
36
src/renderer/src/assets/css/pages/sign/sign-in.style.ts
Normal file
36
src/renderer/src/assets/css/pages/sign/sign-in.style.ts
Normal file
@@ -0,0 +1,36 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
title: {
|
||||||
|
marginBottom: token.marginMD,
|
||||||
|
transform: `translateY(-${token.sizeSM}px)`
|
||||||
|
},
|
||||||
|
|
||||||
|
primary: {
|
||||||
|
fontSize: token.fontSizeHeading3,
|
||||||
|
fontWeight: 'bolder',
|
||||||
|
color: token.colorPrimary
|
||||||
|
},
|
||||||
|
|
||||||
|
secondary: {
|
||||||
|
fontSize: token.fontSize
|
||||||
|
},
|
||||||
|
|
||||||
|
form: {
|
||||||
|
width: 300,
|
||||||
|
fontSize: token.fontSize
|
||||||
|
},
|
||||||
|
|
||||||
|
addition: {
|
||||||
|
justifyContent: 'space-between',
|
||||||
|
marginBottom: token.margin,
|
||||||
|
|
||||||
|
a: {
|
||||||
|
flex: '0 0 auto'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
footer: {
|
||||||
|
textAlign: 'center'
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,40 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
.title {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
transform: translateY(-10px);
|
|
||||||
|
|
||||||
.primary {
|
|
||||||
font-size: 2.4em;
|
|
||||||
font-weight: bolder;
|
|
||||||
color: @production-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.secondary {
|
|
||||||
font-size: 1.2em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.form {
|
|
||||||
width: 300px;
|
|
||||||
font-size: 14px;
|
|
||||||
|
|
||||||
.retry, .success {
|
|
||||||
margin-bottom: 16px;
|
|
||||||
|
|
||||||
a {
|
|
||||||
font-weight: bolder;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer {
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: @production-color;
|
|
||||||
font-weight: bolder;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
31
src/renderer/src/assets/css/pages/sign/sign-up.style.ts
Normal file
31
src/renderer/src/assets/css/pages/sign/sign-up.style.ts
Normal file
@@ -0,0 +1,31 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
title: {
|
||||||
|
marginBottom: token.marginMD,
|
||||||
|
transform: `translateY(-${token.sizeSM}px)`
|
||||||
|
},
|
||||||
|
|
||||||
|
primary: {
|
||||||
|
fontSize: token.fontSizeHeading3,
|
||||||
|
fontWeight: 'bolder',
|
||||||
|
color: token.colorPrimary
|
||||||
|
},
|
||||||
|
|
||||||
|
secondary: {
|
||||||
|
fontSize: token.fontSize
|
||||||
|
},
|
||||||
|
|
||||||
|
form: {
|
||||||
|
width: 300,
|
||||||
|
fontSize: token.fontSize
|
||||||
|
},
|
||||||
|
|
||||||
|
retry: {
|
||||||
|
marginBottom: token.margin
|
||||||
|
},
|
||||||
|
|
||||||
|
footer: {
|
||||||
|
textAlign: 'center'
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,28 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
.title {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
transform: translateY(-10px);
|
|
||||||
|
|
||||||
.primary {
|
|
||||||
font-size: 2.4em;
|
|
||||||
font-weight: bolder;
|
|
||||||
color: @production-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.secondary {
|
|
||||||
font-size: 1.2em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.form {
|
|
||||||
width: 300px;
|
|
||||||
font-size: 14px;
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: @production-color;
|
|
||||||
font-weight: bolder;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
23
src/renderer/src/assets/css/pages/sign/verify.style.ts
Normal file
23
src/renderer/src/assets/css/pages/sign/verify.style.ts
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
title: {
|
||||||
|
marginBottom: token.marginMD,
|
||||||
|
transform: `translateY(-${token.sizeSM}px)`
|
||||||
|
},
|
||||||
|
|
||||||
|
primary: {
|
||||||
|
fontSize: token.fontSizeHeading3,
|
||||||
|
fontWeight: 'bolder',
|
||||||
|
color: token.colorPrimary
|
||||||
|
},
|
||||||
|
|
||||||
|
secondary: {
|
||||||
|
fontSize: token.fontSize
|
||||||
|
},
|
||||||
|
|
||||||
|
form: {
|
||||||
|
width: 300,
|
||||||
|
fontSize: token.fontSize
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,13 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
.leftPanel {
|
|
||||||
background-color: @origin-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.rightPanel {
|
|
||||||
flex: 1;
|
|
||||||
width: 0;
|
|
||||||
background-color: @background-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
13
src/renderer/src/assets/css/pages/system-framework.style.ts
Normal file
13
src/renderer/src/assets/css/pages/system-framework.style.ts
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
leftPanel: {
|
||||||
|
backgroundColor: token.colorBgContainer
|
||||||
|
},
|
||||||
|
|
||||||
|
rightPanel: {
|
||||||
|
flex: 1,
|
||||||
|
width: 0,
|
||||||
|
backgroundColor: token.colorBgLayout
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,15 +0,0 @@
|
|||||||
.root {
|
|
||||||
.rootContent {
|
|
||||||
padding: 20px;
|
|
||||||
gap: 20px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
justify-content: flex-start;
|
|
||||||
|
|
||||||
> div {
|
|
||||||
width: 200px;
|
|
||||||
height: 320px;
|
|
||||||
flex: 0 0 auto;
|
|
||||||
overflow: hidden !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
15
src/renderer/src/assets/css/pages/system/index.style.ts
Normal file
15
src/renderer/src/assets/css/pages/system/index.style.ts
Normal file
@@ -0,0 +1,15 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(() => ({
|
||||||
|
root: {
|
||||||
|
padding: 20,
|
||||||
|
gap: 20,
|
||||||
|
flexWrap: 'wrap',
|
||||||
|
justifyContent: 'flex-start',
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
flex: '0 0 auto',
|
||||||
|
overflow: 'hidden !important'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,14 +0,0 @@
|
|||||||
.root {
|
|
||||||
.rootContent {
|
|
||||||
padding: 20px;
|
|
||||||
gap: 20px;
|
|
||||||
|
|
||||||
.rootCol {
|
|
||||||
gap: 20px;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(() => ({
|
||||||
|
root: {
|
||||||
|
padding: 20,
|
||||||
|
gap: 20
|
||||||
|
},
|
||||||
|
|
||||||
|
rootCol: {
|
||||||
|
gap: 20,
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
flex: '0 0 auto'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,13 +0,0 @@
|
|||||||
.root {
|
|
||||||
.rootContent {
|
|
||||||
padding: 20px;
|
|
||||||
gap: 20px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
> div {
|
|
||||||
width: 48%;
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,44 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
content: {
|
||||||
|
fontSize: token.fontSize,
|
||||||
|
padding: '0 10px',
|
||||||
|
gap: 10,
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
gap: 5
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
bigChart: {
|
||||||
|
width: 0,
|
||||||
|
height: 400
|
||||||
|
},
|
||||||
|
|
||||||
|
key: {
|
||||||
|
flex: '0 0 auto',
|
||||||
|
color: token.colorTextLabel
|
||||||
|
},
|
||||||
|
|
||||||
|
value: {
|
||||||
|
color: token.colorTextDescription,
|
||||||
|
overflow: 'hidden',
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
overflow: 'hidden',
|
||||||
|
textOverflow: 'ellipsis',
|
||||||
|
whiteSpace: 'nowrap'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
chartValue: {
|
||||||
|
justifyContent: 'space-between',
|
||||||
|
width: 0
|
||||||
|
},
|
||||||
|
|
||||||
|
percentValue: {
|
||||||
|
flex: '0 0 auto',
|
||||||
|
color: token.colorTextDescription
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(() => ({
|
||||||
|
root: {
|
||||||
|
padding: 20,
|
||||||
|
gap: 20,
|
||||||
|
minWidth: 800,
|
||||||
|
flexWrap: 'wrap',
|
||||||
|
justifyContent: 'center',
|
||||||
|
|
||||||
|
'> div': {
|
||||||
|
width: '48%',
|
||||||
|
flex: '0 0 auto'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,44 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
.rootContent {
|
|
||||||
padding: 20px;
|
|
||||||
gap: 10px;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
.hasEdited::after {
|
|
||||||
content: '*';
|
|
||||||
color: @font-secondary-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
>*:first-child {
|
|
||||||
width: 0;
|
|
||||||
height: fit-content;
|
|
||||||
}
|
|
||||||
|
|
||||||
> *:nth-child(2) {
|
|
||||||
position: sticky;
|
|
||||||
top: 20px;
|
|
||||||
height: calc(100vh - 40px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.closeEditorBtn {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
position: absolute;
|
|
||||||
top: 10px;
|
|
||||||
right: 10px;
|
|
||||||
background-color: @font-secondary-color;
|
|
||||||
width: 32px;
|
|
||||||
height: 32px;
|
|
||||||
border-radius: 50%;
|
|
||||||
color: white;
|
|
||||||
opacity: 0.6;
|
|
||||||
box-shadow: 2px 2px 10px 0 rgba(0,0,0,0.2);
|
|
||||||
cursor: pointer;
|
|
||||||
z-index: 1000;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
44
src/renderer/src/assets/css/pages/system/tools/base.style.ts
Normal file
44
src/renderer/src/assets/css/pages/system/tools/base.style.ts
Normal file
@@ -0,0 +1,44 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
root: {
|
||||||
|
padding: 20,
|
||||||
|
gap: 20,
|
||||||
|
|
||||||
|
'> *:first-child': {
|
||||||
|
width: 0,
|
||||||
|
height: 'fit-content'
|
||||||
|
},
|
||||||
|
|
||||||
|
'> *:nth-child(2)': {
|
||||||
|
position: 'sticky',
|
||||||
|
top: 20,
|
||||||
|
height: 'calc(100vh - 40px)'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
hasEdited: {
|
||||||
|
'&::after': {
|
||||||
|
content: '"*"',
|
||||||
|
color: token.colorTextSecondary
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
closeEditorBtn: {
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'center',
|
||||||
|
alignItems: 'center',
|
||||||
|
position: 'absolute',
|
||||||
|
top: 10,
|
||||||
|
right: 10,
|
||||||
|
backgroundColor: token.colorBorder,
|
||||||
|
width: 32,
|
||||||
|
height: 32,
|
||||||
|
borderRadius: '50%',
|
||||||
|
color: token.colorTextSecondary,
|
||||||
|
opacity: 0.6,
|
||||||
|
boxShadow: token.boxShadow,
|
||||||
|
cursor: 'pointer',
|
||||||
|
zIndex: 1000
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,20 +0,0 @@
|
|||||||
.root {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
.rootBox {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.draggableContent {
|
|
||||||
position: fixed;
|
|
||||||
inset-inline-end: 48px;
|
|
||||||
inset-block-end: 48px;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
position: relative;
|
|
||||||
inset-inline-end: 0;
|
|
||||||
inset-block-end: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
24
src/renderer/src/assets/css/pages/system/tools/code.style.ts
Normal file
24
src/renderer/src/assets/css/pages/system/tools/code.style.ts
Normal file
@@ -0,0 +1,24 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(() => ({
|
||||||
|
root: {
|
||||||
|
padding: 20
|
||||||
|
},
|
||||||
|
|
||||||
|
rootBox: {
|
||||||
|
width: '100%',
|
||||||
|
height: '100%'
|
||||||
|
},
|
||||||
|
|
||||||
|
draggableContent: {
|
||||||
|
position: 'fixed',
|
||||||
|
insetInlineEnd: 48,
|
||||||
|
insetBlockEnd: 48,
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
position: 'relative',
|
||||||
|
insetInlineEnd: 0,
|
||||||
|
insetBlockEnd: 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,8 +0,0 @@
|
|||||||
.root {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
.rootBox {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,12 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(() => ({
|
||||||
|
root: {
|
||||||
|
padding: 20
|
||||||
|
},
|
||||||
|
|
||||||
|
rootBox: {
|
||||||
|
width: '100%',
|
||||||
|
height: '100%'
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,44 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
.rootContent {
|
|
||||||
padding: 20px;
|
|
||||||
gap: 10px;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
.hasEdited::after {
|
|
||||||
content: '*';
|
|
||||||
color: @font-secondary-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
>*:first-child {
|
|
||||||
width: 0;
|
|
||||||
height: fit-content;
|
|
||||||
}
|
|
||||||
|
|
||||||
> *:nth-child(2) {
|
|
||||||
position: sticky;
|
|
||||||
top: 20px;
|
|
||||||
height: calc(100vh - 40px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.closeEditorBtn {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
position: absolute;
|
|
||||||
top: 10px;
|
|
||||||
right: 10px;
|
|
||||||
background-color: @font-secondary-color;
|
|
||||||
width: 32px;
|
|
||||||
height: 32px;
|
|
||||||
border-radius: 50%;
|
|
||||||
color: white;
|
|
||||||
opacity: 0.6;
|
|
||||||
box-shadow: 2px 2px 10px 0 rgba(0,0,0,0.2);
|
|
||||||
cursor: pointer;
|
|
||||||
z-index: 1000;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,44 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
root: {
|
||||||
|
padding: 20,
|
||||||
|
gap: 20,
|
||||||
|
|
||||||
|
'> *:first-child': {
|
||||||
|
width: 0,
|
||||||
|
height: 'fit-content'
|
||||||
|
},
|
||||||
|
|
||||||
|
'> *:nth-child(2)': {
|
||||||
|
position: 'sticky',
|
||||||
|
top: 20,
|
||||||
|
height: 'calc(100vh - 40px)'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
hasEdited: {
|
||||||
|
'&::after': {
|
||||||
|
content: '"*"',
|
||||||
|
color: token.colorTextSecondary
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
closeEditorBtn: {
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'center',
|
||||||
|
alignItems: 'center',
|
||||||
|
position: 'absolute',
|
||||||
|
top: 10,
|
||||||
|
right: 10,
|
||||||
|
backgroundColor: token.colorBorder,
|
||||||
|
width: 32,
|
||||||
|
height: 32,
|
||||||
|
borderRadius: '50%',
|
||||||
|
color: token.colorTextSecondary,
|
||||||
|
opacity: 0.6,
|
||||||
|
boxShadow: token.boxShadow,
|
||||||
|
cursor: 'pointer',
|
||||||
|
zIndex: 1000
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,21 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
.leftPanel {
|
|
||||||
background-color: @origin-color;
|
|
||||||
|
|
||||||
.menuDroppable {
|
|
||||||
display: flex;
|
|
||||||
position: relative;
|
|
||||||
min-height: 0;
|
|
||||||
flex: 1;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.rightPanel {
|
|
||||||
flex: 1;
|
|
||||||
width: 0;
|
|
||||||
background-color: @background-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
21
src/renderer/src/assets/css/pages/tools-framework.style.ts
Normal file
21
src/renderer/src/assets/css/pages/tools-framework.style.ts
Normal file
@@ -0,0 +1,21 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
leftPanel: {
|
||||||
|
backgroundColor: token.colorBgContainer
|
||||||
|
},
|
||||||
|
|
||||||
|
menuDroppable: {
|
||||||
|
display: 'flex',
|
||||||
|
position: 'relative',
|
||||||
|
minHeight: 0,
|
||||||
|
flex: 1,
|
||||||
|
width: '100%'
|
||||||
|
},
|
||||||
|
|
||||||
|
rightPanel: {
|
||||||
|
flex: 1,
|
||||||
|
width: 0,
|
||||||
|
backgroundColor: token.colorBgLayout
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,52 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
padding: 20px;
|
|
||||||
gap: 20px;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
gap: 10px;
|
|
||||||
width: 0;
|
|
||||||
|
|
||||||
.title {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
height: 40px;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
font-size: 1.6em;
|
|
||||||
color: @production-color;
|
|
||||||
font-weight: bolder;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.config {
|
|
||||||
.configContent {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
.createBt {
|
|
||||||
width: 100%;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.preview {
|
|
||||||
display: flex;
|
|
||||||
position: relative;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.noPreview {
|
|
||||||
font-weight: bolder;
|
|
||||||
color: @font-secondary-color;
|
|
||||||
font-size: 1.4em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
52
src/renderer/src/assets/css/pages/tools/create.style.ts
Normal file
52
src/renderer/src/assets/css/pages/tools/create.style.ts
Normal file
@@ -0,0 +1,52 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
root: {
|
||||||
|
padding: 20,
|
||||||
|
gap: 20,
|
||||||
|
height: '100%',
|
||||||
|
width: '100%',
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
gap: 10,
|
||||||
|
width: 0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
title: {
|
||||||
|
flex: '0 0 auto',
|
||||||
|
height: 40,
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
height: '100%',
|
||||||
|
width: '100%',
|
||||||
|
justifyContent: 'center',
|
||||||
|
alignItems: 'center',
|
||||||
|
fontSize: token.fontSizeXL,
|
||||||
|
fontWeight: 'bolder',
|
||||||
|
color: token.colorPrimary
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
config: {
|
||||||
|
padding: 20
|
||||||
|
},
|
||||||
|
|
||||||
|
createBt: {
|
||||||
|
width: '100%',
|
||||||
|
fontWeight: 'bold'
|
||||||
|
},
|
||||||
|
|
||||||
|
preview: {
|
||||||
|
display: 'flex',
|
||||||
|
position: 'relative',
|
||||||
|
justifyContent: 'center',
|
||||||
|
alignItems: 'center'
|
||||||
|
},
|
||||||
|
|
||||||
|
noPreview: {
|
||||||
|
color: token.colorTextSecondary,
|
||||||
|
fontSize: token.fontSizeLG,
|
||||||
|
fontWeight: 'bolder'
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,36 +0,0 @@
|
|||||||
.root {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
.rootBox {
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
.rootContent {
|
|
||||||
position: relative;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
width: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.draggableMask {
|
|
||||||
position: absolute;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.draggableContent {
|
|
||||||
position: fixed;
|
|
||||||
inset-inline-end: 48px;
|
|
||||||
inset-block-end: 48px;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
position: relative;
|
|
||||||
inset-inline-end: 0;
|
|
||||||
inset-block-end: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
40
src/renderer/src/assets/css/pages/tools/edit.style.ts
Normal file
40
src/renderer/src/assets/css/pages/tools/edit.style.ts
Normal file
@@ -0,0 +1,40 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(() => ({
|
||||||
|
root: {
|
||||||
|
padding: 20
|
||||||
|
},
|
||||||
|
|
||||||
|
rootBox: {
|
||||||
|
width: '100%',
|
||||||
|
height: '100%'
|
||||||
|
},
|
||||||
|
|
||||||
|
content: {
|
||||||
|
position: 'relative',
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
width: 0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
draggableMask: {
|
||||||
|
position: 'absolute',
|
||||||
|
width: '100%',
|
||||||
|
height: '100%'
|
||||||
|
},
|
||||||
|
|
||||||
|
draggableContent: {
|
||||||
|
position: 'fixed',
|
||||||
|
insetInlineEnd: 48,
|
||||||
|
insetBlockEnd: 48,
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
position: 'relative',
|
||||||
|
insetInlineEnd: 0,
|
||||||
|
insetBlockEnd: 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,54 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
padding: 20px;
|
|
||||||
gap: 20px;
|
|
||||||
|
|
||||||
.ownContent {
|
|
||||||
gap: 20px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
justify-content: flex-start;
|
|
||||||
|
|
||||||
> div {
|
|
||||||
width: 180px;
|
|
||||||
min-height: 290px;
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
& > :first-child {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.favoriteDivider {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
|
||||||
gap: 20px;
|
|
||||||
margin-top: 20px;
|
|
||||||
|
|
||||||
:first-child, :last-child {
|
|
||||||
height: 0;
|
|
||||||
border: 1px dashed @divide-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dividerText {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
font-size: 1.2em;
|
|
||||||
color: @font-secondary-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.starContent {
|
|
||||||
gap: 20px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
justify-content: flex-start;
|
|
||||||
|
|
||||||
> div {
|
|
||||||
width: 180px;
|
|
||||||
min-height: 290px;
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
45
src/renderer/src/assets/css/pages/tools/index.style.ts
Normal file
45
src/renderer/src/assets/css/pages/tools/index.style.ts
Normal file
@@ -0,0 +1,45 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
root: {
|
||||||
|
padding: 20,
|
||||||
|
gap: 20
|
||||||
|
},
|
||||||
|
|
||||||
|
ownContent: {
|
||||||
|
gap: 20,
|
||||||
|
flexWrap: 'wrap',
|
||||||
|
justifyContent: 'flex-start',
|
||||||
|
|
||||||
|
'> div': {
|
||||||
|
flex: '0 0 auto'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
favoriteDivider: {
|
||||||
|
alignItems: 'center',
|
||||||
|
gap: 20,
|
||||||
|
marginTop: 20,
|
||||||
|
|
||||||
|
'> :first-child, > :last-child': {
|
||||||
|
height: 0,
|
||||||
|
border: `1px dashed ${token.colorSplit}`
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
dividerText: {
|
||||||
|
flex: '0 0 auto !important',
|
||||||
|
fontSize: '1.2em',
|
||||||
|
color: token.colorTextSecondary
|
||||||
|
},
|
||||||
|
|
||||||
|
starContent: {
|
||||||
|
gap: 20,
|
||||||
|
flexWrap: 'wrap',
|
||||||
|
justifyContent: 'flex-start',
|
||||||
|
|
||||||
|
'> div': {
|
||||||
|
flex: '0 0 auto'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,43 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
.search {
|
|
||||||
display: flex;
|
|
||||||
position: sticky;
|
|
||||||
width: 100%;
|
|
||||||
margin-top: 20px;
|
|
||||||
top: 20px;
|
|
||||||
z-index: 10;
|
|
||||||
justify-content: center;
|
|
||||||
transition: all 0.3s ease;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
width: 80%;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.hide {
|
|
||||||
transform: translateY(-60px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.rootContent {
|
|
||||||
padding: 20px;
|
|
||||||
gap: 20px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
> div {
|
|
||||||
width: 180px;
|
|
||||||
min-height: 290px;
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.noTool {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
font-size: 1.4em;
|
|
||||||
font-weight: bolder;
|
|
||||||
color: @font-secondary-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
41
src/renderer/src/assets/css/pages/tools/local.style.ts
Normal file
41
src/renderer/src/assets/css/pages/tools/local.style.ts
Normal file
@@ -0,0 +1,41 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
search: {
|
||||||
|
display: 'flex',
|
||||||
|
position: 'sticky',
|
||||||
|
width: '100%',
|
||||||
|
marginTop: 20,
|
||||||
|
top: 20,
|
||||||
|
zIndex: 10,
|
||||||
|
justifyContent: 'center',
|
||||||
|
transition: 'all 0.3s ease',
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
width: '80%'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
hide: {
|
||||||
|
transform: 'translateY(-60px)'
|
||||||
|
},
|
||||||
|
|
||||||
|
root: {
|
||||||
|
padding: 20,
|
||||||
|
gap: 20,
|
||||||
|
flexWrap: 'wrap',
|
||||||
|
justifyContent: 'center',
|
||||||
|
|
||||||
|
'> div': {
|
||||||
|
flex: '0 0 auto'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
noTool: {
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'center',
|
||||||
|
fontSize: '1.4em',
|
||||||
|
fontWeight: 'bolder',
|
||||||
|
color: token.colorTextSecondary
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,8 +0,0 @@
|
|||||||
.root {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
.rootBox {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
12
src/renderer/src/assets/css/pages/tools/source.style.ts
Normal file
12
src/renderer/src/assets/css/pages/tools/source.style.ts
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(() => ({
|
||||||
|
root: {
|
||||||
|
padding: 20
|
||||||
|
},
|
||||||
|
|
||||||
|
content: {
|
||||||
|
width: '100%',
|
||||||
|
height: '100%'
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,43 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
.search {
|
|
||||||
display: flex;
|
|
||||||
position: sticky;
|
|
||||||
width: 100%;
|
|
||||||
margin-top: 20px;
|
|
||||||
top: 20px;
|
|
||||||
z-index: 10;
|
|
||||||
justify-content: center;
|
|
||||||
transition: all 0.3s ease;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
width: 80%;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.hide {
|
|
||||||
transform: translateY(-60px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.rootContent {
|
|
||||||
padding: 20px;
|
|
||||||
gap: 20px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
> div {
|
|
||||||
width: 180px;
|
|
||||||
min-height: 290px;
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.noTool {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
font-size: 1.4em;
|
|
||||||
font-weight: bolder;
|
|
||||||
color: @font-secondary-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
41
src/renderer/src/assets/css/pages/tools/store.style.ts
Normal file
41
src/renderer/src/assets/css/pages/tools/store.style.ts
Normal file
@@ -0,0 +1,41 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
search: {
|
||||||
|
display: 'flex',
|
||||||
|
position: 'sticky',
|
||||||
|
width: '100%',
|
||||||
|
marginTop: 20,
|
||||||
|
top: 20,
|
||||||
|
zIndex: 10,
|
||||||
|
justifyContent: 'center',
|
||||||
|
transition: 'all 0.3s ease',
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
width: '80%'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
hide: {
|
||||||
|
transform: 'translateY(-60px)'
|
||||||
|
},
|
||||||
|
|
||||||
|
root: {
|
||||||
|
padding: 20,
|
||||||
|
gap: 20,
|
||||||
|
flexWrap: 'wrap',
|
||||||
|
justifyContent: 'center',
|
||||||
|
|
||||||
|
'> div': {
|
||||||
|
flex: '0 0 auto'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
noTool: {
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'center',
|
||||||
|
fontSize: '1.4em',
|
||||||
|
fontWeight: 'bolder',
|
||||||
|
color: token.colorTextSecondary
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,79 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
padding: 80px 20px 20px 20px;
|
|
||||||
|
|
||||||
.rootBox {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
overflow: visible;
|
|
||||||
align-items: center;
|
|
||||||
min-width: 900px;
|
|
||||||
padding-bottom: 20px;
|
|
||||||
|
|
||||||
> .info {
|
|
||||||
margin-left: 40px;
|
|
||||||
transform: translateY(-40px);
|
|
||||||
|
|
||||||
> * {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.avatarBox {
|
|
||||||
background-color: white;
|
|
||||||
padding: 4px;
|
|
||||||
border-radius: 50%;
|
|
||||||
box-shadow: 5px 5px 15px 0 rgba(0, 0, 0, 0.1);
|
|
||||||
|
|
||||||
.avatar {
|
|
||||||
background-color: transparent !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.infoName {
|
|
||||||
margin: 20px 0 0 24px;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nickname {
|
|
||||||
font-size: 2.4em;
|
|
||||||
font-weight: bolder;
|
|
||||||
color: @production-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.url {
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
> span {
|
|
||||||
margin-left: 8px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.tools {
|
|
||||||
padding: 20px;
|
|
||||||
gap: 20px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
> div {
|
|
||||||
width: 180px;
|
|
||||||
min-height: 290px;
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.noTool {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
font-size: 1.2em;
|
|
||||||
font-weight: bolder;
|
|
||||||
color: @font-secondary-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
82
src/renderer/src/assets/css/pages/tools/user.style.ts
Normal file
82
src/renderer/src/assets/css/pages/tools/user.style.ts
Normal file
@@ -0,0 +1,82 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
root: {
|
||||||
|
padding: '80px 20px 20px 20px'
|
||||||
|
},
|
||||||
|
|
||||||
|
content: {
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
overflow: 'visible',
|
||||||
|
alignItems: 'center',
|
||||||
|
minWidth: 900,
|
||||||
|
paddingBottom: 20
|
||||||
|
},
|
||||||
|
|
||||||
|
info: {
|
||||||
|
marginLeft: 40,
|
||||||
|
transform: 'translateY(-40px)',
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
flex: '0 0 auto !important'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
avatarBox: {
|
||||||
|
backgroundColor: token.colorBgLayout,
|
||||||
|
padding: 4,
|
||||||
|
borderRadius: '50%',
|
||||||
|
boxShadow: token.boxShadow
|
||||||
|
},
|
||||||
|
|
||||||
|
avatar: {
|
||||||
|
backgroundColor: 'transparent !important'
|
||||||
|
},
|
||||||
|
|
||||||
|
infoName: {
|
||||||
|
margin: '20px 0 0 20px',
|
||||||
|
justifyContent: 'center',
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
flex: '0 0 auto'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
nickname: {
|
||||||
|
fontSize: token.fontSizeHeading2,
|
||||||
|
fontWeight: 'bolder',
|
||||||
|
color: token.colorPrimary
|
||||||
|
},
|
||||||
|
|
||||||
|
url: {
|
||||||
|
cursor: 'pointer',
|
||||||
|
|
||||||
|
'> span': {
|
||||||
|
marginLeft: 8
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
tools: {
|
||||||
|
padding: 20,
|
||||||
|
gap: 20,
|
||||||
|
flexWrap: 'wrap',
|
||||||
|
justifyContent: 'center',
|
||||||
|
|
||||||
|
'> div': {
|
||||||
|
flex: '0 0 auto',
|
||||||
|
|
||||||
|
'> div': {
|
||||||
|
backgroundColor: token.colorBgLayout
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
noTool: {
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'center',
|
||||||
|
marginBottom: 20,
|
||||||
|
fontSize: token.fontSizeLG,
|
||||||
|
color: token.colorTextSecondary
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,9 +0,0 @@
|
|||||||
.root {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
.rootBox {
|
|
||||||
position: relative;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
13
src/renderer/src/assets/css/pages/tools/view.style.ts
Normal file
13
src/renderer/src/assets/css/pages/tools/view.style.ts
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(() => ({
|
||||||
|
root: {
|
||||||
|
padding: 20
|
||||||
|
},
|
||||||
|
|
||||||
|
content: {
|
||||||
|
position: 'relative',
|
||||||
|
height: '100%',
|
||||||
|
width: '100%'
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,13 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
.leftPanel {
|
|
||||||
background-color: @origin-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.rightPanel {
|
|
||||||
flex: 1;
|
|
||||||
width: 0;
|
|
||||||
background-color: @background-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
13
src/renderer/src/assets/css/pages/user-framework.style.ts
Normal file
13
src/renderer/src/assets/css/pages/user-framework.style.ts
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
leftPanel: {
|
||||||
|
backgroundColor: token.colorBgContainer
|
||||||
|
},
|
||||||
|
|
||||||
|
rightPanel: {
|
||||||
|
flex: 1,
|
||||||
|
width: 0,
|
||||||
|
backgroundColor: token.colorBgLayout
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,118 +0,0 @@
|
|||||||
@import "@/assets/css/constants";
|
|
||||||
|
|
||||||
.root {
|
|
||||||
padding: 80px 20px 20px 20px;
|
|
||||||
|
|
||||||
.content {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
overflow: visible;
|
|
||||||
align-items: center;
|
|
||||||
min-width: 900px;
|
|
||||||
padding-bottom: 20px;
|
|
||||||
|
|
||||||
> :not(:first-child) {
|
|
||||||
padding: 0 60px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.divide {
|
|
||||||
height: 1px;
|
|
||||||
width: calc(100% - 120px);
|
|
||||||
background-color: @divide-color;
|
|
||||||
margin: 0 60px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.info {
|
|
||||||
margin-left: 40px;
|
|
||||||
transform: translateY(-40px);
|
|
||||||
|
|
||||||
> * {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.avatarBox {
|
|
||||||
background-color: white;
|
|
||||||
padding: 4px;
|
|
||||||
border-radius: 50%;
|
|
||||||
box-shadow: 5px 5px 15px 0 rgba(0, 0, 0, 0.1);
|
|
||||||
|
|
||||||
.avatar {
|
|
||||||
background-color: transparent !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.infoName {
|
|
||||||
margin: 20px 0 0 24px;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nickname {
|
|
||||||
font-size: 2.4em;
|
|
||||||
font-weight: bolder;
|
|
||||||
color: @production-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.url {
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
> span {
|
|
||||||
margin-left: 8px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.title {
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.content {
|
|
||||||
padding-bottom: 30px;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text {
|
|
||||||
font-size: 1.6em;
|
|
||||||
font-weight: bolder;
|
|
||||||
}
|
|
||||||
|
|
||||||
.operation {
|
|
||||||
gap: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.profile, .security {
|
|
||||||
gap: 24px;
|
|
||||||
padding-top: 30px;
|
|
||||||
padding-bottom: 20px;
|
|
||||||
|
|
||||||
.row {
|
|
||||||
> * {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.label {
|
|
||||||
font-size: 1.4em;
|
|
||||||
font-weight: bolder;
|
|
||||||
width: 400px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input {
|
|
||||||
width: 400px;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
114
src/renderer/src/assets/css/pages/user/index.style.ts
Normal file
114
src/renderer/src/assets/css/pages/user/index.style.ts
Normal file
@@ -0,0 +1,114 @@
|
|||||||
|
import { createStyles } from 'antd-style'
|
||||||
|
|
||||||
|
export default createStyles(({ token }) => ({
|
||||||
|
root: {
|
||||||
|
padding: '80px 20px 20px 20px'
|
||||||
|
},
|
||||||
|
|
||||||
|
content: {
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
overflow: 'visible',
|
||||||
|
alignItems: 'center',
|
||||||
|
minWidth: 900,
|
||||||
|
paddingBottom: 20,
|
||||||
|
|
||||||
|
'> :not(:first-child)': {
|
||||||
|
padding: '0 60px'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
info: {
|
||||||
|
marginLeft: 40,
|
||||||
|
transform: 'translateY(-40px)',
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
flex: '0 0 auto !important'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
avatarBox: {
|
||||||
|
backgroundColor: token.colorBgLayout,
|
||||||
|
padding: 4,
|
||||||
|
borderRadius: '50%',
|
||||||
|
boxShadow: token.boxShadow
|
||||||
|
},
|
||||||
|
|
||||||
|
avatar: {
|
||||||
|
backgroundColor: 'transparent !important'
|
||||||
|
},
|
||||||
|
|
||||||
|
infoName: {
|
||||||
|
margin: '20px 0 0 20px',
|
||||||
|
justifyContent: 'center',
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
flex: '0 0 auto'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
nickname: {
|
||||||
|
fontSize: token.fontSizeHeading2,
|
||||||
|
fontWeight: 'bolder',
|
||||||
|
color: token.colorPrimary
|
||||||
|
},
|
||||||
|
|
||||||
|
url: {
|
||||||
|
cursor: 'pointer',
|
||||||
|
|
||||||
|
'> span': {
|
||||||
|
marginLeft: 8
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
header: {
|
||||||
|
justifyContent: 'space-between',
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
flex: '0 0 auto'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
title: {
|
||||||
|
fontSize: token.fontSizeXL,
|
||||||
|
fontWeight: 'bolder'
|
||||||
|
},
|
||||||
|
|
||||||
|
operation: {
|
||||||
|
gap: 10
|
||||||
|
},
|
||||||
|
|
||||||
|
divider: {
|
||||||
|
height: 1,
|
||||||
|
width: 'calc(100% - 120px)',
|
||||||
|
backgroundColor: token.colorSplit,
|
||||||
|
margin: '30px 60px'
|
||||||
|
},
|
||||||
|
|
||||||
|
list: {
|
||||||
|
gap: 24
|
||||||
|
},
|
||||||
|
|
||||||
|
row: {
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'space-between',
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
flex: '0 0 auto'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
label: {
|
||||||
|
fontSize: token.fontSize,
|
||||||
|
fontWeight: 'bolder',
|
||||||
|
flex: 1
|
||||||
|
},
|
||||||
|
|
||||||
|
input: {
|
||||||
|
width: 400,
|
||||||
|
|
||||||
|
'> *': {
|
||||||
|
width: '100%'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}))
|
||||||
@@ -1,89 +0,0 @@
|
|||||||
.keyframes(@animationName, @content) {
|
|
||||||
animation-name: @animationName;
|
|
||||||
@-webkit-keyframes @animationName {
|
|
||||||
@content();
|
|
||||||
}
|
|
||||||
@-moz-keyframes @animationName {
|
|
||||||
@content();
|
|
||||||
}
|
|
||||||
@-o-keyframes @animationName {
|
|
||||||
@content();
|
|
||||||
}
|
|
||||||
@keyframes @animationName {
|
|
||||||
@content();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.root {
|
|
||||||
position: relative;
|
|
||||||
height: 0;
|
|
||||||
|
|
||||||
:global .monaco-editor-light {
|
|
||||||
height: 100%;
|
|
||||||
overflow: hidden;
|
|
||||||
background-color: var(--border);
|
|
||||||
|
|
||||||
.jsx-tag-angle-bracket {
|
|
||||||
color: #800000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jsx-text {
|
|
||||||
color: #000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jsx-tag-name {
|
|
||||||
color: #800000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jsx-tag-attribute-key {
|
|
||||||
color: #f00;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
:global .monaco-editor-vs-dark {
|
|
||||||
height: 100%;
|
|
||||||
overflow: hidden;
|
|
||||||
background-color: var(--border);
|
|
||||||
|
|
||||||
.jsx-tag-angle-bracket {
|
|
||||||
color: #808080;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jsx-text {
|
|
||||||
color: #d4d4d4;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jsx-tag-name {
|
|
||||||
color: #569cd6;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jsx-tag-attribute-key {
|
|
||||||
color: #9cdcfe;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.playgroundCodeEditorLoading {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
right: 0;
|
|
||||||
margin: 4px;
|
|
||||||
width: 10px;
|
|
||||||
height: 10px;
|
|
||||||
border-radius: 50%;
|
|
||||||
border-top: 2px #666 solid;
|
|
||||||
border-right: 2px #ddd solid;
|
|
||||||
border-bottom: 2px #ddd solid;
|
|
||||||
border-left: 2px #ddd solid;
|
|
||||||
animation: .6s linear infinite;
|
|
||||||
|
|
||||||
.keyframes(fUHD7o, {
|
|
||||||
0% {
|
|
||||||
transform: rotateZ(0);
|
|
||||||
}
|
|
||||||
|
|
||||||
100% {
|
|
||||||
transform: rotateZ(360deg);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user