FatttSnake/oxygen-ui
1
0
Fork 0
Code Pull Requests Activity

Refactor(App): Change sass to less

Browse Source
This commit is contained in:
Fat Snake
2024-10-17 13:50:47 +08:00
parent a482bbc14c
commit 3d77dc793b
98 changed files with 466 additions and 363 deletions
Download Patch File Download Diff File Expand all files Collapse all files

195
package-lock.json generated
View File

@@ -53,8 +53,8 @@
"eslint-plugin-react-refresh": "^0.4.12",
"globals": "^15.11.0",
"jsdom": "^24.1.3",
"less": "^4.2.0",
"prettier": "^3.3.3",
"sass": "^1.79.5",
"typescript": "^5.6.3",
"typescript-eslint": "^8.9.0",
"unplugin-auto-import": "^0.18.3",
@@ -877,6 +877,8 @@
"version": "2.4.1",
"dev": true,
"license": "MIT",
"optional": true,
"peer": true,
"dependencies": {
"detect-libc": "^1.0.3",
"is-glob": "^4.0.3",
@@ -916,6 +918,7 @@
"os": [
"win32"
],
"peer": true,
"engines": {
"node": ">= 10.0.0"
},
@@ -1891,6 +1894,8 @@
"version": "4.0.1",
"dev": true,
"license": "MIT",
"optional": true,
"peer": true,
"dependencies": {
"readdirp": "^4.0.1"
},
@@ -1954,6 +1959,18 @@
"dev": true,
"license": "MIT"
},
"node_modules/copy-anything": {
"version": "2.0.6",
"resolved": "https://registry.npmjs.org/copy-anything/-/copy-anything-2.0.6.tgz",
"integrity": "sha512-1j20GZTsvKNkc4BY3NpMOM8tt///wY3FpIzozTOFO2ffuZcV61nojHXVKIy3WM+7ADCy5FVhdZYHYDdgTU0yJw==",
"dev": true,
"dependencies": {
"is-what": "^3.14.1"
},
"funding": {
"url": "https://github.com/sponsors/mesqueeb"
}
},
"node_modules/copy-to-clipboard": {
"version": "3.3.3",
"license": "MIT",
@@ -2073,6 +2090,8 @@
"version": "1.0.3",
"dev": true,
"license": "Apache-2.0",
"optional": true,
"peer": true,
"bin": {
"detect-libc": "bin/detect-libc.js"
},
@@ -2117,6 +2136,19 @@
"url": "https://github.com/fb55/entities?sponsor=1"
}
},
"node_modules/errno": {
"version": "0.1.8",
"resolved": "https://registry.npmjs.org/errno/-/errno-0.1.8.tgz",
"integrity": "sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==",
"dev": true,
"optional": true,
"dependencies": {
"prr": "~1.0.1"
},
"bin": {
"errno": "cli.js"
}
},
"node_modules/error-ex": {
"version": "1.3.2",
"dev": true,
@@ -2676,6 +2708,13 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/graceful-fs": {
"version": "4.2.11",
"resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
"integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==",
"dev": true,
"optional": true
},
"node_modules/graphemer": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/graphemer/-/graphemer-1.4.0.tgz",
@@ -2744,6 +2783,19 @@
"node": ">= 4"
}
},
"node_modules/image-size": {
"version": "0.5.5",
"resolved": "https://registry.npmjs.org/image-size/-/image-size-0.5.5.tgz",
"integrity": "sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==",
"dev": true,
"optional": true,
"bin": {
"image-size": "bin/image-size.js"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/immediate": {
"version": "3.0.6",
"license": "MIT"
@@ -2751,7 +2803,9 @@
"node_modules/immutable": {
"version": "4.3.5",
"dev": true,
"license": "MIT"
"license": "MIT",
"optional": true,
"peer": true
},
"node_modules/import-fresh": {
"version": "3.3.0",
@@ -2813,6 +2867,12 @@
"dev": true,
"license": "MIT"
},
"node_modules/is-what": {
"version": "3.14.1",
"resolved": "https://registry.npmjs.org/is-what/-/is-what-3.14.1.tgz",
"integrity": "sha512-sNxgpk9793nzSs7bA6JQJGeIuRBQhAaNGG77kzYQgMkrID+lS6SlK07K5LaptscDlSaIgH+GPFzf+d75FVxozA==",
"dev": true
},
"node_modules/isexe": {
"version": "2.0.0",
"dev": true,
@@ -2948,6 +3008,32 @@
"dev": true,
"license": "MIT"
},
"node_modules/less": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/less/-/less-4.2.0.tgz",
"integrity": "sha512-P3b3HJDBtSzsXUl0im2L7gTO5Ubg8mEN6G8qoTS77iXxXX4Hvu4Qj540PZDvQ8V6DmX6iXo98k7Md0Cm1PrLaA==",
"dev": true,
"dependencies": {
"copy-anything": "^2.0.1",
"parse-node-version": "^1.0.1",
"tslib": "^2.3.0"
},
"bin": {
"lessc": "bin/lessc"
},
"engines": {
"node": ">=6"
},
"optionalDependencies": {
"errno": "^0.1.1",
"graceful-fs": "^4.1.2",
"image-size": "~0.5.0",
"make-dir": "^2.1.0",
"mime": "^1.4.1",
"needle": "^3.1.0",
"source-map": "~0.6.0"
}
},
"node_modules/levn": {
"version": "0.4.1",
"resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz",
@@ -3054,6 +3140,30 @@
"@jridgewell/sourcemap-codec": "^1.5.0"
}
},
"node_modules/make-dir": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
"integrity": "sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==",
"dev": true,
"optional": true,
"dependencies": {
"pify": "^4.0.1",
"semver": "^5.6.0"
},
"engines": {
"node": ">=6"
}
},
"node_modules/make-dir/node_modules/semver": {
"version": "5.7.2",
"resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
"integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
"dev": true,
"optional": true,
"bin": {
"semver": "bin/semver"
}
},
"node_modules/match-sorter": {
"version": "6.3.4",
"license": "MIT",
@@ -3082,6 +3192,19 @@
"node": ">=8.6"
}
},
"node_modules/mime": {
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
"integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
"dev": true,
"optional": true,
"bin": {
"mime": "cli.js"
},
"engines": {
"node": ">=4"
}
},
"node_modules/mime-db": {
"version": "1.52.0",
"license": "MIT",
@@ -3167,6 +3290,23 @@
"integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==",
"dev": true
},
"node_modules/needle": {
"version": "3.3.1",
"resolved": "https://registry.npmjs.org/needle/-/needle-3.3.1.tgz",
"integrity": "sha512-6k0YULvhpw+RoLNiQCRKOl09Rv1dPLr8hHnVjHqdolKwDrdNyk+Hmrthi4lIGPPz3r39dLx0hsF5s40sZ3Us4Q==",
"dev": true,
"optional": true,
"dependencies": {
"iconv-lite": "^0.6.3",
"sax": "^1.2.4"
},
"bin": {
"needle": "bin/needle"
},
"engines": {
"node": ">= 4.4.x"
}
},
"node_modules/no-case": {
"version": "3.0.4",
"dev": true,
@@ -3179,7 +3319,9 @@
"node_modules/node-addon-api": {
"version": "7.1.1",
"dev": true,
"license": "MIT"
"license": "MIT",
"optional": true,
"peer": true
},
"node_modules/node-releases": {
"version": "2.0.18",
@@ -3278,6 +3420,15 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/parse-node-version": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/parse-node-version/-/parse-node-version-1.0.1.tgz",
"integrity": "sha512-3YHlOa/JgH6Mnpr05jP9eDG254US9ek25LyIxZlDItp2iJtwyaXQb57lBYLdT3MowkUFYEV2XXNAYIPlESvJlA==",
"dev": true,
"engines": {
"node": ">= 0.10"
}
},
"node_modules/parse5": {
"version": "7.1.2",
"dev": true,
@@ -3335,6 +3486,16 @@
"url": "https://github.com/sponsors/jonschlinkert"
}
},
"node_modules/pify": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/pify/-/pify-4.0.1.tgz",
"integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==",
"dev": true,
"optional": true,
"engines": {
"node": ">=6"
}
},
"node_modules/pkg-types": {
"version": "1.2.1",
"dev": true,
@@ -3424,6 +3585,13 @@
"version": "1.1.0",
"license": "MIT"
},
"node_modules/prr": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/prr/-/prr-1.0.1.tgz",
"integrity": "sha512-yPw4Sng1gWghHQWj0B3ZggWUm4qVbPwPFcRG8KyxiU7J2OHFSoEHKS+EZ3fv5l1t9CyCiop6l/ZYeWbrgoQejw==",
"dev": true,
"optional": true
},
"node_modules/psl": {
"version": "1.9.0",
"dev": true,
@@ -4076,6 +4244,8 @@
"version": "4.0.2",
"dev": true,
"license": "MIT",
"optional": true,
"peer": true,
"engines": {
"node": ">= 14.16.0"
},
@@ -4188,6 +4358,8 @@
"version": "1.79.5",
"dev": true,
"license": "MIT",
"optional": true,
"peer": true,
"dependencies": {
"@parcel/watcher": "^2.4.1",
"chokidar": "^4.0.0",
@@ -4201,6 +4373,13 @@
"node": ">=14.0.0"
}
},
"node_modules/sax": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/sax/-/sax-1.4.1.tgz",
"integrity": "sha512-+aWOz7yVScEGoKNd4PA10LZ8sk0A/z5+nXQG5giUO5rprX9jgYsTdov9qCchZiPIZezbZH+jRut8nPodFAX4Jg==",
"dev": true,
"optional": true
},
"node_modules/saxes": {
"version": "6.0.0",
"dev": true,
@@ -4273,6 +4452,16 @@
"tslib": "^2.0.3"
}
},
"node_modules/source-map": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
"dev": true,
"optional": true,
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/source-map-js": {
"version": "1.2.1",
"dev": true,

