darken the color of the numbers

lazyxu · Jan 31, 2024 · 590909e · 590909e
1 parent 438fb73
commit 590909e
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 10 deletions.
diff --git a/ui/mobile/pages/Albums/Drivers.jsx b/ui/mobile/pages/Albums/Drivers.jsx
@@ -2,11 +2,12 @@ import { httpGet } from '@kfs/common/api/webServer';
 import { getSysConfig } from '@kfs/common/hox/sysConfig';
 import { useEffect, useState } from "react";
 import { Image, Pressable, ScrollView, View } from 'react-native';
-import { Surface, Text } from "react-native-paper";
+import { Surface, Text, useTheme } from "react-native-paper";
 
 export default function () {
     const navigation = window.kfsNavigation;
     let [drivers, setDrivers] = useState([]);
+    const { colors } = useTheme();
     // console.log("drivers", drivers);
     useEffect(() => {
         httpGet("/api/v1/listDCIMDriver").then(setDrivers);
@@ -20,7 +21,7 @@ export default function () {
                     margin: 10,
                     marginRight: 0,
                 }}>
-                <Pressable onPress={() => navigation.navigate("AlbumsDriver", { driver })}>
+                    <Pressable onPress={() => navigation.navigate("AlbumsDriver", { driver })} style={{ width: 128 }}>
                         {driver.metadataList.length > 0 ? <Image style={{
                             height: 128,
                             width: 128,
@@ -32,7 +33,7 @@ export default function () {
                                 borderRadius: 10,
                             }} />}
                         <Text>{driver.name}</Text>
-                        <Text>{driver.metadataList.length}</Text>
+                        <Text style={{ color: colors.onSurfaceDisabled }}>{driver.metadataList.length}</Text>
                     </Pressable>
                 </View>
             ))}

diff --git a/ui/mobile/pages/Albums/index.jsx b/ui/mobile/pages/Albums/index.jsx
@@ -9,7 +9,7 @@ export default function () {
     const navigation = window.kfsNavigation;
     let [mediaTypes, setMediaTypes] = useState();
     let [locations, setLocations] = useState();
-    const theme = useTheme();
+    const { colors } = useTheme();
     // console.log("mediaTypes", mediaTypes);
     // console.log("locations", locations);
     useEffect(() => {
@@ -30,8 +30,8 @@ export default function () {
                 <Divider />
                 <Text style={{ margin: 12, fontSize: 24, fontWeight: 400 }}>地点</Text>
                 <Button icon="map-outline" onPress={() => navigation.navigate("AlbumsLocation", { list: locations })} >
-                    <Text theme={theme}>地点</Text>
-                    <Text>{locations ? locations.length : "?"}</Text>
+                    <Text style={{ color: colors.primary }}>地点</Text>
+                    <Text style={{ color: colors.onSurfaceDisabled }}>{locations ? locations.length : "?"}</Text>
                 </Button>
 
                 <Divider />
@@ -50,12 +50,12 @@ export default function () {
                 <Divider />
                 <Text style={{ margin: 12, fontSize: 24, fontWeight: 400 }}>媒体类型</Text>
                 <Button icon="video-outline" onPress={() => navigation.navigate("AlbumsVideo", { list: mediaTypes.video })}>
-                    <Text>视频</Text>
-                    <Text>{mediaTypes ? mediaTypes.video.length : "?"}</Text>
+                    <Text style={{ color: colors.primary }}>视频</Text>
+                    <Text style={{ color: colors.onSurfaceDisabled }}>{mediaTypes ? mediaTypes.video.length : "?"}</Text>
                 </Button>
                 <Button icon="account-box-outline" onPress={() => navigation.navigate("AlbumsSelfie", { list: mediaTypes.selfie })}>
-                    <Text>自拍</Text>
-                    <Text>{mediaTypes ? mediaTypes.selfie.length : "?"}</Text>
+                    <Text style={{ color: colors.primary }}>自拍</Text>
+                    <Text style={{ color: colors.onSurfaceDisabled }}>{mediaTypes ? mediaTypes.selfie.length : "?"}</Text>
                 </Button>
                 <Button icon="flower" disabled={true}>
                     实况