Fix saas warnings

Author: MZsocprime

uncoder-os/package.json

@@ -23,49 +23,49 @@
     "simplebar-react": "^3.2.4"
   },
   "devDependencies": {
-    "@babel/core": "^7.23.2",
-    "@babel/eslint-parser": "^7.22.15",
-    "@babel/preset-env": "^7.23.2",
-    "@babel/preset-react": "^7.22.15",
-    "@babel/preset-typescript": "^7.23.2",
-    "@html-eslint/eslint-plugin": "^0.19.1",
-    "@html-eslint/parser": "^0.19.1",
+    "@babel/core": "^7.25.2",
+    "@babel/eslint-parser": "^7.25.1",
+    "@babel/preset-env": "^7.25.4",
+    "@babel/preset-react": "^7.24.7",
+    "@babel/preset-typescript": "^7.24.7",
+    "@html-eslint/eslint-plugin": "^0.27.0",
+    "@html-eslint/parser": "^0.27.0",
     "@svgr/webpack": "^8.1.0",
     "@types/node": "^20",
     "@types/react": "^18",
     "@types/react-dom": "^18",
-    "@typescript-eslint/eslint-plugin": "^6.8.0",
-    "@typescript-eslint/parser": "^6.8.0",
-    "babel-loader": "^9.1.3",
-    "copy-webpack-plugin": "^11.0.0",
+    "@typescript-eslint/eslint-plugin": "^8.7.0",
+    "@typescript-eslint/parser": "^8.7.0",
+    "babel-loader": "^9.2.1",
+    "copy-webpack-plugin": "^12.0.2",
     "cross-env": "^7.0.3",
-    "css-loader": "^6.8.1",
-    "dotenv": "^16.3.1",
-    "dotenv-webpack": "^8.0.1",
-    "eslint": "^8.51.0",
+    "css-loader": "^7.1.2",
+    "dotenv": "^16.4.5",
+    "dotenv-webpack": "^8.1.0",
+    "eslint": "^9.11.1",
     "eslint-config-airbnb": "^19.0.4",
-    "eslint-plugin-html": "^7.1.0",
-    "eslint-plugin-import": "^2.28.1",
-    "eslint-plugin-jsonc": "^2.9.0",
-    "eslint-plugin-local-rules": "^2.0.0",
-    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-html": "^8.1.2",
+    "eslint-plugin-import": "^2.30.0",
+    "eslint-plugin-jsonc": "^2.16.0",
+    "eslint-plugin-local-rules": "^3.0.2",
+    "eslint-plugin-react-hooks": "^4.6.2",
     "file-loader": "^6.2.0",
-    "html-webpack-plugin": "^5.5.3",
-    "mini-css-extract-plugin": "^2.7.6",
-    "node-polyfill-webpack-plugin": "^2.0.1",
-    "postcss": "^8.4.31",
+    "html-webpack-plugin": "^5.6.0",
+    "mini-css-extract-plugin": "^2.9.1",
+    "node-polyfill-webpack-plugin": "^4.0.0",
+    "postcss": "^8.4.47",
     "postcss-inline-base64": "^7.3.1",
-    "postcss-loader": "^7.3.3",
-    "sass": "^1.69.4",
-    "sass-loader": "^13.3.2",
-    "source-map-loader": "^4.0.1",
-    "style-loader": "^3.3.3",
-    "ts-loader": "^9.5.0",
-    "typescript": "^5.2.2",
-    "webpack": "^5.89.0",
-    "webpack-cli": "^5.1.4",
-    "webpack-dev-server": "^4.15.1",
-    "webpack-merge": "^5.10.0",
+    "postcss-loader": "^8.1.1",
+    "sass": "^1.79.3",
+    "sass-loader": "^16.0.2",
+    "source-map-loader": "^5.0.0",
+    "style-loader": "^4.0.0",
+    "ts-loader": "^9.5.1",
+    "typescript": "^5.6.2",
+    "webpack": "5.94.0",
+    "webpack-cli": "5.1.4",
+    "webpack-dev-server": "^5.1.0",
+    "webpack-merge": "^6.0.1",
     "worker-loader": "^3.0.8"
   },
   "resolutions": {

uncoder-os/src/pages/UncoderEditor/UncoderEditor.sass

@@ -1,11 +1,12 @@
+@use "sass:color"
 @import ../../assets/sass/helpers/variables
 @import ../../assets/sass/helpers/mixins
 
 .main-grid
   border-radius: 4px
   border: 1px solid rgba($borderGray, .3)
   background-color: $backgroundBlueLight
-  box-shadow: 0 6px 12px transparentize($black, .8), 0 24px 40px transparentize($black, .8)
+  box-shadow: 0 6px 12px color.scale($black, $alpha: -80%), 0 24px 40px color.scale($black, $alpha: -80%)
   &__scroll
     overflow-x: auto
     max-width: 100%