2
package.json
View File

@@ -68,8 +68,8 @@
"eslint-plugin-react-refresh": "^0.4.12",
"globals": "^15.11.0",
"jsdom": "^24.1.3",
"less": "^4.2.0",
"prettier": "^3.3.3",
"sass": "^1.79.5",
"typescript": "^5.6.3",
"typescript-eslint": "^8.9.0",
"unplugin-auto-import": "^0.18.3",

22
src/assets/css/_mixins.scss
View File

@@ -1,22 +0,0 @@
@mixin keyframes($animationName) {
@-webkit-keyframes #{$animationName} {
@content
}
@-moz-keyframes #{$animationName} {
@content
}
@-o-keyframes #{$animationName} {
@content
}
@keyframes #{$animationName} {
@content
}
}
@mixin unique-keyframes {
$animationName: unique-id();
animation-name: $animationName;
@include keyframes($animationName) {
@content
}
}

0
src/assets/css/base.scss → src/assets/css/base.less
View File

8
src/assets/css/common.scss → src/assets/css/common.less
View File

@@ -1,4 +1,4 @@
@use '@/assets/css/constants' as constants;
@import '@/assets/css/constants';
#root {
height: 100vh;
@@ -6,8 +6,8 @@
}
.body {
background-color: constants.$background-color;
color: constants.$font-main-color;
background-color: @background-color;
color: @font-main-color;
user-select: none;
min-width: 900px;
min-height: 400px;
@@ -27,7 +27,7 @@
}
.background-origin {
background-color: constants.$origin-color;
background-color: @origin-color;
}
.center-box {

4
src/assets/css/components/common/card.scss → src/assets/css/components/common/card.less
View File

@@ -1,7 +1,7 @@
@use '@/assets/css/constants' as constants;
@import '@/assets/css/constants';
.card-box {
background-color: constants.$origin-color;
background-color: @origin-color;
border-radius: 8px;
overflow: hidden;
box-shadow: 5px 5px 15px 0 rgba(0,0,0,0.1);

2
src/assets/css/components/common/fit-center.scss → src/assets/css/components/common/fit-center.less
View File

@@ -4,4 +4,4 @@
align-items: center;
width: 100%;
height: 100%;
}
}

2
src/assets/css/components/common/fit-fullscreen.scss → src/assets/css/components/common/fit-fullscreen.less
View File

@@ -2,4 +2,4 @@
position: relative;
width: 100%;
height: 100vh;
}
}

2
src/assets/css/components/common/flex-box.scss → src/assets/css/components/common/flex-box.less
View File

@@ -2,4 +2,4 @@
> * {
flex: 1;
}
}
}

2
src/assets/css/components/common/fullscreen-loading-mask.scss → src/assets/css/components/common/fullscreen-loading-mask.less
View File

@@ -7,4 +7,4 @@
height: 100%;
z-index: 100;
background-color: rgba(200, 200, 200, 0.2);
}
}

12
src/assets/css/components/common/hide-scrollbar.scss → src/assets/css/components/common/hide-scrollbar.less
View File

@@ -1,5 +1,5 @@
@use '@/assets/css/constants' as constants;
@use '@/assets/css/mixins' as mixins;
@import "@/assets/css/constants";
@import "@/assets/css/mixins";
.hide-scrollbar-mask {
position: relative;
@@ -41,12 +41,12 @@
width: 100%;
height: 100%;
border-radius: 8px;
background-color: constants.$font-secondary-color;
background-color: @font-secondary-color;
transition: background-color .2s;
}
:hover {
background-color: constants.$font-main-color;
background-color: @font-main-color;
}
}
@@ -55,14 +55,14 @@
opacity: 0;
animation: 0.4s linear;
@include mixins.unique-keyframes {
.keyframes(m7t06K, {
0% {
opacity: 0.5;
}
100% {
opacity: 0;
}
}
});
}
}

12
src/assets/css/components/common/indicator.scss → src/assets/css/components/common/indicator.less
View File

@@ -1,4 +1,4 @@
@use '@/assets/css/constants' as constants;
@import '@/assets/css/constants';
.dot-list {
display: flex;
@@ -15,20 +15,16 @@
width: 10px;
height: 10px;
border-radius: 50%;
border: {
width: 2px;
color: constants.$font-secondary-color;
style: solid;
};
border: 2px solid @font-secondary-color;
transition: all .2s;
}
:hover {
background-color: constants.$focus-color;
background-color: @focus-color;
}
}
.active > * {
background-color: constants.$font-secondary-color !important;
background-color: @font-secondary-color !important;
}
}

