linter (modelscope#44)

.eslintrc

@@ -0,0 +1,17 @@
+{
+  "env": {
+    "browser": true,
+    "es2021": true
+  },
+  "rules": {
+    "semi": ["error", "always"],
+    "quotes": ["error", "double"],
+    "indent": ["error", 2],
+    "linebreak-style": ["error", "unix"],
+    "brace-style": ["error", "1tbs"],
+    "curly": ["error", "all"],
+    "no-eval": ["error"],
+    "prefer-const": ["error"],
+    "arrow-spacing": ["error", { "before": true, "after": true }]
+  }
+}

.pre-commit-config.yaml

@@ -99,6 +99,20 @@ repos:
           --disable=W0201,
           --disable=C0302,
         ]
+  - repo: https://github.com/pre-commit/mirrors-eslint
+    rev: v7.32.0
+    hooks:
+      - id: eslint
+        files: \.(js|jsx)$
+        exclude: '.*js_third_party.*'
+        args: ['--fix']
+  - repo: https://github.com/thibaudcolas/pre-commit-stylelint
+    rev: v14.4.0
+    hooks:
+      - id: stylelint
+        files: \.(css|scss|sass|less)$
+        exclude: '.*css_third_party.*'
+        args: ['--fix']
   - repo: https://github.com/regebro/pyroma
     rev: "4.0"
     hooks:

.stylelintrc

@@ -0,0 +1,6 @@
+{
+  "rules": {
+    "indentation": 2,
+    "string-quotes": "single"
+  }
+}

docs/sphinx_doc/en/source/_static/custom.css

@@ -1,4 +1,4 @@
 .language-selector a {
-    color: white;
-    width: 20px;
+  color: white;
+  width: 20px;
 }

docs/sphinx_doc/zh_CN/source/_static/custom.css

@@ -1,4 +1,4 @@
 .language-selector a {
-    color: white;
-    width: 20px;
+  color: white;
+  width: 20px;
 }

src/agentscope/studio/static/css/base.css

@@ -1,110 +1,110 @@
 :root {
-    --tab-btn-icon-length: 20px;
+  --tab-btn-icon-length: 20px;
 
-    --body-bg: #ffffff;
+  --body-bg: #ffffff;
 
-    --main-color: #59AC80;
-    --main-color-light: #A0D9C4;
-    --main-color-light-light: #D1E9DC;
-    --main-color-very-light: #F3F9F1;
-    --main-color-dark: #3D7D5A;
-    --base-color: #F3F9F1;
+  --main-color: #59AC80;
+  --main-color-light: #A0D9C4;
+  --main-color-light-light: #D1E9DC;
+  --main-color-very-light: #F3F9F1;
+  --main-color-dark: #3D7D5A;
+  --base-color: #F3F9F1;
 
-    --border-color: #EBEBF0;
+  --border-color: #EBEBF0;
 
-    /*Titlebar for each page*/
-    --page-titlebar-height: 60px;
-    --page-content-height: calc(100% - var(--page-titlebar-height));
+  /*Titlebar for each page*/
+  --page-titlebar-height: 60px;
+  --page-content-height: calc(100% - var(--page-titlebar-height));
 
-    /*Navigation bar*/
-    --page-sidebar-width: 250px;
+  /*Navigation bar*/
+  --page-sidebar-width: 250px;
 }
 
 /*Text cannot be selected*/
 .unselectable-text {
-    -webkit-user-select: none; /* Safari */
-    -moz-user-select: none; /* Firefox */
-    -ms-user-select: none; /* IE10+/Edge */
-    user-select: none; /* Standard */
+  -webkit-user-select: none; /* Safari */
+  -moz-user-select: none; /* Firefox */
+  -ms-user-select: none; /* IE10+/Edge */
+  user-select: none; /* Standard */
 }
 
 a {
   text-decoration: none;
 }
 
 .page-titlebar {
-    display: flex;
-    justify-content: space-between;
-    width: 100%;
-    height: var(--page-titlebar-height);
-    flex-direction: row;
-    align-items: center;
-    border-bottom: 1px solid var(--border-color);
-    box-sizing: border-box;
-    padding: 0 20px;
+  display: flex;
+  justify-content: space-between;
+  width: 100%;
+  height: var(--page-titlebar-height);
+  flex-direction: row;
+  align-items: center;
+  border-bottom: 1px solid var(--border-color);
+  box-sizing: border-box;
+  padding: 0 20px;
 }
 
 .github-user-content{
-    display: flex;
-    align-items: center;
+  display: flex;
+  align-items: center;
 }
 .user-detail{
-    display: flex;
-    position: relative;
-    cursor: pointer;
+  display: flex;
+  position: relative;
+  cursor: pointer;
 }
 .user-option{
-    position: relative;
-    display: flex;;
-    margin-right: 5px;
+  position: relative;
+  display: flex;;
+  margin-right: 5px;
 }
 .user-option a{
-    color: black;
-    text-decoration: none;
-    font-weight: normal;
+  color: black;
+  text-decoration: none;
+  font-weight: normal;
 }
 .triangle-down {
-    width: 0;
-    height: 0;
-    border-left: 5px solid transparent;
-    border-right: 5px solid transparent;
-    border-top: 5px solid gray;
-    position: relative;
-    transform: translateY(10px);
-    margin-left: 5px;
+  width: 0;
+  height: 0;
+  border-left: 5px solid transparent;
+  border-right: 5px solid transparent;
+  border-top: 5px solid gray;
+  position: relative;
+  transform: translateY(10px);
+  margin-left: 5px;
 }
 
 .user-detail:hover .dropdown {
-    display: block;
+  display: block;
 }
 
 .dropdown {
-    display: none;
-    position: absolute;
-    width: 100%;
-    top:100%;
-    left: 0;
-    background-color: #f9f9f9;
-    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
-    z-index: 1;
-    white-space: nowrap;
-    border-radius: 0 0px 5px 5px;
-    overflow: hidden;
+  display: none;
+  position: absolute;
+  width: 100%;
+  top:100%;
+  left: 0;
+  background-color: #f9f9f9;
+  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+  z-index: 1;
+  white-space: nowrap;
+  border-radius: 0 0px 5px 5px;
+  overflow: hidden;
 }
 
 .dropdown a {
-    color: black;
-    padding: 4px 8px;
-    text-decoration: none;
-    display: block;
+  color: black;
+  padding: 4px 8px;
+  text-decoration: none;
+  display: block;
 }
 
 .dropdown a:hover {
-    background-color: #f1f1f1;
+  background-color: #f1f1f1;
 }
 
 .triangle-down:hover {
-    border-top: 5px solid #000;
+  border-top: 5px solid #000;
 }