diff --git a/src/pages/Popup/HomePage.tsx b/src/pages/Popup/HomePage.tsx
index 1f048a4..07fcd0c 100644
--- a/src/pages/Popup/HomePage.tsx
+++ b/src/pages/Popup/HomePage.tsx
@@ -1,24 +1,24 @@
import React, { useState, useEffect } from 'react'
-import { Box } from 'theme-ui'
+import { Box, Flex, Button } from 'theme-ui'
import LocationInput from './LocationInput'
import ConfigurationSelect from './ConfigurationSelect'
import IPData from './IPData'
import getIP from '../../utils/getIP'
+import { Power } from 'react-feather'
const LocationPage = () => {
- const [ip, setIP] = useState(null)
- const [configuration, setConfiguration] = useState('default')
+ const [on, setOn] = useState(true)
- useEffect(() => {
- chrome.storage.sync.get(['configuration', 'ipData'], (result) => {
- result.configuration && setConfiguration(result.configuration)
- if (result.ipData) {
- setIP(result.ipData)
- } else {
- Promise.resolve(getIP()).then((ipData) => setIP(ipData))
- }
- })
- }, [])
+ // useEffect(() => {
+ // chrome.storage.sync.get(['configuration', 'ipData'], (result) => {
+ // result.configuration && setConfiguration(result.configuration)
+ // if (result.ipData) {
+ // setIP(result.ipData)
+ // } else {
+ // Promise.resolve(getIP()).then((ipData) => setIP(ipData))
+ // }
+ // })
+ // }, [])
return (
{
width: '100%',
}}
>
- Location
-
- {configuration === 'match' && }
-
-
-
-
+
+
+
)
}
diff --git a/src/pages/Popup/Popup.tsx b/src/pages/Popup/Popup.tsx
index 2c9403e..d6e31b3 100644
--- a/src/pages/Popup/Popup.tsx
+++ b/src/pages/Popup/Popup.tsx
@@ -1,12 +1,12 @@
import React, { useState } from 'react'
import { ThemeProvider, Flex } from 'theme-ui'
import { theme } from '../../theme'
-import { Home, MapPin, Globe, Command, List } from 'react-feather'
+import { Home, MapPin, Globe, Command, List, ExternalLink } from 'react-feather'
import TabItem from './TabItem'
import Page from './Page'
const Popup = () => {
- const [tab, setTab] = useState(2)
+ const [tab, setTab] = useState(1)
return (
@@ -24,11 +24,15 @@ const Popup = () => {
flexDirection: 'column',
}}
>
- setTab(0)} />
+ {/* setTab(0)} /> */}
setTab(1)} />
setTab(2)} />
- setTab(3)} />
- setTab(4)} />
+ {/* setTab(3)} /> */}
+ setTab(3)} />
+ window.open('https://vytal.io')}
+ />
diff --git a/src/theme.ts b/src/theme.ts
index 6190f75..236b3b1 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -4,8 +4,13 @@ export const theme: Theme = {
colors: {
text: '#333333',
background: '#FDFDFD',
- primary: '#a965d1',
- primaryDark: '#8750A7',
+ primary: '#a55eea',
+ primaryDark: '#9454d2',
+ red: '#fc5c65',
+ redDark: '#e2525a',
+ green: '#26de81',
+ greenDark: '#22c774',
+ grey: '#BCC2C9',
},
styles: {
root: {
@@ -48,5 +53,18 @@ export const theme: Theme = {
bg: 'primaryDark',
},
},
+ power: {
+ display: 'flex',
+ alignItems: 'center',
+ justifyContent: 'center',
+ py: '12px',
+ px: '16px',
+ color: 'background',
+ borderRadius: '50%',
+ cursor: 'pointer',
+ // '&:hover': {
+ // bg: 'primaryDark',
+ // },
+ },
},
}