2
src/assets/css/components/common/loading-mask.scss → src/assets/css/components/common/loading-mask.less
View File

@@ -5,4 +5,4 @@
width: 100%;
height: 100%;
z-index: 100;
}
}

80
src/assets/css/components/common/sidebar.scss → src/assets/css/components/common/sidebar.less
View File

@@ -1,5 +1,5 @@
@use "@/assets/css/constants" as constants;
@use "@/assets/css/mixins" as mixins;
@import "@/assets/css/constants";
@import "@/assets/css/mixins";
.sidebar {
display: flex;
@@ -14,7 +14,7 @@
align-items: center;
font-weight: bold;
padding: 10px 14px;
color: constants.$main-color;
color: @main-color;
overflow: hidden;
.icon-box {
@@ -24,7 +24,7 @@
padding: 10px;
width: 40px;
height: 40px;
font-size: constants.$SIZE_ICON_SM;
font-size: @SIZE_ICON_SM;
border-radius: 8px;
cursor: pointer;
@@ -34,7 +34,7 @@
}
&:hover {
background-color: constants.$background-color;
background-color: @background-color;
}
}
@@ -79,7 +79,7 @@
padding: 0 10px;
width: 40px;
height: 40px;
font-size: constants.$SIZE_ICON_SM;
font-size: @SIZE_ICON_SM;
cursor: pointer;
img {
@@ -93,7 +93,7 @@
height: 100%;
width: 100%;
transition: all 0.2s;
background-color: constants.$origin-color;
background-color: @origin-color;
.text {
flex: 1;
@@ -104,11 +104,11 @@
}
&.active {
color: constants.$origin-color;
background-color: constants.$main-color;
color: @origin-color;
background-color: @main-color;
img {
filter: drop-shadow(1000px 0 0 constants.$origin-color);
filter: drop-shadow(1000px 0 0 @origin-color);
transform: translate(-1000px);
}
}
@@ -121,7 +121,7 @@
padding-left: 10px;
z-index: 10000;
animation: 0.1s ease forwards;
@include mixins.unique-keyframes {
.keyframes(XxrGiu, {
0% {
transform: translateX(0);
opacity: 1;
@@ -130,16 +130,16 @@
transform: translateX(-10px);
opacity: 0;
}
}
});
.content {
display: flex;
flex-direction: column;
gap: 2px;
padding: 10px 10px;
background-color: constants.$origin-color;
background-color: @origin-color;
border-radius: 8px;
box-shadow: 2px 2px 10px 0 rgba(0,0,0,0.1);
box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.1);
.item {
border-radius: 8px;
@@ -157,13 +157,13 @@
}
&.active {
color: constants.$origin-color;
background-color: constants.$main-color;
color: @origin-color;
background-color: @main-color;
}
}
&:hover a:not(.active) {
background-color: constants.$background-color;
background-color: @background-color;
}
}
}
@@ -172,14 +172,14 @@
&:hover {
> .menu-bt {
a:not(.active) {
background-color: constants.$background-color;
background-color: @background-color;
}
}
.submenu {
visibility: visible;
animation: 0.3s ease;
@include mixins.unique-keyframes {
.keyframes(f6yTZM, {
0% {
transform: translateX(-10px);
opacity: 0;
@@ -188,7 +188,7 @@
transform: translateX(0);
opacity: 1;
}
}
});
}
}
}
@@ -196,12 +196,8 @@
.delete {
.menu-bt {
border: {
width: 1px;
color: constants.$error-secondary-color;
style: dashed;
};
filter: drop-shadow(1000px 0 0 constants.$error-secondary-color);
border: 1px dashed @error-secondary-color;
filter: drop-shadow(1000px 0 0 @error-secondary-color);
transform: translate(-1000px);
> a {
@@ -215,11 +211,7 @@
.separate {
height: 0;
margin: 10px 5px;
border: {
width: 1px;
color: constants.$font-secondary-color;
style: solid;
};
border: 1px solid @font-secondary-color;
opacity: 0.4;
}
@@ -228,7 +220,7 @@
align-items: center;
font-weight: bold;
padding: 8px 14px;
color: constants.$main-color;
color: @main-color;
.icon-user {
display: flex;
@@ -238,9 +230,9 @@
margin-left: 4px;
width: 36px;
height: 36px;
font-size: constants.$SIZE_ICON_XS;
border: 2px constants.$font-secondary-color solid;
color: constants.$font-secondary-color;
font-size: @SIZE_ICON_XS;
border: 2px @font-secondary-color solid;
color: @font-secondary-color;
border-radius: 50%;
overflow: hidden;
cursor: pointer;
@@ -255,26 +247,26 @@
flex: 1;
padding-left: 10px;
font-size: 1.4em;
color: constants.$font-main-color;
color: @font-main-color;
user-select: text;
overflow: hidden;
text-overflow: ellipsis;
a {
color: constants.$main-color;
color: @main-color;
text-decoration: underline;
}
}
.icon-exit {
font-size: constants.$SIZE_ICON_XS;
color: constants.$error-color;
font-size: @SIZE_ICON_XS;
color: @error-color;
padding: 6px 10px;
cursor: pointer;
&:hover {
border-radius: 8px;
background-color: constants.$background-color;
background-color: @background-color;
}
}
}
@@ -327,14 +319,14 @@
.content {
padding: 8px;
border-radius: 8px;
background-color: constants.$origin-color;
background-color: @origin-color;
.icon-exit {
padding: 4px 8px;
&:hover {
border-radius: 8px;
background-color: constants.$background-color;
background-color: @background-color;
}
}
}
@@ -347,7 +339,7 @@
&:hover .submenu-exit {
display: block;
animation: 0.3s ease;
@include mixins.unique-keyframes {
.keyframes(mfdCZC, {
0% {
transform: translateX(-10px);
opacity: 0;
@@ -356,7 +348,7 @@
transform: translateX(0);
opacity: 1;
}
}
});
}
}
}

6
src/assets/css/components/common/url-card.scss → src/assets/css/components/common/url-card.less
View File

