diff --git a/packages/components/src/components.ts b/packages/components/src/components.ts
index c89e95a1d..08e97c4a5 100644
--- a/packages/components/src/components.ts
+++ b/packages/components/src/components.ts
@@ -21,3 +21,4 @@ export * from "./components/empty";
export * from "./components/status";
export * from "./components/entity";
export * from "./components/toast";
+export * from "./components/loading";
diff --git a/packages/components/src/components/loading/Loading.vue b/packages/components/src/components/loading/Loading.vue
new file mode 100644
index 000000000..16c047277
--- /dev/null
+++ b/packages/components/src/components/loading/Loading.vue
@@ -0,0 +1,26 @@
+
+
+
+
+
diff --git a/packages/components/src/components/loading/index.ts b/packages/components/src/components/loading/index.ts
new file mode 100644
index 000000000..105353d1c
--- /dev/null
+++ b/packages/components/src/components/loading/index.ts
@@ -0,0 +1 @@
+export { default as VLoading } from "./Loading.vue";
diff --git a/src/modules/contents/attachments/AttachmentList.vue b/src/modules/contents/attachments/AttachmentList.vue
index 9b2ad34d2..05a047a39 100644
--- a/src/modules/contents/attachments/AttachmentList.vue
+++ b/src/modules/contents/attachments/AttachmentList.vue
@@ -19,6 +19,7 @@ import {
VStatusDot,
VEntity,
VEntityField,
+ VLoading,
} from "@halo-dev/components";
import LazyImage from "@/components/image/LazyImage.vue";
import UserDropdownSelector from "@/components/dropdown-selector/UserDropdownSelector.vue";
@@ -563,30 +564,33 @@ onMounted(() => {
/>
-
-
-
- 刷新
-
-
-
-
- 上传附件
-
-
-
-
+
+
+
+
+
+
+ 刷新
+
+
+
+
+ 上传附件
+
+
+
+
+
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ attachment.spec.mediaType }}
+
+
+ {{ prettyBytes(attachment.spec.size || 0) }}
+
+
+
+
+
+
+
+
+
+
+ {{ attachment.spec.uploadedBy?.name }}
+
+
+
+
+
+
+
+
+
+
+
+ {{
+ formatDatetime(
+ attachment.metadata.creationTimestamp
+ )
+ }}
+
+
+
+
+
+
+ 删除
+
+
+
+
+
+
diff --git a/src/modules/contents/comments/CommentList.vue b/src/modules/contents/comments/CommentList.vue
index 14d66a17d..132e2a984 100644
--- a/src/modules/contents/comments/CommentList.vue
+++ b/src/modules/contents/comments/CommentList.vue
@@ -10,6 +10,7 @@ import {
IconRefreshLine,
VEmpty,
Dialog,
+ VLoading,
} from "@halo-dev/components";
import CommentListItem from "./components/CommentListItem.vue";
import UserDropdownSelector from "@/components/dropdown-selector/UserDropdownSelector.vue";
@@ -459,36 +460,40 @@ function handleClearFilters() {
-
-
-
- 刷新
-
-
-
-
+
+
+
+
+
+ 刷新
+
+
+
+
+
+
+
diff --git a/src/modules/contents/pages/DeletedSinglePageList.vue b/src/modules/contents/pages/DeletedSinglePageList.vue
index 36a807c49..117e90ee5 100644
--- a/src/modules/contents/pages/DeletedSinglePageList.vue
+++ b/src/modules/contents/pages/DeletedSinglePageList.vue
@@ -14,6 +14,7 @@ import {
VEntityField,
VPageHeader,
VStatusDot,
+ VLoading,
} from "@halo-dev/components";
import { onMounted, ref, watch } from "vue";
import type { ListedSinglePageList, SinglePage } from "@halo-dev/api-client";
@@ -305,125 +306,130 @@ function handleClearKeyword() {
-
-
-
- 刷新
-
- 返回
-
-
-
-
-
+
diff --git a/src/modules/contents/pages/SinglePageList.vue b/src/modules/contents/pages/SinglePageList.vue
index 2cbf42b70..1020fce1a 100644
--- a/src/modules/contents/pages/SinglePageList.vue
+++ b/src/modules/contents/pages/SinglePageList.vue
@@ -18,6 +18,7 @@ import {
VStatusDot,
VEntity,
VEntityField,
+ VLoading,
} from "@halo-dev/components";
import SinglePageSettingModal from "./components/SinglePageSettingModal.vue";
import UserDropdownSelector from "@/components/dropdown-selector/UserDropdownSelector.vue";
@@ -613,170 +614,167 @@ function handleClearFilters() {
-
-
-
- 刷新
-
-
-
+
+
+
+
+
+ 刷新
+
+
+
+
+ 新建页面
+
+
+
+
+
+
+
-
-
-
-
+
+ 设置
+
+
+ 删除
+
+
+
+
+
+
diff --git a/src/modules/contents/posts/DeletedPostList.vue b/src/modules/contents/posts/DeletedPostList.vue
index e1f2496cb..356db96b3 100644
--- a/src/modules/contents/posts/DeletedPostList.vue
+++ b/src/modules/contents/posts/DeletedPostList.vue
@@ -14,6 +14,7 @@ import {
VStatusDot,
VEntity,
VEntityField,
+ VLoading,
} from "@halo-dev/components";
import PostTag from "./tags/components/PostTag.vue";
import { onMounted, ref, watch } from "vue";
@@ -298,138 +299,146 @@ function handleClearKeyword() {
-
-
-
- 刷新
- 返回
-
-
-
+
-
+
+ 永久删除
+
+
+ 恢复
+
+
+
+
+
+
diff --git a/src/modules/contents/posts/PostList.vue b/src/modules/contents/posts/PostList.vue
index 8b664b760..4a336db1d 100644
--- a/src/modules/contents/posts/PostList.vue
+++ b/src/modules/contents/posts/PostList.vue
@@ -20,6 +20,7 @@ import {
VStatusDot,
VEntity,
VEntityField,
+ VLoading,
} from "@halo-dev/components";
import UserDropdownSelector from "@/components/dropdown-selector/UserDropdownSelector.vue";
import PostSettingModal from "./components/PostSettingModal.vue";
@@ -823,183 +824,184 @@ const hasFilters = computed(() => {
-
-
-
-
- 刷新
-
-
-
-
- 新建文章
-
-
-
-
-
+
diff --git a/src/modules/contents/posts/categories/CategoryList.vue b/src/modules/contents/posts/categories/CategoryList.vue
index d3cb236e7..25a8848a1 100644
--- a/src/modules/contents/posts/categories/CategoryList.vue
+++ b/src/modules/contents/posts/categories/CategoryList.vue
@@ -12,6 +12,7 @@ import {
VEmpty,
VPageHeader,
VSpace,
+ VLoading,
} from "@halo-dev/components";
import CategoryEditingModal from "./components/CategoryEditingModal.vue";
import CategoryListItem from "./components/CategoryListItem.vue";
@@ -111,34 +112,34 @@ const onEditingModalClose = () => {
-
-
-
- 刷新
-
-
-
-
- 新建分类
-
-
-
-
-
+
+
+
+
+
+ 刷新
+
+
+
+
+ 新建分类
+
+
+
+
+
+
+
+
diff --git a/src/modules/contents/posts/tags/TagList.vue b/src/modules/contents/posts/tags/TagList.vue
index fb4135a94..292015366 100644
--- a/src/modules/contents/posts/tags/TagList.vue
+++ b/src/modules/contents/posts/tags/TagList.vue
@@ -16,6 +16,7 @@ import {
VStatusDot,
VEntity,
VEntityField,
+ VLoading,
} from "@halo-dev/components";
import TagEditingModal from "./components/TagEditingModal.vue";
import PostTag from "./components/PostTag.vue";
@@ -158,92 +159,99 @@ onMounted(async () => {
-
-
-
- 刷新
-
-
-
-
- 新建标签
-
-
-
-
-
-
- -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{ formatDatetime(tag.metadata.creationTimestamp) }}
-
-
-
-
-
-
- 修改
-
-
- 删除
-
-
-
-
-
+
+
+
+
+
+ 刷新
+
+
+
+
+ 新建标签
+
+
+
+
+
-
+
+
+
+ -
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ formatDatetime(tag.metadata.creationTimestamp) }}
+
+
+
+
+
+
+ 修改
+
+
+ 删除
+
+
+
+
+
+
+
+
+
+
diff --git a/src/modules/interface/menus/Menus.vue b/src/modules/interface/menus/Menus.vue
index e65e9a75a..5a6abb0c2 100644
--- a/src/modules/interface/menus/Menus.vue
+++ b/src/modules/interface/menus/Menus.vue
@@ -8,6 +8,7 @@ import {
VEmpty,
VPageHeader,
VSpace,
+ VLoading,
} from "@halo-dev/components";
import MenuItemEditingModal from "./components/MenuItemEditingModal.vue";
import MenuItemListItem from "./components/MenuItemListItem.vue";
@@ -220,35 +221,38 @@ const handleDelete = async (menuItem: MenuTreeItem) => {
-
-
-
- 刷新
-
-
-
-
- 新增菜单项
-
-
-
-
-
+
+
+
+
+
+ 刷新
+
+
+
+
+ 新增菜单项
+
+
+
+
+
+
+
+
diff --git a/src/modules/interface/menus/components/MenuList.vue b/src/modules/interface/menus/components/MenuList.vue
index dacd6e35f..674d76a11 100644
--- a/src/modules/interface/menus/components/MenuList.vue
+++ b/src/modules/interface/menus/components/MenuList.vue
@@ -9,6 +9,7 @@ import {
VEntity,
VEntityField,
VTag,
+ VLoading,
} from "@halo-dev/components";
import MenuEditingModal from "./MenuEditingModal.vue";
import { onMounted, onUnmounted, ref } from "vue";
@@ -190,75 +191,76 @@ onMounted(handleFetchPrimaryMenuName);
@created="handleSelect"
/>
-
-
-
- 刷新
-
-
-
-
- -
-
+
+
+
+
+ 刷新
+
+
+
+
+
+
+ -
-
-
-
- 主菜单
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+ 主菜单
+
+
+
+
+
+
+
+
+
+
+
- 设置为主菜单
-
-
- 修改
-
-
- 删除
-
-
-
-
-
+
+ 设置为主菜单
+
+
+ 修改
+
+
+ 删除
+
+
+
+
+
+
新增
diff --git a/src/modules/interface/themes/ThemeDetail.vue b/src/modules/interface/themes/ThemeDetail.vue
index 3d0fe9391..234f952c6 100644
--- a/src/modules/interface/themes/ThemeDetail.vue
+++ b/src/modules/interface/themes/ThemeDetail.vue
@@ -55,170 +55,177 @@ const onUpgradeModalClose = () => {
-
-
-
-
-
-
- {{ selectedTheme?.spec.displayName }}
-
-
-
- {{ selectedTheme?.spec.version }}
-
-
- {{ isActivated ? "当前启用" : "未启用" }}
-
-
-
-
-
-
-
-
-
-
-
-
- 更新
-
-
- 刷新设置表单
-
-
-
-
-
-
-
-
-
-
-
- ID
- -
- {{ selectedTheme?.metadata.name }}
-
-
-
-
- 作者
- -
- {{ selectedTheme?.spec.author.name }}
-
-
-
-
-
-
- 当前版本
- -
- {{ selectedTheme?.spec.version }}
-
-
-
-
- Halo 版本要求
- -
- {{ selectedTheme?.spec.require }}
-
-
-
-
- 存储位置
- -
- {{ selectedTheme?.status?.location }}
-
-
-
-
-
- 插件依赖
-
-
-
-
- -
-
-
- run.halo.plugins.links
-
-
-
- 已安装
-
-
-
-
- -
-
-
- run.halo.plugins.photos
+
+
+
+
+
+
+
+
+ {{ selectedTheme?.spec.displayName }}
+
+
+
+ {{ selectedTheme?.spec.version }}
-
-
- 未安装
-
-
+
+ {{ isActivated ? "当前启用" : "未启用" }}
+
+
+
+
+
+
+
+
+
+
+
+
+ 更新
+
+
+ 刷新设置表单
+
+
-
-
-
+
+
+
-
-
+
+
+
+
- ID
+ -
+ {{ selectedTheme?.metadata.name }}
+
+
+
+
- 作者
+ -
+ {{ selectedTheme?.spec.author.name }}
+
+
+
+
+
+
- 当前版本
+ -
+ {{ selectedTheme?.spec.version }}
+
+
+
+
- Halo 版本要求
+ -
+ {{ selectedTheme?.spec.require }}
+
+
+
+
- 存储位置
+ -
+ {{ selectedTheme?.status?.location }}
+
+
+
+
+
- 插件依赖
+
-
+
+
+ -
+
+
+ run.halo.plugins.links
+
+
+
+ 已安装
+
+
+
+
+ -
+
+
+ run.halo.plugins.photos
+
+
+
+ 未安装
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
+
diff --git a/src/modules/interface/themes/components/ThemeListModal.vue b/src/modules/interface/themes/components/ThemeListModal.vue
index b4e7a6e0f..01cb58fef 100644
--- a/src/modules/interface/themes/components/ThemeListModal.vue
+++ b/src/modules/interface/themes/components/ThemeListModal.vue
@@ -13,6 +13,7 @@ import {
VStatusDot,
VTabItem,
VTabs,
+ VLoading,
} from "@halo-dev/components";
import LazyImage from "@/components/image/LazyImage.vue";
import ThemePreviewModal from "./preview/ThemePreviewModal.vue";
@@ -214,257 +215,270 @@ const handleOpenPreview = (theme: Theme) => {
class="my-[12px] mx-[16px]"
>
-
-
-
-
- 刷新
-
-
-
-
-
- 安装主题
-
-
-
-
-
-
-
+
+
-
+
+
+ 刷新
+
+
+
+
+
+ 安装主题
+
+
+
+
+
+
+
+
+ 预览
+
+
+ 卸载
+
+
+ 卸载并删除配置
+
+
+
+
+
+
-
-
-
-
- 刷新
-
-
-
-
-
-
- -
-
-
-
-
-
-
-
+
+
+
+
+
+ 刷新
+
+
+
+
+
+
+
+ -
+
+
+
+
+
+
-
-
-
加载中...
+
+
-
-
-
-
- 加载异常
-
-
-
+
加载中...
+
+
+
+
+ 加载异常
+
+
+
+
-
-
-
-
-
-
-
-
-
-
- {{ theme.spec.author.name }}
-
-
-
-
-
-
-
-
-
-
-
-
-
- 安装
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+ {{ theme.spec.author.name }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 安装
+
+
+
+
+
+
+
+
diff --git a/src/modules/interface/themes/layouts/ThemeLayout.vue b/src/modules/interface/themes/layouts/ThemeLayout.vue
index f33ce73a6..6778cf84f 100644
--- a/src/modules/interface/themes/layouts/ThemeLayout.vue
+++ b/src/modules/interface/themes/layouts/ThemeLayout.vue
@@ -24,6 +24,7 @@ import {
VPageHeader,
VSpace,
VTabbar,
+ VLoading,
} from "@halo-dev/components";
import ThemeListModal from "../components/ThemeListModal.vue";
import ThemePreviewModal from "../components/preview/ThemePreviewModal.vue";
@@ -224,15 +225,13 @@ onMounted(() => {
>
-
+
-
- 加载中...
-
+
diff --git a/src/modules/system/plugins/PluginDetail.vue b/src/modules/system/plugins/PluginDetail.vue
index 6846281f9..c8799c6ff 100644
--- a/src/modules/system/plugins/PluginDetail.vue
+++ b/src/modules/system/plugins/PluginDetail.vue
@@ -59,166 +59,175 @@ watchEffect(() => {
-
+
-
插件信息
-
- {{ plugin?.spec.version }}
-
- {{ isStarted ? "已启用" : "未启用" }}
-
-
-
-
-
-
-
-
-
-
-
- 名称
-
-
- {{ plugin?.spec.displayName }}
-
+
+
+
插件信息
+
+ {{
+ plugin?.spec.version
+ }}
+
+ {{ isStarted ? "已启用" : "未启用" }}
+
+
+
+
+
+
-
-
- 描述
- -
- {{ plugin?.spec.description }}
-
-
-
-
- 版本
- -
- {{ plugin?.spec.version }}
-
-
-
-
- Halo 版本要求
- -
- {{ plugin?.spec.requires }}
-
-
-
-
-
- 协议
-
-
-
+
+
+
+
- 描述
+ -
+ {{ plugin?.spec.description }}
+
+
+
+
- 版本
+ -
+ {{ plugin?.spec.version }}
+
+
+
+
- Halo 版本要求
+ -
+ {{ plugin?.spec.requires }}
+
+
+
-
-
-
- 模型定义
- -
- 无
-
-
-
+
-
-
-
- {{ group.module }}
-
-
-
-
- -
-
-
-
- {{
- role.metadata.annotations?.[
- rbacAnnotations.DISPLAY_NAME
- ]
- }}
-
-
协议
+ -
+
+
+
+
+
+
- 模型定义
+ -
+ 无
+
+
+
+
- 权限模板
+
-
+
+
+
-
+ {{ group.module }}
+
+
-
+
-
-
-
-
-
-
无
-
+
+
+ {{
+ role.metadata.annotations?.[
+ rbacAnnotations.DISPLAY_NAME
+ ]
+ }}
+
+
+ 依赖于
+ {{
+ JSON.parse(
+ role.metadata.annotations?.[
+ rbacAnnotations.DEPENDENCIES
+ ]
+ ).join(", ")
+ }}
+
+
+
+
+
+
+
+
+
无
+
+
+
+
- 最近一次启动
+ -
+ {{ formatDatetime(plugin?.status?.lastStartTime) }}
+
+
+
-
-
- 最近一次启动
- -
- {{ formatDatetime(plugin?.status?.lastStartTime) }}
-
-
-
-
+
+
diff --git a/src/modules/system/plugins/PluginList.vue b/src/modules/system/plugins/PluginList.vue
index 9ed04ebbf..58844074a 100644
--- a/src/modules/system/plugins/PluginList.vue
+++ b/src/modules/system/plugins/PluginList.vue
@@ -10,6 +10,7 @@ import {
VPageHeader,
VPagination,
VSpace,
+ VLoading,
} from "@halo-dev/components";
import PluginListItem from "./components/PluginListItem.vue";
import PluginUploadModal from "./components/PluginUploadModal.vue";
@@ -310,37 +311,41 @@ function handleClearFilters() {
-
-
-
- 刷新
-
-
-
-
- 安装插件
-
-
-
-
+
-
+
+
+
+
+ 刷新
+
+
+
+
+ 安装插件
+
+
+
+
+
+
+
+
+
diff --git a/src/modules/system/plugins/PluginSetting.vue b/src/modules/system/plugins/PluginSetting.vue
index 6e70e45c8..62805277e 100644
--- a/src/modules/system/plugins/PluginSetting.vue
+++ b/src/modules/system/plugins/PluginSetting.vue
@@ -62,31 +62,36 @@ const handleFetchPlugin = async () => {
await handleFetchPlugin();
-
-
-
-
-
-
-
-
+
diff --git a/src/modules/system/plugins/layouts/PluginLayout.vue b/src/modules/system/plugins/layouts/PluginLayout.vue
index 8277f3c56..94d77433e 100644
--- a/src/modules/system/plugins/layouts/PluginLayout.vue
+++ b/src/modules/system/plugins/layouts/PluginLayout.vue
@@ -17,6 +17,7 @@ import {
VPageHeader,
VTabbar,
VAvatar,
+ VLoading,
} from "@halo-dev/components";
import BasicLayout from "@/layouts/BasicLayout.vue";
@@ -172,15 +173,13 @@ watch([() => route.name, () => route.params], () => {
>
-
+
-
- 加载中...
-
+
diff --git a/src/modules/system/roles/RoleList.vue b/src/modules/system/roles/RoleList.vue
index 1c0c2000b..134c0526d 100644
--- a/src/modules/system/roles/RoleList.vue
+++ b/src/modules/system/roles/RoleList.vue
@@ -12,12 +12,12 @@ import {
VButton,
VCard,
VPageHeader,
- VPagination,
VSpace,
VTag,
VStatusDot,
VEntity,
VEntityField,
+ VLoading,
} from "@halo-dev/components";
import RoleEditingModal from "./components/RoleEditingModal.vue";
@@ -39,7 +39,7 @@ const { currentUserHasPermission } = usePermission();
const editingModal = ref(false);
const selectedRole = ref();
-const { roles, handleFetchRoles } = useFetchRole();
+const { roles, handleFetchRoles, loading } = useFetchRole();
let fuse: Fuse | undefined = undefined;
@@ -228,16 +228,21 @@ const handleDelete = async (role: Role) => {
-
- -
-
-
-
+
+
+ -
+
+
+
-
-
-
-
-
-
-
-
-
-
- 系统保留
-
-
-
-
-
- {{ formatDatetime(role.metadata.creationTimestamp) }}
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+ 系统保留
+
+
+
+
+
+ {{ formatDatetime(role.metadata.creationTimestamp) }}
+
+
+
+
+
- 编辑
-
-
- 删除
-
-
- 基于此角色创建
-
-
-
-
-
-
-
-
-
-
-
+
+ 编辑
+
+
+ 删除
+
+
+ 基于此角色创建
+
+
+
+
+
+
diff --git a/src/modules/system/settings/SystemSetting.vue b/src/modules/system/settings/SystemSetting.vue
index 29ef7a68e..5220c3acc 100644
--- a/src/modules/system/settings/SystemSetting.vue
+++ b/src/modules/system/settings/SystemSetting.vue
@@ -33,31 +33,36 @@ await handleFetchSettings();
await handleFetchConfigMap();
-
-
-
-
-
-
-
-
+
diff --git a/src/modules/system/settings/layouts/SystemSettingsLayout.vue b/src/modules/system/settings/layouts/SystemSettingsLayout.vue
index 35f23b373..479cc4102 100644
--- a/src/modules/system/settings/layouts/SystemSettingsLayout.vue
+++ b/src/modules/system/settings/layouts/SystemSettingsLayout.vue
@@ -14,6 +14,7 @@ import {
VPageHeader,
VTabbar,
IconSettings,
+ VLoading,
} from "@halo-dev/components";
import type { SettingForm } from "@halo-dev/api-client";
@@ -109,15 +110,13 @@ watch([() => route.name, () => route.params], async () => {
>
-
+
-
- 加载中...
-
+
diff --git a/src/modules/system/users/UserList.vue b/src/modules/system/users/UserList.vue
index 7dfee77b0..783ad6b99 100644
--- a/src/modules/system/users/UserList.vue
+++ b/src/modules/system/users/UserList.vue
@@ -15,6 +15,7 @@ import {
VEntityField,
Dialog,
VStatusDot,
+ VLoading,
} from "@halo-dev/components";
import UserEditingModal from "./components/UserEditingModal.vue";
import UserPasswordChangeModal from "./components/UserPasswordChangeModal.vue";
@@ -47,6 +48,7 @@ const users = ref({
hasPrevious: false,
totalPages: 0,
});
+const loading = ref(false);
const selectedUserNames = ref([]);
const selectedUser = ref();
@@ -56,6 +58,8 @@ let fuse: Fuse | undefined = undefined;
const handleFetchUsers = async () => {
try {
+ loading.value = true;
+
const { data } = await apiClient.extension.user.listv1alpha1User({
page: users.value.page,
size: users.value.size,
@@ -70,6 +74,7 @@ const handleFetchUsers = async () => {
console.error("Failed to fetch users", e);
} finally {
selectedUser.value = undefined;
+ loading.value = false;
}
};
@@ -385,111 +390,117 @@ onMounted(() => {
-
+
diff --git a/src/setup/setupStyles.ts b/src/setup/setupStyles.ts
index afe3a22b0..25b0c1eca 100644
--- a/src/setup/setupStyles.ts
+++ b/src/setup/setupStyles.ts
@@ -1,3 +1,4 @@
import "@halo-dev/richtext-editor/dist/style.css";
import "@halo-dev/components/dist/style.css";
import "@/styles/tailwind.css";
+import "@/styles/index.css";
diff --git a/src/styles/index.css b/src/styles/index.css
new file mode 100644
index 000000000..26269ce9d
--- /dev/null
+++ b/src/styles/index.css
@@ -0,0 +1,18 @@
+.fade-enter-active {
+ @apply duration-200 ease-out;
+}
+.fade-enter-from {
+ @apply opacity-0;
+}
+.fade-enter-to {
+ @apply opacity-100;
+}
+.fade-leave-active {
+ @apply duration-200 ease-in;
+}
+.fade-leave-from {
+ @apply opacity-100;
+}
+.fade-leave-to {
+ @apply opacity-0;
+}