From 79b2273c7735d22e4bfd17e57a501a2ca70231fb Mon Sep 17 00:00:00 2001 From: itschip Date: Thu, 7 Dec 2023 22:35:54 +0100 Subject: [PATCH] feat(apps/phone): new icons --- apps/phone/package.json | 3 ++- .../apps/dialer/components/DialerNavBar.tsx | 10 ++++------ apps/phone/src/config/ThemeConfig.ts | 3 --- apps/phone/src/main.css | 20 +++++++++---------- .../os/apps/icons/material/app/BROWSER.tsx | 4 ++-- .../os/apps/icons/material/app/CALCULATOR.tsx | 4 ++-- .../src/os/apps/icons/material/app/CAMERA.tsx | 4 ++-- .../os/apps/icons/material/app/CONTACTS.tsx | 4 ++-- .../src/os/apps/icons/material/app/DIALER.tsx | 4 ++-- .../apps/icons/material/app/MARKETPLACE.tsx | 4 ++-- .../src/os/apps/icons/material/app/MATCH.tsx | 4 ++-- .../os/apps/icons/material/app/MESSAGES.tsx | 4 ++-- .../src/os/apps/icons/material/app/NOTES.tsx | 4 ++-- .../os/apps/icons/material/app/SETTINGS.tsx | 4 ++-- .../navigation-bar/components/Navigation.tsx | 2 -- apps/phone/tailwind.config.js | 5 +++++ pnpm-lock.yaml | 15 ++++++++++---- 17 files changed, 52 insertions(+), 46 deletions(-) diff --git a/apps/phone/package.json b/apps/phone/package.json index 3515a5eed..e191e72b2 100644 --- a/apps/phone/package.json +++ b/apps/phone/package.json @@ -23,7 +23,8 @@ "i18next": "^20.6.1", "jest": "^27.4.7", "jsonschema": "^1.4.0", - "lucide-react": "^0.125.0", + "lucide-react": "^0.294.0", + "non.geist": "^1.0.1", "notistack": "3.0.0-alpha.7", "parse-path": "^7.0.0", "parse-url": "^5.0.7", diff --git a/apps/phone/src/apps/dialer/components/DialerNavBar.tsx b/apps/phone/src/apps/dialer/components/DialerNavBar.tsx index 79e3bfd1a..2e4cb99bf 100644 --- a/apps/phone/src/apps/dialer/components/DialerNavBar.tsx +++ b/apps/phone/src/apps/dialer/components/DialerNavBar.tsx @@ -7,6 +7,7 @@ import PhoneIcon from '@mui/icons-material/Phone'; import PersonIcon from '@mui/icons-material/Person'; import HistoryIcon from '@mui/icons-material/History'; import { useTranslation } from 'react-i18next'; +import { Contact, History, Phone } from 'lucide-react'; const useStyles = makeStyles((theme: Theme) => ({ root: { @@ -31,26 +32,23 @@ const DialerNavBar: React.FC = () => { return ( } + icon={} to="/phone" /> } + icon={} to="/phone/dial" /> } + icon={} to="/phone/contacts" /> diff --git a/apps/phone/src/config/ThemeConfig.ts b/apps/phone/src/config/ThemeConfig.ts index 11a8b3136..1cdd1b104 100644 --- a/apps/phone/src/config/ThemeConfig.ts +++ b/apps/phone/src/config/ThemeConfig.ts @@ -3,9 +3,6 @@ import { ThemeOptions } from '@mui/material'; // Configure all of the phone's default themes here. export const PhoneThemes: Record = { 'taso-dark': { - typography: { - fontFamily: "'SegoeUI', 'Roboto', 'Arial', sans-serif", - }, components: { MuiDivider: { styleOverrides: { diff --git a/apps/phone/src/main.css b/apps/phone/src/main.css index cf7a0d0a5..a566c42b6 100644 --- a/apps/phone/src/main.css +++ b/apps/phone/src/main.css @@ -1,26 +1,26 @@ -@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap'); +@import url('non.geist'); @tailwind base; @tailwind components; @tailwind utilities; body { - font-family: 'Inter', sans-serif; - font-size: 20px; - margin: 0; - padding: 0; - width: 100vw; - height: 100vh; - overflow: hidden; + font-family: 'Geist Variable', sans-serif; + font-size: 20px; + margin: 0; + padding: 0; + width: 100vw; + height: 100vh; + overflow: hidden; } code { - font-family: 'Inter', sans-serif; + font-family: 'Geist Variable', sans-serif; } a, a:visited, a:hover, a:active { - text-decoration: none; + text-decoration: none; } diff --git a/apps/phone/src/os/apps/icons/material/app/BROWSER.tsx b/apps/phone/src/os/apps/icons/material/app/BROWSER.tsx index b3827b657..0829a1883 100644 --- a/apps/phone/src/os/apps/icons/material/app/BROWSER.tsx +++ b/apps/phone/src/os/apps/icons/material/app/BROWSER.tsx @@ -1,5 +1,5 @@ -import { Language } from '@mui/icons-material'; +import { ChromeIcon } from 'lucide-react'; -const BrowserIcon = () => ; +const BrowserIcon = () => ; export default BrowserIcon; diff --git a/apps/phone/src/os/apps/icons/material/app/CALCULATOR.tsx b/apps/phone/src/os/apps/icons/material/app/CALCULATOR.tsx index 4f0cd3de7..6918049c1 100644 --- a/apps/phone/src/os/apps/icons/material/app/CALCULATOR.tsx +++ b/apps/phone/src/os/apps/icons/material/app/CALCULATOR.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { CalculatorIcon } from '../../../../../apps/calculator/components/CalculatorIcon'; +import { Calculator as LCalc } from 'lucide-react'; -const Calculator: React.FC = () => ; +const Calculator: React.FC = () =>; export default Calculator; diff --git a/apps/phone/src/os/apps/icons/material/app/CAMERA.tsx b/apps/phone/src/os/apps/icons/material/app/CAMERA.tsx index 5165d4a4e..745da68d2 100644 --- a/apps/phone/src/os/apps/icons/material/app/CAMERA.tsx +++ b/apps/phone/src/os/apps/icons/material/app/CAMERA.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { CameraAlt } from '@mui/icons-material'; +import { Camera as LCamera } from 'lucide-react'; -const Camera: React.FC = () => ; +const Camera: React.FC = () => ; export default Camera; diff --git a/apps/phone/src/os/apps/icons/material/app/CONTACTS.tsx b/apps/phone/src/os/apps/icons/material/app/CONTACTS.tsx index ec555c702..ac245dfb2 100644 --- a/apps/phone/src/os/apps/icons/material/app/CONTACTS.tsx +++ b/apps/phone/src/os/apps/icons/material/app/CONTACTS.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Contacts } from '@mui/icons-material'; +import { BookUser } from 'lucide-react'; -const ContactIcon: React.FC = () => ; +const ContactIcon: React.FC = () => ; export default ContactIcon; diff --git a/apps/phone/src/os/apps/icons/material/app/DIALER.tsx b/apps/phone/src/os/apps/icons/material/app/DIALER.tsx index 0ef53fc98..685f4562d 100644 --- a/apps/phone/src/os/apps/icons/material/app/DIALER.tsx +++ b/apps/phone/src/os/apps/icons/material/app/DIALER.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Phone } from '@mui/icons-material'; +import { Phone } from 'lucide-react'; -const DialerIcon: React.FC = () => ; +const DialerIcon: React.FC = () => ; export default DialerIcon; diff --git a/apps/phone/src/os/apps/icons/material/app/MARKETPLACE.tsx b/apps/phone/src/os/apps/icons/material/app/MARKETPLACE.tsx index 78a14740b..8eadab1f5 100644 --- a/apps/phone/src/os/apps/icons/material/app/MARKETPLACE.tsx +++ b/apps/phone/src/os/apps/icons/material/app/MARKETPLACE.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MonetizationOn } from '@mui/icons-material'; +import { Store } from 'lucide-react'; -const MarketplaceIcon: React.FC = () => ; +const MarketplaceIcon: React.FC = () => export default MarketplaceIcon; diff --git a/apps/phone/src/os/apps/icons/material/app/MATCH.tsx b/apps/phone/src/os/apps/icons/material/app/MATCH.tsx index 3f4900ed2..d9956a294 100644 --- a/apps/phone/src/os/apps/icons/material/app/MATCH.tsx +++ b/apps/phone/src/os/apps/icons/material/app/MATCH.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Favorite } from '@mui/icons-material'; +import { HeartHandshake } from 'lucide-react'; -const MatchIcon: React.FC = () => ; +const MatchIcon: React.FC = () => export default MatchIcon; diff --git a/apps/phone/src/os/apps/icons/material/app/MESSAGES.tsx b/apps/phone/src/os/apps/icons/material/app/MESSAGES.tsx index 19b7a089b..a54c73acb 100644 --- a/apps/phone/src/os/apps/icons/material/app/MESSAGES.tsx +++ b/apps/phone/src/os/apps/icons/material/app/MESSAGES.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Message } from '@mui/icons-material'; +import { MessageSquare } from 'lucide-react'; -const MessagesIcon: React.FC = () => ; +const MessagesIcon: React.FC = () => ; export default MessagesIcon; diff --git a/apps/phone/src/os/apps/icons/material/app/NOTES.tsx b/apps/phone/src/os/apps/icons/material/app/NOTES.tsx index fd429f597..d6231ef3b 100644 --- a/apps/phone/src/os/apps/icons/material/app/NOTES.tsx +++ b/apps/phone/src/os/apps/icons/material/app/NOTES.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import StickyNote from '../misc/StickyNote'; +import { StickyNote } from 'lucide-react'; -const NotesIcon: React.FC = () => ; +const NotesIcon: React.FC = () => export default NotesIcon; diff --git a/apps/phone/src/os/apps/icons/material/app/SETTINGS.tsx b/apps/phone/src/os/apps/icons/material/app/SETTINGS.tsx index fa6bdd378..3eb38180c 100644 --- a/apps/phone/src/os/apps/icons/material/app/SETTINGS.tsx +++ b/apps/phone/src/os/apps/icons/material/app/SETTINGS.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Settings } from '@mui/icons-material'; +import { Settings } from 'lucide-react'; -const SettingsIcon: React.FC = () => ; +const SettingsIcon: React.FC = () => ; export default SettingsIcon; diff --git a/apps/phone/src/os/navigation-bar/components/Navigation.tsx b/apps/phone/src/os/navigation-bar/components/Navigation.tsx index 16c12508a..ef3d27c1f 100644 --- a/apps/phone/src/os/navigation-bar/components/Navigation.tsx +++ b/apps/phone/src/os/navigation-bar/components/Navigation.tsx @@ -1,14 +1,12 @@ import React from 'react'; import { useHistory, useRouteMatch } from 'react-router-dom'; import { usePhone } from '@os/phone/hooks/usePhone'; -//import { useNotifications } from '@os/notifications/hooks/useNotifications'; import { ChevronLeft, Circle, LayoutGrid } from 'lucide-react'; export const Navigation: React.FC = () => { const history = useHistory(); const { isExact } = useRouteMatch('/'); const { closePhone } = usePhone(); - //const { setBarUncollapsed } = useNotifications(); const handleGoBackInHistory = () => { history.goBack(); diff --git a/apps/phone/tailwind.config.js b/apps/phone/tailwind.config.js index 78256c7f9..91dcc4fcd 100644 --- a/apps/phone/tailwind.config.js +++ b/apps/phone/tailwind.config.js @@ -3,4 +3,9 @@ module.exports = { content: ['./src/**/*.{js,jsx,ts,tsx}'], darkMode: 'class', plugins: [], + extend: { + fontFamily: { + sans: ['var(--font-geist-sans)'], + }, + }, }; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index ece755f00..f04bd1857 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -269,8 +269,11 @@ importers: specifier: ^1.4.0 version: 1.4.0 lucide-react: - specifier: ^0.125.0 - version: 0.125.0(react@17.0.2) + specifier: ^0.294.0 + version: 0.294.0(react@17.0.2) + non.geist: + specifier: ^1.0.1 + version: 1.0.1 notistack: specifier: 3.0.0-alpha.7 version: 3.0.0-alpha.7(csstype@3.1.2)(react-dom@17.0.2)(react@17.0.2) @@ -12904,8 +12907,8 @@ packages: resolution: {integrity: sha512-Pn9cox5CsMYngeDbmChANltQl+5pi6XmTrraMSzhPmMBbmgcxmqWry0U3PGapCU1yB4/LqCcom7qhHZiF/jGfQ==} dev: true - /lucide-react@0.125.0(react@17.0.2): - resolution: {integrity: sha512-tadphtB6TPytEitR9vX75hqu9PQT/uz5RcvXMq976nC190eukAM9+cHMgBxfvfEGDXwIhIT9aFxTUGdAjxw9uQ==} + /lucide-react@0.294.0(react@17.0.2): + resolution: {integrity: sha512-V7o0/VECSGbLHn3/1O67FUgBwWB+hmzshrgDVRJQhMh8uj5D3HBuIvhuAmQTtlupILSplwIZg5FTc4tTKMA2SA==} peerDependencies: react: ^16.5.1 || ^17.0.0 || ^18.0.0 dependencies: @@ -13472,6 +13475,10 @@ packages: undefsafe: 2.0.5 dev: true + /non.geist@1.0.1: + resolution: {integrity: sha512-ZSwOVXxDpqGVxNLFjXW7Hf6PjDsQMLPWLc2K6qzRWiTRgeEzzVjF4hEdBy5+nSWHQRryfQuEKjdvle3OJ6gbiQ==} + dev: false + /nopt@1.0.10: resolution: {integrity: sha512-NWmpvLSqUrgrAC9HCuxEvb+PSloHpqVu+FqcO4eeF2h5qYRhA7ev6KvelyQAKtegUbC6RypJnlEOhd8vloNKYg==} hasBin: true