@@ -1,4 +1,4 @@
@use '@/assets/css/constants' as constants;
@import "@/assets/css/constants";
[data-component=component-url-card] {
cursor: pointer;
@@ -16,8 +16,8 @@
}
.icon {
color: constants.$production-color;
font-size: constants.$SIZE_ICON_XL;
color: @production-color;
font-size: @SIZE_ICON_XL;
}
.text {

0
src/assets/css/components/dnd/drag-handle.scss → src/assets/css/components/dnd/drag-handle.less
View File

22
src/assets/css/components/dnd/drop-mask.less Normal file
View File

@@ -0,0 +1,22 @@
@import "@/assets/css/constants";
[data-component=component-drop-mask] {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
padding: 0 10px 10px;
background-color: @origin-color;
.drop-mask-border {
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;
}
}

30
src/assets/css/components/dnd/drop-mask.scss
View File

@@ -1,30 +0,0 @@
@use "@/assets/css/constants" as constants;
[data-component=component-drop-mask] {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
padding: {
left: 10px;
right: 10px;
bottom: 10px;
};
background-color: constants.$origin-color;
.drop-mask-border {
display: flex;
width: 100%;
height: 100%;
justify-content: center;
align-items: center;
border: {
width: 2px;
color: constants.$font-secondary-color;
style: dashed;
radius: 8px;
};
font-size: 1.8em;
}
}

10
src/assets/css/components/system/setting-card.scss → src/assets/css/components/system/setting-card.less
View File

@@ -1,17 +1,17 @@
@use '@/assets/css/constants' as constants;
@import "@/assets/css/constants";
[data-component=component-setting-card] {
.settings-card {
padding: 20px;
gap: 20px;
color: constants.$main-color;
color: @main-color;
> .head {
align-items: center;
gap: 5px;
.icon {
font-size: constants.$SIZE_ICON_MD;
font-size: @SIZE_ICON_MD;
flex: 0 0 auto;
}
@@ -22,11 +22,11 @@
:nth-child(n+3) {
flex: 0 0 auto;
color: constants.$font-main-color;
color: @font-main-color;
}
.bt-save {
color: constants.$main-color;
color: @main-color;
}
}
}

12
src/assets/css/components/system/statistics-card.scss → src/assets/css/components/system/statistics-card.less
View File

@@ -1,4 +1,4 @@
@use '@/assets/css/constants' as constants;
@import "@/assets/css/constants";
[data-component=component-statistics-card] {
.statistics-card {
@@ -8,10 +8,10 @@
> .head {
align-items: center;
gap: 5px;
color: constants.$main-color;
color: @main-color;
.icon {
font-size: constants.$SIZE_ICON_MD;
font-size: @SIZE_ICON_MD;
flex: 0 0 auto;
}
@@ -22,7 +22,7 @@
:nth-child(n+3) {
flex: 0 0 auto;
color: constants.$font-main-color;
color: @font-main-color;
}
}
@@ -33,11 +33,11 @@
.key, .value-percent {
flex: 0 0 auto;
color: constants.$font-main-color;
color: @font-main-color;
}
.value {
color: constants.$font-secondary-color;
color: @font-secondary-color;
overflow: hidden;
> * {

6
src/assets/css/components/tools/load-more-card.scss → src/assets/css/components/tools/load-more-card.less
View File

@@ -1,4 +1,4 @@
@use '@/assets/css/constants' as constants;
@import "@/assets/css/constants";
[data-component=component-load-more-card] {
cursor: pointer;
@@ -11,8 +11,8 @@
.icon {
display: flex;
font-size: constants.$SIZE_ICON_XXL;
color: constants.$production-color;
font-size: @SIZE_ICON_XXL;
color: @production-color;
align-items: center;
transform: translateY(-20px);
}

8
src/assets/css/components/tools/repository-card.scss → src/assets/css/components/tools/repository-card.less
View File

@@ -1,4 +1,4 @@
@use '@/assets/css/constants' as constants;
@import "@/assets/css/constants";
[data-component=component-repository-card] {
height: 100%;
@@ -34,12 +34,12 @@
display: flex;
padding-top: 10px;
padding-bottom: 20px;
color: constants.$production-color;
font-size: constants.$SIZE_ICON_XL;
color: @production-color;
font-size: @SIZE_ICON_XL;
justify-content: center;
img {
width: constants.$SIZE_ICON_XL;
width: @SIZE_ICON_XL;
}
}

18
src/assets/css/components/tools/store-card.scss → src/assets/css/components/tools/store-card.less
View File

@@ -1,4 +1,4 @@
@use '@/assets/css/constants' as constants;
@import "@/assets/css/constants";
[data-component=component-store-card] {
height: 100%;
@@ -35,7 +35,7 @@
z-index: 100;
> *:hover {
color: constants.$font-secondary-color;
color: @font-secondary-color;
}
}
}
@@ -44,12 +44,12 @@
display: flex;
padding-top: 10px;
padding-bottom: 20px;
color: constants.$production-color;
font-size: constants.$SIZE_ICON_XL;
color: @production-color;
font-size: @SIZE_ICON_XL;
justify-content: center;
img {
width: constants.$SIZE_ICON_XL;
width: @SIZE_ICON_XL;
}
}
@@ -62,12 +62,8 @@
}
.tool-desc {
margin: {
top: 10px;
left: auto;
right: auto;
};
color: constants.$font-secondary-color;
margin: 10px auto 0;
color: @font-secondary-color;
overflow: hidden;
text-overflow: ellipsis;
max-height: 40px;

22
src/assets/css/constants.less Normal file
View File

@@ -0,0 +1,22 @@
@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;

22
src/assets/css/constants.scss
View File

@@ -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;

15
src/assets/css/mixins.less Normal file
View File

@@ -0,0 +1,15 @@
.keyframes(@animationName, @content) {
animation-name: @animationName;
@-webkit-keyframes @animationName {
@content();
}
@-moz-keyframes @animationName {
@content();
}
@-o-keyframes @animationName {
@content();
}
@keyframes @animationName {
@content();
}
}

15
src/assets/css/pages/sign.scss → src/assets/css/pages/sign.less
View File

@@ -1,5 +1,4 @@
@use "@/assets/css/mixins" as mixins;
@use "@/assets/css/constants" as constants;
@import "@/assets/css/constants";
[data-component=sign] {
background-color: #D2D0DD;
@@ -10,12 +9,12 @@
}
a:hover {
color: constants.$production-color;
color: @production-color;
}
.sign-box {
position: relative;
background-color: constants.$origin-color;
background-color: @origin-color;
width: 900px;
height: 600px;
overflow: hidden;
@@ -42,7 +41,7 @@
.primary {
font-size: 2.4em;
font-weight: bolder;
color: constants.$production-color;
color: @production-color;
}
.secondary {
@@ -71,7 +70,7 @@
text-align: center;
a {
color: constants.$production-color;
color: @production-color;
}
}
}
@@ -79,7 +78,7 @@
.verify {
a {
color: constants.$production-color;
color: @production-color;
font-weight: bolder;
}
}
@@ -120,7 +119,7 @@
position: absolute;
width: 128px;
height: 128px;
background-color: constants.$production-color;
background-color: @production-color;
border-radius: 50%;
bottom: 0;
left: 50%;

13
src/assets/css/pages/system-framework.less Normal file
View File

@@ -0,0 +1,13 @@
@import "@/assets/css/constants";
[data-component=system-framework] {
.left-panel {
background-color: @origin-color;
}
.right-panel {
flex: 1;
width: 0;
background-color: @background-color;
}
}

14
src/assets/css/pages/system-framework.scss
View File

@@ -1,14 +0,0 @@
@use "@/assets/css/constants" as constants;
@use "@/assets/css/mixins" as mixins;
[data-component=system-framework] {
.left-panel {
background-color: constants.$origin-color;
}
.right-panel {
flex: 1;
width: 0;
background-color: constants.$background-color;
}
}

2
src/assets/css/pages/system/index.scss → src/assets/css/pages/system/index.less
View File

@@ -1,5 +1,3 @@
@use '@/assets/css/constants' as constants;
[data-component=system] {
.root-content {
padding: 20px;

2
src/assets/css/pages/system/settings.scss → src/assets/css/pages/system/settings.less
View File

@@ -1,5 +1,3 @@
@use '@/assets/css/constants' as constants;
[data-component=system-settings] {
.root-content {
padding: 20px;

2
src/assets/css/pages/system/statistics.scss → src/assets/css/pages/system/statistics.less
View File

@@ -1,5 +1,3 @@
@use '@/assets/css/constants' as constants;
[data-component=system-statistics] {
.root-content {
padding: 20px;

6
src/assets/css/pages/system/tools/base.scss → src/assets/css/pages/system/tools/base.less
View File

@@ -1,4 +1,4 @@
@use '@/assets/css/constants' as constants;
@import "@/assets/css/constants";
[data-component=system-tools-base] {
.root-content {
@@ -9,7 +9,7 @@
.has-edited::after {
content: '*';
color: constants.$font-secondary-color;
color: @font-secondary-color;
}
>*:first-child {
@@ -30,7 +30,7 @@
position: absolute;
top: 10px;
right: 10px;
background-color: constants.$font-secondary-color;
background-color: @font-secondary-color;
width: 32px;
height: 32px;
border-radius: 50%;

0
src/assets/css/pages/system/tools/code.scss → src/assets/css/pages/system/tools/code.less
View File

0
src/assets/css/pages/system/tools/execute.scss → src/assets/css/pages/system/tools/execute.less
View File

6
src/assets/css/pages/system/tools/template.scss → src/assets/css/pages/system/tools/template.less
View File

@@ -1,4 +1,4 @@
@use '@/assets/css/constants' as constants;
@import "@/assets/css/constants";
[data-component=system-tools-template] {
.root-content {
@@ -9,7 +9,7 @@
.has-edited::after {
content: '*';
color: constants.$font-secondary-color;
color: @font-secondary-color;
}
>*:first-child {
@@ -30,7 +30,7 @@
position: absolute;
top: 10px;
right: 10px;
background-color: constants.$font-secondary-color;
background-color: @font-secondary-color;
width: 32px;
height: 32px;
border-radius: 50%;

7
src/assets/css/pages/tools-framework.scss → src/assets/css/pages/tools-framework.less
View File

@@ -1,9 +1,8 @@
@use "@/assets/css/constants" as constants;
@use "@/assets/css/mixins" as mixins;
@import "@/assets/css/constants";
[data-component=tools-framework] {
.left-panel {
background-color: constants.$origin-color;
background-color: @origin-color;
.menu-droppable {
display: flex;
@@ -17,6 +16,6 @@
.right-panel {
flex: 1;
width: 0;
background-color: constants.$background-color;
background-color: @background-color;
}
}

9
src/assets/css/pages/tools/create.scss → src/assets/css/pages/tools/create.less
View File

@@ -1,5 +1,4 @@
@use "@/assets/css/mixins" as mixins;
@use "@/assets/css/constants" as constants;
@import "@/assets/css/constants";
[data-component=tools-create] {
.root-content {
@@ -22,7 +21,7 @@
justify-content: center;
align-items: center;
font-size: 1.6em;
color: constants.$production-color;
color: @production-color;
font-weight: bolder;
}
}
@@ -33,7 +32,7 @@
.help {
margin-left: 6px;
color: constants.$font-main-color;
color: @font-main-color;
font-size: 0.8em;
}
@@ -52,7 +51,7 @@
.no-preview {
font-weight: bolder;
color: constants.$font-secondary-color;
color: @font-secondary-color;
font-size: 1.4em;
}
}

0
src/assets/css/pages/tools/edit.scss → src/assets/css/pages/tools/edit.less
View File

11
src/assets/css/pages/tools/index.scss → src/assets/css/pages/tools/index.less
View File

@@ -1,5 +1,4 @@
@use "@/assets/css/mixins" as mixins;
@use '@/assets/css/constants' as constants;
@import "@/assets/css/constants";
[data-component=tools] {
.root-content {
@@ -81,17 +80,13 @@
:first-child, :last-child {
height: 0;
border: {
width: 1px;
color: constants.$divide-color;
style: dashed;
};
border: 1px dashed @divide-color;
}
.divider-text {
flex: 0 0 auto;
font-size: 1.2em;
color: constants.$font-secondary-color;
color: @font-secondary-color;
}
}

0
src/assets/css/pages/tools/source.scss → src/assets/css/pages/tools/source.less
View File

4
src/assets/css/pages/tools/store.scss → src/assets/css/pages/tools/store.less
View File

@@ -1,4 +1,4 @@
@use '@/assets/css/constants' as constants;
@import "@/assets/css/constants";
[data-component=tools-store] {
.search {
@@ -37,7 +37,7 @@
justify-content: center;
font-size: 1.4em;
font-weight: bolder;
color: constants.$font-secondary-color;
color: @font-secondary-color;
}
}

18
src/assets/css/pages/tools/user.scss → src/assets/css/pages/tools/user.less
View File

@@ -1,12 +1,7 @@
@use '@/assets/css/constants' as constants;
@import "@/assets/css/constants";
[data-component=tools-store-user] .root-content {
padding: {
top: 80px;
left: 20px;
right: 20px;
bottom: 20px;
};
padding: 80px 20px 20px 20px;
.root-box {
width: 100%;
@@ -36,10 +31,7 @@
}
.info-name {
margin: {
top: 20px;
left: 24px;
};
margin: 20px 0 0 24px;
justify-content: center;
> * {
@@ -49,7 +41,7 @@
.nickname {
font-size: 2.4em;
font-weight: bolder;
color: constants.$production-color;
color: @production-color;
}
.url {
@@ -80,7 +72,7 @@
margin-bottom: 20px;
font-size: 1.2em;
font-weight: bolder;
color: constants.$font-secondary-color;
color: @font-secondary-color;
}
}
}

0
src/assets/css/pages/tools/view.scss → src/assets/css/pages/tools/view.less
View File

13
src/assets/css/pages/user-framework.less Normal file
View File

@@ -0,0 +1,13 @@
@import "@/assets/css/constants";
[data-component=user-framework] {
.left-panel {
background-color: @origin-color;
}
.right-panel {
flex: 1;
width: 0;
background-color: @background-color;
}
}

14
src/assets/css/pages/user-framework.scss
View File

@@ -1,14 +0,0 @@
@use "@/assets/css/constants" as constants;
@use "@/assets/css/mixins" as mixins;
[data-component=user-framework] {
.left-panel {
background-color: constants.$origin-color;
}
.right-panel {
flex: 1;
width: 0;
background-color: constants.$background-color;
}
}

39
src/assets/css/pages/user/index.scss → src/assets/css/pages/user/index.less
View File

@@ -1,12 +1,7 @@
@use '@/assets/css/constants' as constants;
@import "@/assets/css/constants";
[data-component=user] .root-content {
padding: {
top: 80px;
left: 20px;
right: 20px;
bottom: 20px;
};
padding: 80px 20px 20px 20px;
.card-box {
width: 100%;
@@ -17,20 +12,14 @@
padding-bottom: 20px;
> :not(:first-child) {
padding: {
left: 60px;
right: 60px;
};
padding: 0 60px;
}
.divide {
height: 1px;
width: calc(100% - 120px);
background-color: constants.$divide-color;
margin: {
left: 60px;
right: 60px;
};
background-color: @divide-color;
margin: 0 60px;
}
.info {
@@ -53,10 +42,7 @@
}
.info-name {
margin: {
top: 20px;
left: 24px;
};
margin: 20px 0 0 24px;
justify-content: center;
> * {
@@ -66,7 +52,7 @@
.nickname {
font-size: 2.4em;
font-weight: bolder;
color: constants.$production-color;
color: @production-color;
}
.url {
@@ -83,9 +69,7 @@
align-items: center;
.content {
padding: {
bottom: 30px;
};
padding-bottom: 30px;
justify-content: space-between;
align-items: center;
width: 100%;
@@ -107,11 +91,8 @@
.table {
gap: 24px;
padding: {
top: 30px;
bottom: 20px;
};
padding-top: 30px;
padding-bottom: 20px;
.row {
> * {

43
src/components/Playground/CodeEditor/Editor/editor.scss → src/components/Playground/CodeEditor/Editor/editor.less
View File

@@ -1,23 +1,16 @@
@mixin keyframes($animationName) {
@-webkit-keyframes #{$animationName} {
@content
.keyframes(@animationName, @content) {
animation-name: @animationName;
@-webkit-keyframes @animationName {
@content();
}
@-moz-keyframes #{$animationName} {
@content
@-moz-keyframes @animationName {
@content();
}
@-o-keyframes #{$animationName} {
@content
@-o-keyframes @animationName {
@content();
}
@keyframes #{$animationName} {
@content
}
}
@mixin unique-keyframes {
$animationName: unique-id();
animation-name: $animationName;
@include keyframes($animationName) {
@content
@keyframes @animationName {
@content();
}
}
@@ -77,15 +70,13 @@
width: 10px;
height: 10px;
border-radius: 50%;
border: {
top: 2px #666 solid;
bottom: 2px #ddd solid;
left: 2px #ddd solid;
right: 2px #ddd solid;
};
border-top: 2px #666 solid;
border-right: 2px #ddd solid;
border-bottom: 2px #ddd solid;
border-left: 2px #ddd solid;
animation: .6s linear infinite;
@include unique-keyframes {
.keyframes(fUHD7o, {
0% {
transform: rotateZ(0);
}
@@ -93,6 +84,6 @@
100% {
transform: rotateZ(360deg);
}
}
});
}
}
}

2
src/components/Playground/CodeEditor/Editor/index.tsx
View File

@@ -1,6 +1,6 @@
import { editor, Selection } from 'monaco-editor'
import MonacoEditor, { Monaco } from '@monaco-editor/react'
import '@/components/Playground/CodeEditor/Editor/editor.scss'
import '@/components/Playground/CodeEditor/Editor/editor.less'
import '@/components/Playground/CodeEditor/Editor/loader'
import { IEditorOptions, IFiles, ITheme, ITsconfig } from '@/components/Playground/shared'
import { fileNameToLanguage, tsconfigJsonDiagnosticsOptions } from '@/components/Playground/files'

0
src/components/Playground/CodeEditor/FileSelector/file-selector.scss → src/components/Playground/CodeEditor/FileSelector/file-selector.less
View File

2
src/components/Playground/CodeEditor/FileSelector/index.tsx
View File

@@ -1,4 +1,4 @@
import '@/components/Playground/CodeEditor/FileSelector/file-selector.scss'
import '@/components/Playground/CodeEditor/FileSelector/file-selector.less'
import HideScrollbar, { HideScrollbarElement } from '@/components/common/HideScrollbar'
import FlexBox from '@/components/common/FlexBox'
import { IFiles } from '@/components/Playground/shared'

0
src/components/Playground/CodeEditor/code-editor.scss → src/components/Playground/CodeEditor/code-editor.less
View File

2
src/components/Playground/CodeEditor/index.tsx
View File

@@ -1,5 +1,5 @@
import _ from 'lodash'
import '@/components/Playground/CodeEditor/code-editor.scss'
import '@/components/Playground/CodeEditor/code-editor.less'
import FlexBox from '@/components/common/FlexBox'
import { IEditorOptions, IFiles, ITheme, ITsconfig } from '@/components/Playground/shared'
import {

2
src/components/Playground/Output/Preview/Render.tsx
View File

@@ -1,5 +1,5 @@
import { ChangeEvent } from 'react'
import '@/components/Playground/Output/Preview/render.scss'
import '@/components/Playground/Output/Preview/render.less'
import { COLOR_FONT_MAIN } from '@/constants/common.constants'
import iframeRaw from '@/components/Playground/Output/Preview/iframe.html?raw'
import HideScrollbar from '@/components/common/HideScrollbar'

2
src/components/Playground/Output/Preview/index.tsx
View File

@@ -1,4 +1,4 @@
import '@/components/Playground/Output/Preview/preview.scss'
import '@/components/Playground/Output/Preview/preview.less'
import { IFiles, IImportMap } from '@/components/Playground/shared'
import Compiler from '@/components/Playground/compiler'
import Render from '@/components/Playground/Output/Preview/Render'

0
src/components/Playground/Output/Preview/preview.scss → src/components/Playground/Output/Preview/preview.less
View File

2
src/components/Playground/Output/Preview/render.scss → src/components/Playground/Output/Preview/render.less
View File

@@ -1,5 +1,3 @@
@use '@/assets/css/constants' as constants;
[data-component=playground-output-preview-render] {
border: none;
height: 100%;

2
src/components/Playground/Output/Transform/index.tsx
View File

@@ -1,6 +1,6 @@
import MonacoEditor from '@monaco-editor/react'
import { Loader } from 'esbuild-wasm'
import '@/components/Playground/Output/Transform/transform.scss'
import '@/components/Playground/Output/Transform/transform.less'
import { IFile, ITheme } from '@/components/Playground/shared'
import { cssToJsFromFile, jsonToJsFromFile } from '@/components/Playground/files'
import Compiler from '@/components/Playground/compiler'

0
src/components/Playground/Output/Transform/transform.scss → src/components/Playground/Output/Transform/transform.less
View File

2
src/components/Playground/index.tsx
View File

@@ -1,4 +1,4 @@
import '@/components/Playground/playground.scss'
import '@/components/Playground/playground.less'
import { IFiles, IImportMap, ITsconfig } from '@/components/Playground/shared'
import {
ENTRY_FILE_NAME,

0
src/components/Playground/playground.scss → src/components/Playground/playground.less
View File

2
src/components/common/Card.tsx
View File

@@ -1,5 +1,5 @@
import { DetailedHTMLProps, HTMLAttributes } from 'react'
import '@/assets/css/components/common/card.scss'
import '@/assets/css/components/common/card.less'
type CardProps = DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>

2
src/components/common/FitCenter.tsx
View File

@@ -1,5 +1,5 @@
import { DetailedHTMLProps, HTMLAttributes } from 'react'
import '@/assets/css/components/common/fit-center.scss'
import '@/assets/css/components/common/fit-center.less'
interface FitCenterProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
vertical?: boolean

2
src/components/common/FitFullscreen.tsx
View File

@@ -1,5 +1,5 @@
import { DetailedHTMLProps, HTMLAttributes } from 'react'
import '@/assets/css/components/common/fit-fullscreen.scss'
import '@/assets/css/components/common/fit-fullscreen.less'
interface FitFullscreenProps
extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> {

2
src/components/common/FlexBox.tsx
View File

@@ -1,5 +1,5 @@
import { DetailedHTMLProps, HTMLAttributes } from 'react'
import '@/assets/css/components/common/flex-box.scss'
import '@/assets/css/components/common/flex-box.less'
interface FlexBoxProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
direction?: 'horizontal' | 'vertical'

2
src/components/common/FullscreenLoadingMask.tsx
View File

@@ -1,5 +1,5 @@
import Icon from '@ant-design/icons'
import '@/assets/css/components/common/fullscreen-loading-mask.scss'
import '@/assets/css/components/common/fullscreen-loading-mask.less'
import { COLOR_FONT_MAIN } from '@/constants/common.constants'
import FitFullscreen from '@/components/common/FitFullscreen'

2
src/components/common/HideScrollbar.tsx
View File

@@ -6,7 +6,7 @@ import {
HTMLAttributes,
UIEvent
} from 'react'
import '@/assets/css/components/common/hide-scrollbar.scss'
import '@/assets/css/components/common/hide-scrollbar.less'
interface HideScrollbarProps
extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> {

2
src/components/common/Indicator.tsx
View File

@@ -1,5 +1,5 @@
import _ from 'lodash'
import '@/assets/css/components/common/indicator.scss'
import '@/assets/css/components/common/indicator.less'
interface IndicatorProps {
total: number

2
src/components/common/LoadingMask.tsx
View File

@@ -1,6 +1,6 @@
import { PropsWithChildren, ReactNode } from 'react'
import Icon from '@ant-design/icons'
import '@/assets/css/components/common/loading-mask.scss'
import '@/assets/css/components/common/loading-mask.less'
import { COLOR_FONT_MAIN } from '@/constants/common.constants'
interface LoadingMaskProps extends PropsWithChildren {

2
src/components/common/Sidebar/index.tsx
View File

@@ -1,6 +1,6 @@
import { PropsWithChildren, ReactNode } from 'react'
import Icon from '@ant-design/icons'
import '@/assets/css/components/common/sidebar.scss'
import '@/assets/css/components/common/sidebar.less'
import { getLocalStorage, setLocalStorage } from '@/util/browser'
import Item from '@/components/common/Sidebar/Item'
import ItemList from '@/components/common/Sidebar/ItemList'

2
src/components/common/UrlCard.tsx
View File

@@ -1,7 +1,7 @@
import { DetailedHTMLProps, HTMLAttributes, ReactNode } from 'react'
import Icon from '@ant-design/icons'
import VanillaTilt, { TiltOptions } from 'vanilla-tilt'
import '@/assets/css/components/common/url-card.scss'
import '@/assets/css/components/common/url-card.less'
import Card from '@/components/common/Card'
import FlexBox from '@/components/common/FlexBox'

2
src/components/dnd/DragHandle.tsx
View File

@@ -1,6 +1,6 @@
import { HandleContextInst } from '@/components/dnd/HandleContext'
import Icon from '@ant-design/icons'
import '@/assets/css/components/dnd/drag-handle.scss'
import '@/assets/css/components/dnd/drag-handle.less'
interface DragHandleProps {
padding?: string | number

2
src/components/dnd/DropMask.tsx
View File

@@ -1,4 +1,4 @@
import '@/assets/css/components/dnd/drop-mask.scss'
import '@/assets/css/components/dnd/drop-mask.less'
import Icon from '@ant-design/icons'
const DropMask = () => {

2
src/components/system/SettingCard.tsx
View File

@@ -1,6 +1,6 @@
import { PropsWithChildren, ReactNode } from 'react'
import Icon from '@ant-design/icons'
import '@/assets/css/components/system/setting-card.scss'
import '@/assets/css/components/system/setting-card.less'
import Card from '@/components/common/Card'
import FlexBox from '@/components/common/FlexBox'
import Permission from '@/components/common/Permission'

2
src/components/system/StatisticsCard.tsx
View File

@@ -1,6 +1,6 @@
import { PropsWithChildren, ReactNode } from 'react'
import Icon from '@ant-design/icons'
import '@/assets/css/components/system/statistics-card.scss'
import '@/assets/css/components/system/statistics-card.less'
import Card from '@/components/common/Card'
import FlexBox from '@/components/common/FlexBox'
import LoadingMask from '@/components/common/LoadingMask'

2
src/components/tools/LoadMoreCard.tsx
View File

@@ -1,6 +1,6 @@
import VanillaTilt from 'vanilla-tilt'
import Icon from '@ant-design/icons'
import '@/assets/css/components/tools/load-more-card.scss'
import '@/assets/css/components/tools/load-more-card.less'
import FlexBox from '@/components/common/FlexBox'
import Card from '@/components/common/Card'

3
src/components/tools/RepositoryCard.tsx
View File

@@ -1,6 +1,6 @@
import { DetailedHTMLProps, HTMLAttributes } from 'react'
import VanillaTilt, { TiltOptions } from 'vanilla-tilt'
import '@/assets/css/components/tools/repository-card.scss'
import '@/assets/css/components/tools/repository-card.less'
import Card from '@/components/common/Card'
import FlexBox from '@/components/common/FlexBox'
import Draggable from '@/components/dnd/Draggable'
@@ -24,7 +24,6 @@ interface RepositoryCardProps
const RepositoryCard = ({
style,
// eslint-disable-next-line @typescript-eslint/no-unused-vars
ref,
icon,
toolName,

4
src/components/tools/StoreCard.tsx
View File

@@ -2,7 +2,7 @@ import { DetailedHTMLProps, HTMLAttributes, MouseEvent } from 'react'
import VanillaTilt, { TiltOptions } from 'vanilla-tilt'
import protocolCheck from 'custom-protocol-check'
import Icon from '@ant-design/icons'
import '@/assets/css/components/tools/store-card.scss'
import '@/assets/css/components/tools/store-card.less'
import { COLOR_BACKGROUND, COLOR_MAIN, COLOR_PRODUCTION } from '@/constants/common.constants'
import { checkDesktop, omitText } from '@/util/common'
import { getLoginStatus, getUserId } from '@/util/auth'
@@ -35,7 +35,7 @@ interface StoreCardProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement
const StoreCard = ({
style,
// eslint-disable-next-line @typescript-eslint/no-unused-vars
ref,
icon,
toolName,

4
src/main.tsx
View File

@@ -1,8 +1,8 @@
import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'
import zh_CN from 'antd/locale/zh_CN'
import '@/assets/css/base.scss'
import '@/assets/css/common.scss'
import '@/assets/css/base.less'
import '@/assets/css/common.less'
import { COLOR_MAIN } from '@/constants/common.constants'
import App from './App'

2
src/pages/Sign/index.tsx
View File

@@ -1,4 +1,4 @@
import '@/assets/css/pages/sign.scss'
import '@/assets/css/pages/sign.less'
import FitFullscreen from '@/components/common/FitFullscreen'
import FitCenter from '@/components/common/FitCenter'
import FlexBox from '@/components/common/FlexBox'

2
src/pages/System/Settings/index.tsx
View File

@@ -1,4 +1,4 @@
import '@/assets/css/pages/system/settings.scss'
import '@/assets/css/pages/system/settings.less'
import FitFullscreen from '@/components/common/FitFullscreen'
import HideScrollbar from '@/components/common/HideScrollbar'
import FlexBox from '@/components/common/FlexBox'

2
src/pages/System/Statistics/index.tsx
View File

@@ -1,4 +1,4 @@
import '@/assets/css/pages/system/statistics.scss'
import '@/assets/css/pages/system/statistics.less'
import FlexBox from '@/components/common/FlexBox'
import FitFullscreen from '@/components/common/FitFullscreen'
import HideScrollbar from '@/components/common/HideScrollbar'

2
src/pages/System/Tools/Base.tsx
View File

@@ -1,5 +1,5 @@
import Icon from '@ant-design/icons'
import '@/assets/css/pages/system/tools/base.scss'
import '@/assets/css/pages/system/tools/base.less'
import {
COLOR_PRODUCTION,
DATABASE_DELETE_SUCCESS,

2
src/pages/System/Tools/Code.tsx
View File

@@ -1,6 +1,6 @@
import Draggable from 'react-draggable'
import Icon from '@ant-design/icons'
import '@/assets/css/pages/system/tools/code.scss'
import '@/assets/css/pages/system/tools/code.less'
import { DATABASE_NO_RECORD_FOUND, DATABASE_SELECT_SUCCESS } from '@/constants/common.constants'
import { checkDesktop } from '@/util/common'
import { navigateToExecute, navigateToRepository } from '@/util/navigation'

2
src/pages/System/Tools/Execute.tsx
View File

@@ -1,4 +1,4 @@
import '@/assets/css/pages/system/tools/execute.scss'
import '@/assets/css/pages/system/tools/execute.less'
import { DATABASE_NO_RECORD_FOUND, DATABASE_SELECT_SUCCESS } from '@/constants/common.constants'
import { navigateToTools } from '@/util/navigation'
import { r_sys_tool_get_one } from '@/services/system'

2
src/pages/System/Tools/Template.tsx
View File

@@ -1,5 +1,5 @@
import Icon from '@ant-design/icons'
import '@/assets/css/pages/system/tools/template.scss'
import '@/assets/css/pages/system/tools/template.less'
import {
COLOR_PRODUCTION,
DATABASE_DELETE_SUCCESS,

2
src/pages/System/index.tsx
View File

@@ -1,4 +1,4 @@
import '@/assets/css/pages/system/index.scss'
import '@/assets/css/pages/system/index.less'
import HideScrollbar from '@/components/common/HideScrollbar'
import FitFullscreen from '@/components/common/FitFullscreen'
import FlexBox from '@/components/common/FlexBox'

2
src/pages/SystemFramework.tsx
View File

@@ -1,4 +1,4 @@
import '@/assets/css/pages/system-framework.scss'
import '@/assets/css/pages/system-framework.less'
import { getSystemRouteJson } from '@/router/system'
import FitFullscreen from '@/components/common/FitFullscreen'
import Sidebar from '@/components/common/Sidebar'

2
src/pages/Tools/Create.tsx
View File

@@ -1,5 +1,5 @@
import Icon from '@ant-design/icons'
import '@/assets/css/pages/tools/create.scss'
import '@/assets/css/pages/tools/create.less'
import {
DATABASE_DUPLICATE_KEY,
DATABASE_INSERT_SUCCESS,

2
src/pages/Tools/Edit.tsx
View File

@@ -1,4 +1,4 @@
import '@/assets/css/pages/tools/edit.scss'
import '@/assets/css/pages/tools/edit.less'
import Draggable from 'react-draggable'
import Icon from '@ant-design/icons'
import {

2
src/pages/Tools/Source.tsx
View File

@@ -1,4 +1,4 @@
import '@/assets/css/pages/tools/source.scss'
import '@/assets/css/pages/tools/source.less'
import { DATABASE_NO_RECORD_FOUND, DATABASE_SELECT_SUCCESS } from '@/constants/common.constants'
import { getLoginStatus } from '@/util/auth'
import { navigateToRepository, navigateToSource } from '@/util/navigation'

2
src/pages/Tools/Store.tsx
View File

@@ -1,5 +1,5 @@
import { UIEvent } from 'react'
import '@/assets/css/pages/tools/store.scss'
import '@/assets/css/pages/tools/store.less'
import { DATABASE_SELECT_SUCCESS } from '@/constants/common.constants'
import { checkDesktop } from '@/util/common'
import { r_tool_store_get } from '@/services/tool'

2
src/pages/Tools/User.tsx
View File

@@ -1,5 +1,5 @@
import Icon from '@ant-design/icons'
import '@/assets/css/pages/tools/user.scss'
import '@/assets/css/pages/tools/user.less'
import {
COLOR_BACKGROUND,
DATABASE_NO_RECORD_FOUND,

2
src/pages/Tools/View.tsx
View File

@@ -1,4 +1,4 @@
import '@/assets/css/pages/tools/view.scss'
import '@/assets/css/pages/tools/view.less'
import { DATABASE_NO_RECORD_FOUND, DATABASE_SELECT_SUCCESS } from '@/constants/common.constants'
import { getLoginStatus } from '@/util/auth'
import { navigateToRepository, navigateToRoot, navigateToView } from '@/util/navigation'

2
src/pages/Tools/index.tsx
View File

@@ -1,5 +1,5 @@
import Icon from '@ant-design/icons'
import '@/assets/css/pages/tools/index.scss'
import '@/assets/css/pages/tools/index.less'
import {
DATABASE_DELETE_SUCCESS,
DATABASE_SELECT_SUCCESS,

2
src/pages/ToolsFramework.tsx
View File

@@ -1,7 +1,7 @@
import { DndContext, DragOverEvent, DragStartEvent } from '@dnd-kit/core'
import { arrayMove, SortableContext } from '@dnd-kit/sortable'
import type { DragEndEvent } from '@dnd-kit/core/dist/types'
import '@/assets/css/pages/tools-framework.scss'
import '@/assets/css/pages/tools-framework.less'
import { tools } from '@/router/tools'
import { checkDesktop, getToolMenuItem, saveToolMenuItem } from '@/util/common'
import { getViewPath } from '@/util/navigation'

2
src/pages/User/index.tsx
View File

@@ -1,5 +1,5 @@
import Icon from '@ant-design/icons'
import '@/assets/css/pages/user/index.scss'
import '@/assets/css/pages/user/index.less'
import {
COLOR_BACKGROUND,
COLOR_ERROR,

2
src/pages/UserFramework.tsx
View File

@@ -1,4 +1,4 @@
import '@/assets/css/pages/user-framework.scss'
import '@/assets/css/pages/user-framework.less'
import user from '@/router/user'
import { hasPathPermission } from '@/util/auth'
import FitFullscreen from '@/components/common/FitFullscreen'