add app/utils/themes.js

Strides-SPAPP/app/utils/themes.js

@@ -0,0 +1,68 @@
+import { Appearance } from "react-native";
+import app from "../../app.json";
+
+const enableDarkMode = false;//启用黑暗模式
+//theme
+global.pageTitleTint = app.isWhitelabel ? '#000000' : '#FFFFFF';
+global.pageBackground = '#fcfcfc';
+global.colorThemes = '#FFFFFF';//toolbar color
+global.colorAccent = '#A3C93A';//56D905
+global.colorPrimary = '#001489';
+global.colorPrimaryDark = '#FFFFFF';//statusbar color
+//tab bar
+global.tabBarTextActive = app.isWhitelabel ? '#000000' : '#FFFFFF';
+global.tabBarTextInactive = app.isWhitelabel ? '#666666' : '#E0E0E0';
+//background
+global.colorDark = "#303030";
+global.colorLight = "#FFFEFE";
+global.colorCancel = "#CCCCCC";
+//text
+global.textPrimary = '#333333';
+global.textSecondary = '#555555';
+global.textGrey = "#CCCCCC";
+global.textButton = "#FFFFFF";//#222
+global.textCancel = "#999999";
+global.textDark = "#000000";
+global.textLight = "#FFFFFF";
+global.textPlacehoder = "#999999";
+global.textTitle = "#00638C";
+global.rippleColor = "rgba(0,0,0,.2)"
+
+global.darkMode = false;
+global.themeStatusBar = app.isWhitelabel ? "dark-content" : "light-content";
+
+if (Appearance.getColorScheme() == 'dark' && enableDarkMode) {
+  global.darkMode = true;
+  global.themeStatusBar = "light-content"
+  
+  global.pageTitleTint = '#FFFFFF';
+  global.pageBackground = '#353535';
+  global.colorThemes = '#323232';
+  global.colorAccent = '#222222';
+  global.colorPrimary = '#000000';
+  global.colorPrimaryDark = "#000000";
+  global.colorLight = "#000000";
+  global.colorDark = "#FFFCF8";
+  global.textPrimary = '#ffffff';
+  global.textSecondary = '#E0E0E0';
+  global.textDark = "#FFFFFF";
+  global.textLight = "#000000";
+  global.textPlacehoder = "#EEEEEE";
+  global.rippleColor = "rgba(200,200,200,.3)"
+}
+
+global.ripple = {
+  color: rippleColor
+}
+
+global.rippleLess = {
+  color: rippleColor,
+  radius: 20,
+  borderless: true
+}
+
+global.rippleLessIcon = {
+  color: rippleColor,
+  radius: 22,
+  borderless: true
+}