diff --git a/front/apps/mobile/app.config.js b/front/apps/mobile/app.config.js
index ba37e6cb..032cb6dd 100644
--- a/front/apps/mobile/app.config.js
+++ b/front/apps/mobile/app.config.js
@@ -20,21 +20,29 @@
const IS_DEV = process.env.APP_VARIANT === "development";
+// Defined outside the config because dark splashscreen needs to be platform specific.
+const splash = {
+ image: "./assets/icon.png",
+ resizeMode: "contain",
+ backgroundColor: "#eff1f5",
+ dark: {
+ image: "./assets/icon.png",
+ resizeMode: "contain",
+ backgroundColor: "#1e1e2e",
+ },
+};
+
const config = {
expo: {
- name: "kyoo",
+ name: IS_DEV ? "Kyoo Development" : "Kyoo",
slug: "kyoo",
scheme: "kyoo",
version: "1.0.0",
orientation: "default",
icon: "./assets/icon.png",
entryPoint: "./index.tsx",
- userInterfaceStyle: "light",
- splash: {
- image: "./assets/splash.png",
- resizeMode: "contain",
- backgroundColor: "#ffffff",
- },
+ userInterfaceStyle: "automatic",
+ splash,
updates: {
fallbackToCacheTimeout: 0,
},
@@ -45,12 +53,10 @@ const config = {
android: {
package: IS_DEV ? "moe.sdg.kyoo.dev" : "moe.sdg.kyoo",
adaptiveIcon: {
- foregroundImage: "./assets/adaptive-icon.png",
- backgroundColor: "#FFFFFF",
+ foregroundImage: "./assets/icon.png",
+ backgroundColor: "#eff1f5",
},
- },
- web: {
- favicon: "./assets/favicon.png",
+ splash,
},
extra: {
eas: {
diff --git a/front/apps/mobile/app/_layout.tsx b/front/apps/mobile/app/_layout.tsx
index 33ec96bf..738b6cbe 100644
--- a/front/apps/mobile/app/_layout.tsx
+++ b/front/apps/mobile/app/_layout.tsx
@@ -20,7 +20,7 @@
import { PortalProvider } from "@gorhom/portal";
import { ThemeSelector } from "@kyoo/primitives";
-import { NavbarProfile, NavbarRight, NavbarTitle } from "@kyoo/ui";
+import { NavbarRight, NavbarTitle } from "@kyoo/ui";
import { createQueryClient } from "@kyoo/models";
import { QueryClientProvider } from "@tanstack/react-query";
import i18next from "i18next";
@@ -35,7 +35,7 @@ import {
} from "@expo-google-fonts/poppins";
import { useCallback, useState } from "react";
import { useColorScheme } from "react-native";
-import { initReactI18next, useTranslation } from "react-i18next";
+import { initReactI18next } from "react-i18next";
import { useTheme } from "yoshiki/native";
import "intl-pluralrules";
@@ -63,6 +63,9 @@ const ThemedStack = ({ onLayout }: { onLayout?: () => void }) => {
screenOptions={{
headerTitle: () => ,
headerRight: () => ,
+ contentStyle: {
+ backgroundColor: theme.background,
+ },
headerStyle: {
backgroundColor: theme.appbar,
},
diff --git a/front/apps/mobile/assets/adaptive-icon.png b/front/apps/mobile/assets/adaptive-icon.png
deleted file mode 100644
index 03d6f6b6..00000000
Binary files a/front/apps/mobile/assets/adaptive-icon.png and /dev/null differ
diff --git a/front/apps/mobile/assets/favicon.png b/front/apps/mobile/assets/favicon.png
deleted file mode 100644
index e75f697b..00000000
Binary files a/front/apps/mobile/assets/favicon.png and /dev/null differ
diff --git a/front/apps/mobile/assets/icon.png b/front/apps/mobile/assets/icon.png
index a0b1526f..a395f0fe 100644
Binary files a/front/apps/mobile/assets/icon.png and b/front/apps/mobile/assets/icon.png differ
diff --git a/front/apps/mobile/assets/splash.png b/front/apps/mobile/assets/splash.png
deleted file mode 100644
index 0e89705a..00000000
Binary files a/front/apps/mobile/assets/splash.png and /dev/null differ
diff --git a/front/apps/web/babel.config.js b/front/apps/web/babel.config.js
index 28a33c4e..407a0c0c 100644
--- a/front/apps/web/babel.config.js
+++ b/front/apps/web/babel.config.js
@@ -22,6 +22,6 @@ module.exports = function (api) {
api.cache(true);
return {
presets: ["babel-preset-expo"],
- /* plugins: ["react-native-reanimated/plugin"], */
+ plugins: ["react-native-reanimated/plugin"],
};
};
diff --git a/front/packages/models/src/query.tsx b/front/packages/models/src/query.tsx
index e6867bb5..92ddffe4 100644
--- a/front/packages/models/src/query.tsx
+++ b/front/packages/models/src/query.tsx
@@ -37,12 +37,11 @@ const queryFn = async (
context: QueryFunctionContext,
): Promise => {
const kyooUrl =
- (Platform.OS !== "web"
+ Platform.OS !== "web"
? process.env.PUBLIC_BACK_URL
: typeof window === "undefined"
? process.env.KYOO_URL ?? "http://localhost:5000"
- : // TODO remove the hardcoded fallback. This is just for testing purposes
- "/api") ?? "https://beta.sdg.moe";
+ : "/api";
if (!kyooUrl) console.error("Kyoo's url is not defined.");
let resp;
diff --git a/front/packages/primitives/src/icons.tsx b/front/packages/primitives/src/icons.tsx
index 4849f140..5ec298bc 100644
--- a/front/packages/primitives/src/icons.tsx
+++ b/front/packages/primitives/src/icons.tsx
@@ -40,7 +40,7 @@ type IconProps = {
export const Icon = ({ icon: Icon, color, size = 24, ...props }: IconProps) => {
const { css, theme } = useYoshiki();
const computed = css(
- { width: size, height: size, fill: color ?? theme.colors.white } as ViewStyle,
+ { width: size, height: size, fill: color ?? theme.contrast } as ViewStyle,
props,
);
return (
diff --git a/front/packages/primitives/src/links.tsx b/front/packages/primitives/src/links.tsx
index 1a9d11e4..d406a2bd 100644
--- a/front/packages/primitives/src/links.tsx
+++ b/front/packages/primitives/src/links.tsx
@@ -74,8 +74,12 @@ export const PressableFeedback = forwardRef<
const pressProps = { onBlur, onFocus, onPressIn, onPressOut, onPress };
const wrapperProps = Platform.select({
android: {
- ...props,
- style: { ...StyleSheet.flatten(props?.style), overflow: "hidden" },
+ style: {
+ borderRadius: StyleSheet.flatten(props?.style)?.borderRadius,
+ alignContent: "center",
+ justifyContent: "center",
+ overflow: "hidden",
+ },
ref,
},
default: {},
diff --git a/front/packages/primitives/src/themes/catppuccin.ts b/front/packages/primitives/src/themes/catppuccin.ts
index 93aed8cc..bcb4f23c 100644
--- a/front/packages/primitives/src/themes/catppuccin.ts
+++ b/front/packages/primitives/src/themes/catppuccin.ts
@@ -55,7 +55,7 @@ export const catppuccin: ThemeBuilder = {
},
dark: {
// Catppuccin mocha
- appbar: "#94e2d5",
+ appbar: "#89b4fa",
overlay0: "#6c7086",
overlay1: "#9399b2",
link: "#89b4fa",
diff --git a/front/packages/primitives/src/themes/theme.tsx b/front/packages/primitives/src/themes/theme.tsx
index 03492c3e..1599b452 100644
--- a/front/packages/primitives/src/themes/theme.tsx
+++ b/front/packages/primitives/src/themes/theme.tsx
@@ -38,6 +38,7 @@ type Mode = {
overlay0: Property.Color;
overlay1: Property.Color;
link: Property.Color;
+ contrast: Property.Color;
variant: Variant;
colors: {
red: Property.Color;
@@ -67,26 +68,17 @@ declare module "yoshiki" {
font: FontList;
}
}
-declare module "yoshiki/native" {
- export interface Theme extends Mode, Variant {
- light: Mode & Variant;
- dark: Mode & Variant;
- user: Mode & Variant;
- alternate: Mode & Variant;
- font: FontList;
- }
-}
export type { Theme } from "yoshiki";
export type ThemeBuilder = {
- light: Mode & { default: Variant };
- dark: Mode & { default: Variant };
+ light: Omit & { default: Variant };
+ dark: Omit & { default: Variant };
};
const selectMode = (theme: ThemeBuilder & { font: FontList }, mode: "light" | "dark"): Theme => {
const { light: lightBuilder, dark: darkBuilder, ...options } = theme;
- const light = { ...lightBuilder, ...lightBuilder.default };
- const dark = { ...darkBuilder, ...darkBuilder.default };
+ const light = { ...lightBuilder, ...lightBuilder.default, contrast: lightBuilder.colors.black };
+ const dark = { ...darkBuilder, ...darkBuilder.default, contrast: darkBuilder.colors.white };
const value = mode === "light" ? light : dark;
const alternate = mode === "light" ? dark : light;
return {
diff --git a/front/packages/ui/src/details/header.tsx b/front/packages/ui/src/details/header.tsx
index 929d738e..c5bf93f5 100644
--- a/front/packages/ui/src/details/header.tsx
+++ b/front/packages/ui/src/details/header.tsx
@@ -165,7 +165,7 @@ const TitleLine = ({
/>