refactor: improve entity component layout for better device responsiveness (#7383)

* refactor: improve entity component layout for better device responsiveness

Signed-off-by: Ryan Wang <i@ryanc.cc>

* Resolve CSS style conflicts

Signed-off-by: Ryan Wang <i@ryanc.cc>

* Update missing translaions

Signed-off-by: Ryan Wang <i@ryanc.cc>

---------

Signed-off-by: Ryan Wang <i@ryanc.cc>

ui/console-src/modules/system/plugins/PluginList.vue

@@ -16,6 +16,7 @@ import {
   VDropdown,
   VDropdownItem,
   VEmpty,
+  VEntityContainer,
   VLoading,
   VPageHeader,
   VSpace,
@@ -323,17 +324,14 @@ onMounted(() => {
       </Transition>
 
       <Transition v-else appear name="fade">
-        <ul
-          class="box-border h-full w-full divide-y divide-gray-100"
-          role="list"
-        >
-          <li v-for="plugin in data" :key="plugin.metadata.name">
-            <PluginListItem
-              :plugin="plugin"
-              :is-selected="selectedNames.includes(plugin.metadata.name)"
-            />
-          </li>
-        </ul>
+        <VEntityContainer>
+          <PluginListItem
+            v-for="plugin in data"
+            :key="plugin.metadata.name"
+            :plugin="plugin"
+            :is-selected="selectedNames.includes(plugin.metadata.name)"
+          />
+        </VEntityContainer>
       </Transition>
 
       <template #footer>