feat(pluginsUI): minor style improvements

src/I18n/i18n-data.json

@@ -146,6 +146,7 @@
         ["Add plugin by code", "添加插件代码"],
         ["Enable", "启用"],
         ["Disable", "禁用"],
+        ["loaded", "已加载"],
         ["Are you sure to remove plugin \"{0}\"?", "确定要移除插件 \"{0}\" 吗？"],
         ["Edit plugin code", "编辑插件代码"],
         ["Plugin code", "插件代码"],

src/Plugins/pluginsUI.ts

@@ -157,17 +157,6 @@ export class PluginListViewItem extends ListViewItem {
     return {
       tag: "div.plugin-item",
       child: [
-        type === "user-store" && new ButtonView({
-          text: () => I`Edit`,
-          type: "inline",
-          onActive: async (ev) => {
-            const item = plugins.getPluginCodeItem(key);
-            await item.get();
-            const dialog = new PluginCodeDialog("edit", item);
-            dialog.onSubmit.add(() => this.onChange.invoke());
-            dialog.show(ev);
-          },
-        }),
         new ButtonView({
           text: () => (this.data.enabled ? I`Disable` : I`Enable`),
           type: "inline",
@@ -198,8 +187,24 @@ export class PluginListViewItem extends ListViewItem {
               });
           },
         }),
+        type === "user-store" && new ButtonView({
+          text: () => I`Edit`,
+          type: "inline",
+          onActive: async (ev) => {
+            const item = plugins.getPluginCodeItem(key);
+            await item.get();
+            const dialog = new PluginCodeDialog("edit", item);
+            dialog.onSubmit.add(() => this.onChange.invoke());
+            dialog.show(ev);
+          },
+        }),
         {
           tag: "div.plugin-status",
+          update: (dom) => {
+            dom.style.color = this.data.loaded || this.data.enabled
+              ? ""
+              : "var(--color-text-gray)";
+          },
           text: () =>
             [
               this.data.enabled ? I`enabled` : I`disabled`,

style.css

@@ -1547,5 +1547,5 @@ body {
 }
 
 .add-plugins > .btn {
-  margin: 0 5px;
+  margin: 0 5px 0 0;
 }