diff --git a/README.md b/README.md
index 3a61270..12a6dc1 100644
--- a/README.md
+++ b/README.md
@@ -112,7 +112,7 @@ docker-compose up
* 还有不少功能和想法(例如成就体系、专题等)没有做进去,会持续做进去。
* 增加搜索引擎,改进搜索、相关性
-* BaseWeb已经快1年没有更新了,找到一个比较惊喜的UI[NextUI](https://nextui.org),不过其第一版还没有release,release 之后会酌情替换。
+* ~~BaseWeb已经快1年没有更新了~~(居然时隔大半年更新到了v13.0.0),即便如此,我依然比较期待[NextUI](https://nextui.org),虽然其第一版还没有release,release 之后会酌情替换。
* 数据库新增MySQL或PG(SQLite只有文件锁)
* 持续重构和优化。
diff --git a/ktap-steam-fetcher/skipList b/ktap-steam-fetcher/skipList
index 5061122..7648229 100644
--- a/ktap-steam-fetcher/skipList
+++ b/ktap-steam-fetcher/skipList
@@ -3251,3 +3251,4 @@
1319120
1318150
1318160
+1318190
diff --git a/ktap-ui-web/src/components/image.js b/ktap-ui-web/src/components/image.js
new file mode 100644
index 0000000..0d11980
--- /dev/null
+++ b/ktap-ui-web/src/components/image.js
@@ -0,0 +1,38 @@
+import React from 'react';
+import { useStyletron } from 'baseui';
+import { MOBILE_BREAKPOINT } from '../constants';
+import { Skeleton } from 'baseui/skeleton';
+
+function Image({ src, alt, width = 'auto', height = 'auto', skeletonWidth = 'auto', skeletonHeight = 'auto', }) {
+ const [css,] = useStyletron();
+ const [loaded, setLoaded] = React.useState(false);
+ return (
+ <>
+ {!loaded && ()}
+ setLoaded(true)} src={src} alt={alt} />
+ >
+ );
+}
+
+export default Image;
\ No newline at end of file
diff --git a/ktap-ui-web/src/components/side-box-apps.js b/ktap-ui-web/src/components/side-box-apps.js
index d80347f..192402d 100644
--- a/ktap-ui-web/src/components/side-box-apps.js
+++ b/ktap-ui-web/src/components/side-box-apps.js
@@ -6,6 +6,7 @@ import { useStyletron } from 'baseui';
import { Skeleton } from 'baseui/skeleton';
import SideBox from './side-box';
import { Link } from 'react-router-dom';
+import Image from './image';
function SideBoxApps({ title, apiUrl }) {
const [css, theme] = useStyletron();
@@ -31,7 +32,7 @@ function SideBoxApps({ title, apiUrl }) {
{isLoading ?
-
+
:
dataList.map((app, i) => (
@@ -50,14 +51,10 @@ function SideBoxApps({ title, apiUrl }) {
}
})}
>
-
-
+
+
{app.name}
diff --git a/ktap-ui-web/src/pages/apps/glance.js b/ktap-ui-web/src/pages/apps/glance.js
index 72fc422..a73aea1 100644
--- a/ktap-ui-web/src/pages/apps/glance.js
+++ b/ktap-ui-web/src/pages/apps/glance.js
@@ -14,6 +14,7 @@ import { useAuth } from '../../hooks/use-auth';
import Tag from '../../components/tag';
import { Linux, Mac, Win } from '../../components/icons';
import RouterLink from '../../components/router-link';
+import Image from '../../components/image';
function Field({ label, value }) {
return (
- m.usage === AppMedia.usage.head)[0].image} />
+ m.usage === AppMedia.usage.head)[0].image} width='100%' height='100%' skeletonHeight='151px' />
- {!loaded && ()}
- setLoaded(true)} src={src} alt={alt} />
- >
- );
-}
-
function AppCard({ app }) {
const [css, theme] = useStyletron();
const navigate = useNavigate();
@@ -50,7 +21,7 @@ function AppCard({ app }) {
backgroundColor: theme.colors.backgroundSecondary,
boxShadow: theme.lighting.shadow600, width: '100%',
})}>
-
+