#### What type of PR is this?
/area ui
/kind improvement
/milestone 2.21.x
#### What this PR does / why we need it:
1. Add ghost variant
2. Improve icon style
3. Refactoring css using scss functions
#### Does this PR introduce a user-facing change?
```release-note
None
```
* 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>
#### What type of PR is this?
/area ui
/kind improvement
/milestone 2.17.x
#### What this PR does / why we need it:
重新组织和固定 UI 部分代码的 imports 导入，防止后续因为 imports 的顺序造成不必要的 diff。
基于：https://github.com/halo-dev/halo/pull/6151
#### Does this PR introduce a user-facing change?
```release-note
None
```
#### What type of PR is this?
/area ui
/kind improvement
/milestone 2.16.x
#### What this PR does / why we need it:
优化和角色相关的对话框显示逻辑，减少不必要的渲染开销和请求。
#### Does this PR introduce a user-facing change?
```release-note
优化和角色相关的对话框显示逻辑，减少不必要的渲染开销和请求。
```
#### What type of PR is this?
/area ui
/kind cleanup
/milestone 2.16.x
#### What this PR does / why we need it:
规范 api client 的方法名，之前生成的 api client 的方法名没有完全遵循驼峰命名。
#### Which issue(s) this PR fixes:
Close https://github.com/halo-dev/halo/issues/5716
#### Special notes for your reviewer:
CI 通过即可。
#### Does this PR introduce a user-facing change?
```release-note
None
```
Ryan Wang