From 259ab037b49291a38080149be4c800e19dcbb66e Mon Sep 17 00:00:00 2001 From: Ammar Ahmed Date: Fri, 15 May 2026 12:50:02 +0500 Subject: [PATCH] mobile: updated colors --- apps/mobile/app/app.tsx | 53 ++-- apps/mobile/app/common/design/spacing.ts | 18 ++ apps/mobile/app/common/design/theme.ts | 278 ++++++++++++++++++ apps/mobile/app/components/auth/header.tsx | 9 +- apps/mobile/app/components/auth/signup.tsx | 11 +- .../app/components/intro/illustration.tsx | 52 ++-- apps/mobile/app/components/intro/index.tsx | 14 +- .../app/components/intro/progress-pills.tsx | 5 +- apps/mobile/app/components/ui/input/index.tsx | 9 +- .../app/components/ui/pressable/index.tsx | 10 +- apps/mobile/app/screens/editor/source.ts | 2 +- .../editor/tiptap/use-editor-events.tsx | 1 + .../fonts/notesnook-icons.glyphmap.json | 2 +- apps/mobile/fonts/notesnook-icons.ttf | Bin 10416 -> 11172 bytes .../ios/nanoicons-fonts/notesnook-icons.ttf | Bin 10416 -> 11172 bytes packages/icons/svgs/eye-closed.svg | 3 + packages/icons/svgs/eye-open.svg | 1 + packages/theme/src/theme-engine/types.ts | 2 +- packages/theme/src/theme-engine/utils.ts | 4 +- 19 files changed, 394 insertions(+), 80 deletions(-) create mode 100644 apps/mobile/app/common/design/theme.ts create mode 100644 packages/icons/svgs/eye-closed.svg create mode 100644 packages/icons/svgs/eye-open.svg diff --git a/apps/mobile/app/app.tsx b/apps/mobile/app/app.tsx index 96b8a6fe7..ec5a533f9 100644 --- a/apps/mobile/app/app.tsx +++ b/apps/mobile/app/app.tsx @@ -50,6 +50,7 @@ import { registerAppShortcuts } from "./hooks/use-shortcut-manager"; import Shortcuts from "react-native-actions-shortcuts"; +import { THEME_DARK, THEME_LIGHT } from "./common/design/theme"; I18nManager.allowRTL(false); I18nManager.forceRTL(false); I18nManager.swapLeftAndRightInRTL(false); @@ -131,30 +132,30 @@ export const withTheme = ( ]); useEffect(() => { - setTimeout(() => { - const currentTheme = colorScheme === "dark" ? darkTheme : lightTheme; - if (!currentTheme) return; - themeTrpcClient.updateTheme - .query({ - version: currentTheme.version, - compatibilityVersion: THEME_COMPATIBILITY_VERSION, - id: currentTheme.id - }) - .then((theme) => { - if (theme) { - theme.colorScheme === "dark" - ? useThemeStore.setState({ - darkTheme: theme - }) - : useThemeStore.setState({ - lightTheme: theme - }); - } - }) - .catch(() => { - /* empty */ - }); - }, 1000); + // setTimeout(() => { + // const currentTheme = colorScheme === "dark" ? darkTheme : lightTheme; + // if (!currentTheme) return; + // themeTrpcClient.updateTheme + // .query({ + // version: currentTheme.version, + // compatibilityVersion: THEME_COMPATIBILITY_VERSION, + // id: currentTheme.id + // }) + // .then((theme) => { + // if (theme) { + // theme.colorScheme === "dark" + // ? useThemeStore.setState({ + // darkTheme: theme + // }) + // : useThemeStore.setState({ + // lightTheme: theme + // }); + // } + // }) + // .catch(() => { + // /* empty */ + // }); + // }, 1000); const listener = Appearance.addChangeListener(({ colorScheme }) => { if (colorScheme && SettingsService.getProperty("useSystemTheme")) { @@ -170,11 +171,11 @@ export const withTheme = ( }, []); useEffect(() => { - const nextTheme = colorScheme === "dark" ? darkTheme : lightTheme; + const nextTheme = colorScheme === "dark" ? THEME_DARK : THEME_LIGHT; if (JSON.stringify(nextTheme) !== JSON.stringify(currTheme)) { useThemeEngineStore .getState() - .setTheme(colorScheme === "dark" ? darkTheme : lightTheme); + .setTheme(colorScheme === "dark" ? THEME_DARK : THEME_LIGHT); currTheme = nextTheme; } }, [colorScheme, darkTheme, lightTheme]); diff --git a/apps/mobile/app/common/design/spacing.ts b/apps/mobile/app/common/design/spacing.ts index ffd30f860..db27374e3 100644 --- a/apps/mobile/app/common/design/spacing.ts +++ b/apps/mobile/app/common/design/spacing.ts @@ -1,3 +1,21 @@ +/* +This file is part of the Notesnook project (https://notesnook.com/) + +Copyright (C) 2023 Streetwriters (Private) Limited + +This program is free software: you can redistribute it and/or modify +it under the terms of the GNU General Public License as published by +the Free Software Foundation, either version 3 of the License, or +(at your option) any later version. + +This program is distributed in the hope that it will be useful, +but WITHOUT ANY WARRANTY; without even the implied warranty of +MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +GNU General Public License for more details. + +You should have received a copy of the GNU General Public License +along with this program. If not, see . +*/ export const Spacing = { LEVEL_0: 4, LEVEL_1: 8, diff --git a/apps/mobile/app/common/design/theme.ts b/apps/mobile/app/common/design/theme.ts new file mode 100644 index 000000000..1df05270a --- /dev/null +++ b/apps/mobile/app/common/design/theme.ts @@ -0,0 +1,278 @@ +/* +This file is part of the Notesnook project (https://notesnook.com/) + +Copyright (C) 2023 Streetwriters (Private) Limited + +This program is free software: you can redistribute it and/or modify +it under the terms of the GNU General Public License as published by +the Free Software Foundation, either version 3 of the License, or +(at your option) any later version. + +This program is distributed in the hope that it will be useful, +but WITHOUT ANY WARRANTY; without even the implied warranty of +MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +GNU General Public License for more details. + +You should have received a copy of the GNU General Public License +along with this program. If not, see . +*/ + +import { ThemeDefinition } from "@notesnook/theme"; + +export const THEME_LIGHT: ThemeDefinition = { + $schema: + "https://raw.githubusercontent.com/streetwriters/notesnook-themes/main/schemas/v1.schema.json", + name: "Notesnook Light", + id: "default-light", + version: 2.1, + license: "GPL-3.0-or-later", + homepage: "https://notesnook.com", + description: "The default light theme for Notesnook app.", + colorScheme: "light", + codeBlockCSS: ``, + compatibilityVersion: 1, + authors: [ + { + name: "Streetwriters", + email: "support@streetwriters.co", + url: "https://streetwriters.co" + } + ], + scopes: { + base: { + primary: { + accent: "#008836", + accentForeground: "#ffffff", + paragraph: "#666666", + background: "#ffffff", + border: "#E2E2E2", + heading: "#181818", + icon: "#181818", + separator: "#F0F0F0", + placeholder: "#a9a9a9", + hover: "#eee", + backdrop: "#0000001a", + buttonForeground: "#FFFFFF" + }, + secondary: { + accent: "#7FC39A", + accentForeground: "#ffffff", + paragraph: "#858585", + background: "#F7F7F7", + border: "#EFEFEF", + heading: "#4B4B4B", + icon: "#666666", + separator: "#E8E8E8", + placeholder: "#a9a9a9", + hover: "#dbdbdb", + backdrop: "#0000001a", + buttonForeground: "#181818" + }, + tertiary: { + accent: "#008836", + accentForeground: "#ffffff", + paragraph: "#777", + background: "#ECECEC", + border: "#E8E8E8", + heading: "#666", + icon: "#777", + separator: "#E8E8E8", + placeholder: "#a9a9a9", + hover: "#dbdbdb", + backdrop: "#0000001a" + }, + disabled: { + accent: "#008836", + accentForeground: "#ffffff", + paragraph: "#A6A6A6", + background: "#ffffff", + border: "#E8E8E8", + heading: "#212121", + icon: "#DADADA", + separator: "#E8E8E8", + placeholder: "#a9a9a9", + hover: "#00000010", + backdrop: "#0000001a" + }, + selected: { + accent: "#008836", + accentForeground: "#ffffff", + paragraph: "#212121", + background: "#00883610", + border: "#008836", + heading: "#212121", + icon: "#FFFFFF", + separator: "#E8E8E8", + placeholder: "#a9a9a9", + hover: "#eee", + backdrop: "#0000001a" + }, + error: { + accent: "#f54b42", + accentForeground: "#ffffff", + paragraph: "#FF242E", + background: "#FFEDEE", + border: "#F7999D", + heading: "#f54b42", + icon: "#FB2C36", + separator: "#E8E8E8", + placeholder: "#a9a9a9", + hover: "#00000010", + backdrop: "#0000001a" + }, + success: { + accent: "#4F8A10", + accentForeground: "#ffffff", + paragraph: "#4F8A10", + background: "#85ce68", + border: "#E8E8E8", + heading: "#4F8A10", + icon: "#4F8A10", + separator: "#E8E8E8", + placeholder: "#a9a9a9", + hover: "#00000010", + backdrop: "#0000001a" + } + }, + statusBar: { + primary: { paragraph: "#5E5E5E", background: "#f7f7f7" } + }, + navigationMenu: { + primary: { + background: "#f7f7f7", + paragraph: "#666", + icon: "#666", + hover: "#eee" + }, + secondary: { background: "#EEEEEE" }, + selected: { + background: "#ddd", + hover: "#eee" + } + }, + contextMenu: { primary: { background: "#f7f7f7" } }, + editor: { selected: { background: "#e1e1e1" } }, + sheet: { selected: { paragraph: "#008836" } } + } +}; + +export const THEME_DARK: ThemeDefinition = { + name: "Notesnook Dark", + id: "default-dark", + version: 2.1, + license: "GPL-3.0-or-later", + homepage: "https://notesnook.com", + description: "The default dark theme for the Notesnook app", + colorScheme: "dark", + codeBlockCSS: ``, + compatibilityVersion: 1, + authors: [ + { + name: "Streetwriters", + email: "support@streetwriters.co", + url: "https://streetwriters.co" + } + ], + scopes: { + base: { + primary: { + accent: "#008836", + accentForeground: "#ffffff", + paragraph: "#F2F2F2", + background: "#181818", + border: "#2A2A2A", + heading: "#FFFFFF", + icon: "#FFFFFF", + separator: "#383838", + placeholder: "#404040", + hover: "#2b2b2b", + backdrop: "#35353580", + buttonForeground: "#FFFFFF" + }, + secondary: { + accent: "#0D9E46", + accentForeground: "#ffffff", + paragraph: "#A1A1A1", + background: "#252525", + border: "#0A5729", + heading: "#C0BFBF", + icon: "#808080", + separator: "#383838", + placeholder: "#404040", + hover: "#ffffff10", + backdrop: "#35353580", + buttonForeground: "#BFBFBF" + }, + tertiary: { + accent: "#0D9E46", + accentForeground: "#ffffff", + paragraph: "#818589", + background: "#2C2C2C", + border: "#2b2b2b", + heading: "#808080", + icon: "#808080", + separator: "#383838", + placeholder: "#404040", + hover: "#ffffff10", + backdrop: "#35353580" + }, + disabled: { + accent: "#008836", + accentForeground: "#ffffff", + paragraph: "#505050", + background: "#ffffff", + border: "#383838", + heading: "#212121", + icon: "#FFFFFF", + separator: "#383838", + placeholder: "#404040", + hover: "#ffffff10", + backdrop: "#35353580" + }, + selected: { + accent: "#008836", + accentForeground: "#ffffff", + paragraph: "#FBFBFB", + background: "#494949", + border: "#008836", + heading: "#e3e3e3", + icon: "#008836", + separator: "#383838", + placeholder: "#404040", + hover: "#ffffff10", + backdrop: "#35353580" + }, + error: { + accent: "#f54b42", + accentForeground: "#ffffff", + paragraph: "#f54b42", + background: "#250b0a", + border: "#383838", + heading: "#f54b42", + icon: "#f54b42", + separator: "#383838", + placeholder: "#404040", + hover: "#ffffff10", + backdrop: "#35353580" + }, + success: { + accent: "#4F8A10", + accentForeground: "#ffffff", + paragraph: "#4F8A10", + background: "#132204", + border: "#383838", + heading: "#4F8A10", + icon: "#4F8A10", + separator: "#383838", + placeholder: "#404040", + hover: "#ffffff10", + backdrop: "#35353580" + } + }, + list: { selected: { background: "#202020" } }, + contextMenu: { primary: { background: "#202020" } }, + sheet: { selected: { paragraph: "#008836" } } + }, + $schema: + "https://raw.githubusercontent.com/streetwriters/notesnook-themes/main/schemas/v1.schema.json" +}; diff --git a/apps/mobile/app/components/auth/header.tsx b/apps/mobile/app/components/auth/header.tsx index c73dd7f5b..e4be3ded9 100644 --- a/apps/mobile/app/components/auth/header.tsx +++ b/apps/mobile/app/components/auth/header.tsx @@ -50,15 +50,12 @@ export const AuthHeader = (props: { welcome?: boolean }) => { ) : ( { hideAuth((route.params as AuthParams)?.context); }} - style={{ - width: 30, - height: 30 - }} - size={26} + size={24} color={colors.primary.paragraph} /> )} diff --git a/apps/mobile/app/components/auth/signup.tsx b/apps/mobile/app/components/auth/signup.tsx index 7ab3e1390..ca6d152de 100644 --- a/apps/mobile/app/components/auth/signup.tsx +++ b/apps/mobile/app/components/auth/signup.tsx @@ -273,8 +273,15 @@ export const Signup = ({ alignSelf: "center" }} > - - {strings.alreadyHaveAccount()}{" "} + + {strings.signupAgreement[0]()} { + const { colors, isDark } = useThemeColors(); // Gesture-driven tilt const tiltX = useSharedValue(0); // rotateX: finger up/down const tiltY = useSharedValue(0); // rotateY: finger left/right @@ -134,37 +136,37 @@ export const IntroIllustration = () => { cx={116} cy={105} r={104.75} - stroke="#1F2722" + stroke={colors.primary.border} strokeWidth={0.5} /> - + {/* ── Defs ── */} @@ -213,14 +215,20 @@ export const IntroIllustration = () => { width={46.5} height={46.5} rx={7.75} - fill="#1A1D1B" - stroke="#233C2D" + fill={isDark ? "#1A1D1B" : colors.secondary.background} + stroke={colors.primary.accent} strokeWidth={0.5} /> - + @@ -236,13 +244,13 @@ export const IntroIllustration = () => { width={31.5} height={31.5} rx={7.75} - fill="#1A1D1B" - stroke="#233C2D" + fill={isDark ? "#1A1D1B" : colors.secondary.background} + stroke={colors.primary.accent} strokeWidth={0.5} /> @@ -258,8 +266,8 @@ export const IntroIllustration = () => { width={34.5} height={34.5} rx={7.75} - fill="#1A1D1B" - stroke="#233C2D" + fill={isDark ? "#1A1D1B" : colors.secondary.background} + stroke={colors.primary.accent} strokeWidth={0.5} /> { height={18.3333} x={8.3334} y={8.333} - fill="#171F1A" + fill={colors.secondary.background} /> @@ -287,14 +295,14 @@ export const IntroIllustration = () => { width={42.5} height={42.5} rx={7.75} - fill="#1A1D1B" - stroke="#233C2D" + fill={isDark ? "#1A1D1B" : colors.secondary.background} + stroke={colors.primary.accent} strokeWidth={0.5} /> diff --git a/apps/mobile/app/components/intro/index.tsx b/apps/mobile/app/components/intro/index.tsx index fabb36957..90f907d8a 100644 --- a/apps/mobile/app/components/intro/index.tsx +++ b/apps/mobile/app/components/intro/index.tsx @@ -20,10 +20,11 @@ along with this program. If not, see . import { strings } from "@notesnook/intl"; import { useThemeColors } from "@notesnook/theme"; import React from "react"; -import { Linking, Platform, useWindowDimensions, View } from "react-native"; +import { Platform, useWindowDimensions, View } from "react-native"; import Animated, { FadeIn, FadeOut } from "react-native-reanimated"; import { SafeAreaView } from "react-native-safe-area-context"; import { Spacing } from "../../common/design/spacing"; +import useGlobalSafeAreaInsets from "../../hooks/use-global-safe-area-insets"; import useRotator from "../../hooks/use-rotator"; import Navigation from "../../services/navigation"; import SettingsService from "../../services/settings"; @@ -33,13 +34,12 @@ import Heading from "../ui/typography/heading"; import Paragraph from "../ui/typography/paragraph"; import { IntroIllustration } from "./illustration"; import { ProgressPills } from "./progress-pills"; -import useGlobalSafeAreaInsets from "../../hooks/use-global-safe-area-insets"; const Intro = () => { const { colors } = useThemeColors(); const { width } = useWindowDimensions(); const isTablet = width > 600; - const rotator = useRotator([0, 1, 2], 10000, true); + const rotator = useRotator([0], 10000, true); const insets = useGlobalSafeAreaInsets(); const renderItem = React.useCallback( @@ -62,14 +62,12 @@ const Intro = () => { key={heading.value()} fontFamily="SEMI_BOLD" fontSize="XXL" - style={{ - marginTop: index !== 0 ? -5 : undefined - }} > {heading.value()} ) : ( { ) : null} {item.body ? ( - + {item.body()} ) : null} @@ -107,7 +105,7 @@ const Intro = () => { ), - [colors.primary.accent, colors.secondary.background, isTablet, width] + [colors.primary.paragraph, colors.secondary.paragraph] ); return ( diff --git a/apps/mobile/app/components/intro/progress-pills.tsx b/apps/mobile/app/components/intro/progress-pills.tsx index 5c60fc1a2..cb2ffbda8 100644 --- a/apps/mobile/app/components/intro/progress-pills.tsx +++ b/apps/mobile/app/components/intro/progress-pills.tsx @@ -17,10 +17,10 @@ You should have received a copy of the GNU General Public License along with this program. If not, see . */ +import { useThemeColors } from "@notesnook/theme"; import React from "react"; import { View } from "react-native"; -import { useThemeColors } from "@notesnook/theme"; -import { Radius, Spacing } from "../../common/design/spacing"; +import { Spacing } from "../../common/design/spacing"; export const ProgressPills = (props: { activePillIndex: number; @@ -36,6 +36,7 @@ export const ProgressPills = (props: { > {new Array(props.count || 3).fill(0).map((item, index) => ( { @@ -298,7 +298,8 @@ const Input = ({ > {secureTextEntry && ( )} diff --git a/apps/mobile/app/components/ui/pressable/index.tsx b/apps/mobile/app/components/ui/pressable/index.tsx index 7e66e40e7..694db496a 100644 --- a/apps/mobile/app/components/ui/pressable/index.tsx +++ b/apps/mobile/app/components/ui/pressable/index.tsx @@ -86,7 +86,7 @@ const buttonTypes = ( } => ({ plain: { primary: "transparent", - text: colors.primary.paragraph, + text: colors.primary.buttonForeground, selected: colors.primary.hover, borderWidth: 0.8, borderSelectedColor: getColorLinearShade( @@ -97,7 +97,7 @@ const buttonTypes = ( }, "plain-outline": { primary: "transparent", - text: colors.primary.paragraph, + text: colors.primary.buttonForeground, selected: colors.primary.hover, borderWidth: 1, borderColor: colors.primary.border, @@ -116,7 +116,7 @@ const buttonTypes = ( }, secondary: { primary: colors.secondary.background, - text: colors.primary.paragraph, + text: colors.primary.buttonForeground, selected: colors.secondary.background, borderWidth: 0.8, borderColor: getColorLinearShade(colors.secondary.background, 0.05, isDark), @@ -128,7 +128,7 @@ const buttonTypes = ( }, selected: { primary: colors.selected.background, - text: colors.selected.paragraph, + text: colors.selected.buttonForeground, selected: colors.selected.background, borderWidth: 0.8, borderColor: getColorLinearShade(colors.selected.background, 0.05, isDark), @@ -225,7 +225,7 @@ const buttonTypes = ( }, errorShade: { primary: "transparent", - text: colors.error.paragraph, + text: colors.error.buttonForeground, selected: colors.error.background, borderWidth: 0.8, borderSelectedColor: getColorLinearShade( diff --git a/apps/mobile/app/screens/editor/source.ts b/apps/mobile/app/screens/editor/source.ts index 3f343edf2..ba7e06a44 100644 --- a/apps/mobile/app/screens/editor/source.ts +++ b/apps/mobile/app/screens/editor/source.ts @@ -28,5 +28,5 @@ const EditorMobileSourceUrl = * The url should be something like this: http://192.168.100.126:3000/index.html */ export const EDITOR_URI = __DEV__ - ? EditorMobileSourceUrl + ? "http://192.168.100.144:3000/index.html" : EditorMobileSourceUrl; diff --git a/apps/mobile/app/screens/editor/tiptap/use-editor-events.tsx b/apps/mobile/app/screens/editor/tiptap/use-editor-events.tsx index e1c8cac84..be827627b 100644 --- a/apps/mobile/app/screens/editor/tiptap/use-editor-events.tsx +++ b/apps/mobile/app/screens/editor/tiptap/use-editor-events.tsx @@ -721,6 +721,7 @@ export const useEditorEvents = ( break; } case EditorEvents.error: { + console.log(editorMessage.value.stack); presentSheet({ component: ( z5%CuVjouY1cqmdViU(0aQEy%ZJ&1S`@gThj9;7-OwDe$ghI#Ye_ulOLK4x}$$K;+G z0)&u`P9cH<+jk{Xxt8G*5}A@~bl-S!0*NoL5dtn(|A9j%%Bupt&j{fmgu;BRRNS9D z9)F2YWLVax$0WdhDn%JzmvMM(yiz^7RC*}#P?~Fpj_fN=KAOrS6fMYj?|8AgY68~7 zZV60EAaJ-iUaGFS@kGYYWs`#wM~+oK-2WgObgh&GDo7#kuTJNn^Xlwo=$y$yr>MF7 z5xIp=qiwRpgajmkGH;uSEeJ-WA7v(lq6w0Ni0dZ6brP_S_`%!eZA)d+nRVDtD3hoB z@&n|GD!5Jx{ewOr%%Ie8uy^ZLFLqp?5%3N67w8f%V?(i^T2p`;To_8KY=LXt2?>^h~_CHzuHOyz=W1ejWg_x8pM zD#MBf++vTf7ky3VMI0kBG$u5;70?WQJ2j(_KgLWOYq z=pKzym0(O%N;Qw}w){P6i>9&OygZx8ccfAs`9#+5XuM_Fe4J@_*xZkEmSkevl7{2% zrgd%}iO08e_rT--QXc-drnzT-;k+p2hNcDCnNhR5by?Mio{U&)zagV>{peG7rR=@~ zcdy?GWx!wm7}{H(4Qcgkcx3fSR$=$FvaDBdwv0%5TZ)} delta 319 zcmZ1yz9F!lfsuiMfs3Jmftf+UKUm+$UL>XrD6$5K6OwZi3mAA`on>HPxP<{X; zx^nW96Z-|G$pNKufc%i$#0tX#MtjCEpuhp3fI?nkZfb?q)crvI1E3{Y1^LA#4vQT& zGcc(803DFRz`}fc;s$$0^@$(c8PzviFlzE{wiMJBm6;-GJ3XG?<|_j?3(y<}hG)`A zRxo;UgPJ*$48!DuYBrP4s&P#It0p{ILOovJjqMcs6!u%}UpTxtws1V+l;OSTuM^)I{wV$)fmz@n(%igCeJK;OCWGeWAg!RuE3`fU0Px6BX#fBK diff --git a/apps/mobile/ios/nanoicons-fonts/notesnook-icons.ttf b/apps/mobile/ios/nanoicons-fonts/notesnook-icons.ttf index 71309033ca3e836514d040a1e6365d4f54f4eb3f..12319501491733e2c8579259f0c48e2dddadc902 100644 GIT binary patch delta 1069 zcmah|O=uHA6rMM;JG0rH+1+k`68uSHk|wli5{;0g)|y!S#k5uh^-ySoCKj<;G(x-> z5%CuVjouY1cqmdViU(0aQEy%ZJ&1S`@gThj9;7-OwDe$ghI#Ye_ulOLK4x}$$K;+G z0)&u`P9cH<+jk{Xxt8G*5}A@~bl-S!0*NoL5dtn(|A9j%%Bupt&j{fmgu;BRRNS9D z9)F2YWLVax$0WdhDn%JzmvMM(yiz^7RC*}#P?~Fpj_fN=KAOrS6fMYj?|8AgY68~7 zZV60EAaJ-iUaGFS@kGYYWs`#wM~+oK-2WgObgh&GDo7#kuTJNn^Xlwo=$y$yr>MF7 z5xIp=qiwRpgajmkGH;uSEeJ-WA7v(lq6w0Ni0dZ6brP_S_`%!eZA)d+nRVDtD3hoB z@&n|GD!5Jx{ewOr%%Ie8uy^ZLFLqp?5%3N67w8f%V?(i^T2p`;To_8KY=LXt2?>^h~_CHzuHOyz=W1ejWg_x8pM zD#MBf++vTf7ky3VMI0kBG$u5;70?WQJ2j(_KgLWOYq z=pKzym0(O%N;Qw}w){P6i>9&OygZx8ccfAs`9#+5XuM_Fe4J@_*xZkEmSkevl7{2% zrgd%}iO08e_rT--QXc-drnzT-;k+p2hNcDCnNhR5by?Mio{U&)zagV>{peG7rR=@~ zcdy?GWx!wm7}{H(4Qcgkcx3fSR$=$FvaDBdwv0%5TZ)} delta 319 zcmZ1yz9F!lfsuiMfs3Jmftf+UKUm+$UL>XrD6$5K6OwZi3mAA`on>HPxP<{X; zx^nW96Z-|G$pNKufc%i$#0tX#MtjCEpuhp3fI?nkZfb?q)crvI1E3{Y1^LA#4vQT& zGcc(803DFRz`}fc;s$$0^@$(c8PzviFlzE{wiMJBm6;-GJ3XG?<|_j?3(y<}hG)`A zRxo;UgPJ*$48!DuYBrP4s&P#It0p{ILOovJjqMcs6!u%}UpTxtws1V+l;OSTuM^)I{wV$)fmz@n(%igCeJK;OCWGeWAg!RuE3`fU0Px6BX#fBK diff --git a/packages/icons/svgs/eye-closed.svg b/packages/icons/svgs/eye-closed.svg new file mode 100644 index 000000000..55c8354c9 --- /dev/null +++ b/packages/icons/svgs/eye-closed.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/icons/svgs/eye-open.svg b/packages/icons/svgs/eye-open.svg new file mode 100644 index 000000000..1a9217f40 --- /dev/null +++ b/packages/icons/svgs/eye-open.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/theme-engine/types.ts b/packages/theme/src/theme-engine/types.ts index 9e535e3fe..08fa62c41 100644 --- a/packages/theme/src/theme-engine/types.ts +++ b/packages/theme/src/theme-engine/types.ts @@ -282,7 +282,7 @@ export type PreviewColors = { }; export const StaticColors = { - red: "#f44336", + red: "#F44336", orange: "#FF9800", yellow: "#FFD600", green: "#4CAF50", diff --git a/packages/theme/src/theme-engine/utils.ts b/packages/theme/src/theme-engine/utils.ts index a3ca06e09..f6d9b5e14 100644 --- a/packages/theme/src/theme-engine/utils.ts +++ b/packages/theme/src/theme-engine/utils.ts @@ -106,7 +106,9 @@ export function buildVariants( themeScope[variant]?.[color] || theme.scopes.base[variant]?.[color] || defaultThemeScope[variant]?.[color] || - defaultThemeBase[variant]?.[color] + defaultThemeBase[variant]?.[color] || + themeScope.primary?.[color] || + defaultThemeBase.primary?.[color] ); }