vpn page
This commit is contained in:
z0ccc
parent
481b575b92
commit
2592ea3f41
9 changed files with 213 additions and 15 deletions
|
|
@ -1,5 +1,5 @@
|
|||
import { useState, useEffect, ChangeEvent, useCallback } from 'react'
|
||||
import { Box, Flex, Label, Radio, Select } from 'theme-ui'
|
||||
import { Box, Button, Flex, Label, Link, Radio, Select } from 'theme-ui'
|
||||
import Page from '../../Components/Page'
|
||||
import DebouncedInput from '../../Components/DebouncedInput'
|
||||
import detachDebugger from '../../../utils/detachDebugger'
|
||||
|
|
@ -12,9 +12,10 @@ import { RotateCw } from 'react-feather'
|
|||
|
||||
interface LocationPageProps {
|
||||
tab: string
|
||||
setTab: (tab: string) => void
|
||||
}
|
||||
|
||||
const LocationPage = ({ tab }: LocationPageProps) => {
|
||||
const LocationPage = ({ tab, setTab }: LocationPageProps) => {
|
||||
const [ipData, setIpData] = useState<ipData>()
|
||||
const [ipInfo, setIpInfo] = useState('loading...')
|
||||
const [locationType, setLocationType] = useState('')
|
||||
|
|
@ -273,7 +274,22 @@ const LocationPage = ({ tab }: LocationPageProps) => {
|
|||
onChange={changeInputText}
|
||||
mb="12px"
|
||||
/>
|
||||
<FooterLink />
|
||||
<Box
|
||||
sx={{
|
||||
color: 'text',
|
||||
mb: '8px',
|
||||
fontSize: '11px',
|
||||
position: 'fixed',
|
||||
bottom: '0',
|
||||
}}
|
||||
>
|
||||
Vytal does not change your IP address. To change your IP address you
|
||||
will need a{' '}
|
||||
<Button variant="text" onClick={() => setTab('vpn')}>
|
||||
VPN or proxy
|
||||
</Button>
|
||||
.
|
||||
</Box>
|
||||
</Page>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ interface InfoItemProps {
|
|||
children: React.ReactNode
|
||||
}
|
||||
|
||||
const SettingsPage = ({ title, children }: InfoItemProps) => {
|
||||
const InfoItem = ({ title, children }: InfoItemProps) => {
|
||||
return (
|
||||
<Box sx={{ mb: '12px' }}>
|
||||
<Flex sx={{ fontWeight: '700', mb: '2px' }}>{title}</Flex>
|
||||
|
|
@ -14,4 +14,4 @@ const SettingsPage = ({ title, children }: InfoItemProps) => {
|
|||
)
|
||||
}
|
||||
|
||||
export default SettingsPage
|
||||
export default InfoItem
|
||||
|
|
|
|||
|
|
@ -1,12 +1,13 @@
|
|||
import { Link, Text } from 'theme-ui'
|
||||
import { Button, Link, Text } from 'theme-ui'
|
||||
import Page from '../../Components/Page'
|
||||
import InfoItem from './InfoItem'
|
||||
|
||||
interface SystemPageProps {
|
||||
interface SettingsPageProps {
|
||||
tab: string
|
||||
setTab: (tab: string) => void
|
||||
}
|
||||
|
||||
const SettingsPage = ({ tab }: SystemPageProps) => {
|
||||
const SettingsPage = ({ tab, setTab }: SettingsPageProps) => {
|
||||
return (
|
||||
<Page isCurrentTab={tab === 'settings'} title={'Info'}>
|
||||
<InfoItem title={'Hide Debugging Notification Bar'}>
|
||||
|
|
@ -27,7 +28,11 @@ const SettingsPage = ({ tab }: SystemPageProps) => {
|
|||
</InfoItem>
|
||||
<InfoItem title={'Change IP Address'}>
|
||||
Vytal does not change your IP address. To change your IP address you
|
||||
will need a VPN or proxy.
|
||||
will need a{' '}
|
||||
<Button variant="text" onClick={() => setTab('vpn')}>
|
||||
VPN or proxy
|
||||
</Button>
|
||||
.
|
||||
</InfoItem>
|
||||
{/* <InfoItem title={'Vytal vs Similar Extensions'}>
|
||||
Vytal utilizes the debugger API to spoof data which is completely
|
||||
|
|
|
|||
43
src/Popup/Pages/VpnPage/VpnItem.tsx
Normal file
43
src/Popup/Pages/VpnPage/VpnItem.tsx
Normal file
|
|
@ -0,0 +1,43 @@
|
|||
import { Box, Link } from 'theme-ui'
|
||||
|
||||
interface VpnItemProps {
|
||||
url: string
|
||||
children: React.ReactNode
|
||||
}
|
||||
|
||||
const VpnItem = ({ url, children }: VpnItemProps) => {
|
||||
return (
|
||||
<Link
|
||||
href={url}
|
||||
sx={{
|
||||
border: '1px solid',
|
||||
borderRadius: '4px',
|
||||
borderColor: 'grey',
|
||||
p: '16px',
|
||||
mb: '16px',
|
||||
display: 'block',
|
||||
textDecoration: 'none',
|
||||
color: 'text',
|
||||
'&:hover': {
|
||||
borderColor: 'primary',
|
||||
},
|
||||
}}
|
||||
target="_blank"
|
||||
>
|
||||
{children}
|
||||
<Box
|
||||
sx={{
|
||||
color: 'primaryDark',
|
||||
textDecoration: 'none',
|
||||
'&:hover': {
|
||||
textDecoration: 'underline',
|
||||
},
|
||||
}}
|
||||
>
|
||||
Learn more
|
||||
</Box>
|
||||
</Link>
|
||||
)
|
||||
}
|
||||
|
||||
export default VpnItem
|
||||
32
src/Popup/Pages/VpnPage/index.tsx
Normal file
32
src/Popup/Pages/VpnPage/index.tsx
Normal file
|
|
@ -0,0 +1,32 @@
|
|||
import { Box, Image } from 'theme-ui'
|
||||
import Page from '../../Components/Page'
|
||||
import VpnItem from './VpnItem'
|
||||
import nordLogo from '../../../assets/nord.svg'
|
||||
import protonLogo from '../../../assets/proton.svg'
|
||||
|
||||
interface VpnPageProps {
|
||||
tab: string
|
||||
}
|
||||
|
||||
const VpnPage = ({ tab }: VpnPageProps) => {
|
||||
return (
|
||||
<Page isCurrentTab={tab === 'vpn'} title={'VPN Recommendations'}>
|
||||
<VpnItem url="https://go.nordvpn.net/aff_c?offer_id=658&aff_id=79520">
|
||||
<Image src={nordLogo} alt="Vpn logo" variant="vpnLogo" />
|
||||
<li>Verified zero-logs policy & no IP leaks</li>
|
||||
<li>5,600+ servers in 59 countries</li>
|
||||
<li>24/7 live chat support</li>
|
||||
</VpnItem>
|
||||
<VpnItem url="https://go.getproton.me/aff_c?offer_id=26&aff_id=3825">
|
||||
<Image src={protonLogo} alt="Proton logo" variant="vpnLogo" />
|
||||
<Box>
|
||||
<li>Verified zero-logs policy & no IP leaks</li>
|
||||
<li>1,885 servers in 67 countries</li>
|
||||
<li>All apps are open-source & audited</li>
|
||||
</Box>
|
||||
</VpnItem>
|
||||
</Page>
|
||||
)
|
||||
}
|
||||
|
||||
export default VpnPage
|
||||
|
|
@ -15,6 +15,7 @@ import VpnIcon from '../assets/vpnIcon.svg'
|
|||
import TabItem from './TabItem'
|
||||
import LocationPage from './Pages/LocationPage'
|
||||
import UserAgentPage from './Pages/UserAgentPage'
|
||||
import VpnPage from './Pages/VpnPage'
|
||||
import SettingsPage from './Pages/SettingsPage'
|
||||
import '../assets/global.css'
|
||||
|
||||
|
|
@ -57,11 +58,11 @@ const Popup = () => {
|
|||
active={tab === 'userAgent'}
|
||||
onClick={() => setTab('userAgent')}
|
||||
/>
|
||||
{/* <TabItem
|
||||
<TabItem
|
||||
Icon={<img src={VpnIcon} className="App-logo" alt="logo" />}
|
||||
active={tab === 'vpn'}
|
||||
onClick={() => setTab('vpn')}
|
||||
/> */}
|
||||
/>
|
||||
{/* <TabItem
|
||||
Icon={<Sliders size={20} />}
|
||||
active={tab === 'settings'}
|
||||
|
|
@ -74,9 +75,10 @@ const Popup = () => {
|
|||
/>
|
||||
</Flex>
|
||||
<Box sx={{ m: '16px', width: '100%' }}>
|
||||
<LocationPage tab={tab} />
|
||||
<LocationPage tab={tab} setTab={setTab} />
|
||||
<UserAgentPage tab={tab} />
|
||||
<SettingsPage tab={tab} />
|
||||
<VpnPage tab={tab} />
|
||||
<SettingsPage tab={tab} setTab={setTab} />
|
||||
</Box>
|
||||
</Flex>
|
||||
</ThemeProvider>
|
||||
|
|
|
|||
14
src/assets/nord.svg
Normal file
14
src/assets/nord.svg
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="720px" height="158px" viewBox="0 0 720 158" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<!-- Generator: Sketch 51.1 (57501) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>nord-logo-horizontal</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="nord-logo-horizontal" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="global/logos/horizontal/nordvpn">
|
||||
<path d="M709.840683,65.915493 C704.225352,65.915493 699.71831,61.3797695 699.71831,55.7746479 C699.71831,50.206402 704.225352,45.6338028 709.840683,45.6338028 C715.456015,45.6338028 720,50.206402 720,55.7746479 C720,61.3797695 715.456015,65.915493 709.840683,65.915493 Z M709.840683,47.4775928 C705.296698,47.4775928 701.639344,51.1651729 701.639344,55.7746479 C701.639344,60.3841229 705.296698,64.0717029 709.840683,64.0717029 C714.347726,64.0717029 718.078966,60.3841229 718.078966,55.7746479 C718.078966,51.1651729 714.347726,47.4775928 709.840683,47.4775928 Z M708.326022,57.3971831 L708.326022,61.5641485 L705.924729,61.5641485 L705.924729,49.9851472 L710.505657,49.9851472 C712.759178,49.9851472 714.643269,51.1651729 714.643269,53.6358515 C714.643269,55.3690141 713.719695,56.4384123 712.426691,56.9546735 L714.827984,61.5641485 L712.205033,61.5641485 L710.099284,57.3971831 L708.326022,57.3971831 Z M712.205033,53.7096031 C712.205033,52.5664533 711.244516,52.2714469 710.320942,52.2714469 L708.326022,52.2714469 L708.326022,55.1477593 L710.357885,55.1477593 C711.244516,55.1477593 712.205033,54.7790013 712.205033,53.7096031 Z" id="®" fill="#373B42"></path>
|
||||
<path d="M300.067602,121.690141 L265.385912,69.6676056 L265.385912,121.690141 L249.971827,121.690141 L249.971827,46.2574648 L267.794362,46.2574648 L300.549292,95.4861972 L300.549292,46.2574648 L315.963376,46.2574648 L315.963376,121.690141 L300.067602,121.690141 Z M325.145915,96.0642254 C325.145915,80.7464789 337.766197,69.0895775 353.372958,69.0895775 C368.88338,69.0895775 381.310986,80.4574648 381.310986,95.7752113 C381.310986,111.285634 368.690704,122.846197 353.180282,122.846197 C337.573521,122.846197 325.145915,111.574648 325.145915,96.0642254 Z M340.56,95.8715493 C340.56,103.67493 346.243944,109.069859 353.27662,109.069859 C360.309296,109.069859 365.896901,103.67493 365.896901,95.8715493 C365.896901,88.164507 360.212958,82.7695775 353.180282,82.7695775 C346.147606,82.7695775 340.56,88.164507 340.56,95.8715493 Z M418.157731,70.2456338 L418.157731,84.9853521 C416.134632,84.6 414.015196,84.6 413.34083,84.6 C406.115477,84.6 401.1059,89.6095775 401.1059,99.1470423 L401.1059,121.690141 L386.366182,121.690141 L386.366182,70.2456338 L400.62421,70.2456338 L400.62421,77.76 L400.816886,77.76 C403.610689,71.8833803 408.812942,69.6676056 414.111534,69.6676056 C415.26759,69.6676056 417.098013,69.9566197 418.157731,70.2456338 Z M461.565634,121.690141 L461.565634,115.139155 L461.372958,115.139155 C456.556056,122.171831 448.849014,122.653521 445.380845,122.653521 C430.448451,122.653521 420.910986,109.744225 420.910986,95.8715493 C420.910986,82.8659155 430.833803,69.2822535 445.573521,69.2822535 C448.56,69.2822535 455.689014,69.8602817 460.987606,76.1222535 L461.180282,76.1222535 L461.180282,43.2709859 L476.112676,43.2709859 L476.112676,121.690141 L461.565634,121.690141 Z M461.565634,95.8715493 C461.565634,88.164507 455.88169,82.8659155 448.849014,82.8659155 C441.816338,82.8659155 436.132394,88.164507 436.132394,95.8715493 C436.132394,103.67493 441.816338,109.069859 448.849014,109.069859 C455.88169,109.069859 461.565634,103.67493 461.565634,95.8715493 Z M508.051268,121.690141 L480.787606,46.2574648 L497.646761,46.2574648 L517.20338,103.578592 L536.856338,46.2574648 L553.426479,46.2574648 L526.066479,121.690141 L508.051268,121.690141 Z M614.844507,70.4383099 C614.844507,87.1047887 603.091268,95.1008451 587.291831,95.1008451 L575.442254,95.1008451 L575.442254,121.690141 L559.835493,121.690141 L559.835493,46.2574648 L587.869859,46.2574648 C602.99493,46.2574648 614.844507,54.4461972 614.844507,70.4383099 Z M599.141408,70.823662 C599.141408,63.5019718 592.975775,60.9971831 586.521127,60.9971831 L575.442254,60.9971831 L575.442254,80.5538028 L586.617465,80.5538028 C592.783099,80.5538028 599.141408,77.856338 599.141408,70.823662 Z M672.794366,121.690141 L638.112676,69.6676056 L638.112676,121.690141 L622.698592,121.690141 L622.698592,46.2574648 L640.521127,46.2574648 L673.276056,95.4861972 L673.276056,46.2574648 L688.690141,46.2574648 L688.690141,121.690141 L672.794366,121.690141 Z" id="NordVPN" fill="#373B42"></path>
|
||||
<path d="M18.8134777,157.183099 C6.97925691,140.855593 0,120.766132 0,99.0432916 C0,44.3431921 44.2539653,0 98.8439981,0 C153.434031,0 197.687996,44.3431921 197.687996,99.0432916 C197.687996,120.765991 190.70883,140.855331 178.87475,157.18278 L131.400097,79.9339131 L126.815565,87.6900449 L131.466937,109.261148 L98.8439981,53.3310032 L78.663402,87.4726248 L83.361656,109.261148 L66.2617567,79.9781408 L18.8134777,157.183099 Z" id="logomark" fill="#4687FF"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5 KiB |
69
src/assets/proton.svg
Normal file
69
src/assets/proton.svg
Normal file
|
|
@ -0,0 +1,69 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 26.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 4520 787" style="enable-background:new 0 0 4520 787;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{clip-path:url(#SVGID_00000101076283012793058550000013277607966434688140_);}
|
||||
.st1{fill:#6D4AFF;}
|
||||
.st2{fill:#1B1340;}
|
||||
.st3{fill-rule:evenodd;clip-rule:evenodd;fill:#6D4AFF;}
|
||||
.st4{fill-rule:evenodd;clip-rule:evenodd;fill:url(#SVGID_00000143612414778509468690000005354010894178983867_);}
|
||||
.st5{fill:url(#SVGID_00000164510369689970512730000008890151008062097281_);}
|
||||
</style>
|
||||
<g>
|
||||
<defs>
|
||||
<rect id="SVGID_1_" width="4520" height="787"/>
|
||||
</defs>
|
||||
<clipPath id="SVGID_00000124143326424118090040000000686822535870151078_">
|
||||
<use xlink:href="#SVGID_1_" style="overflow:visible;"/>
|
||||
</clipPath>
|
||||
<g style="clip-path:url(#SVGID_00000124143326424118090040000000686822535870151078_);">
|
||||
<path class="st1" d="M3909.1,150h-223.4v483.9h88.5V513.4c0-11.7,4.7-23,13-31.3c8.3-8.3,19.5-12.9,31.2-12.9h90.7
|
||||
c42.2,0,82.7-16.8,112.6-46.6c29.9-29.9,46.7-70.4,46.7-112.6c0.1-21-4-41.8-11.9-61.2c-8-19.4-19.7-37-34.5-51.9
|
||||
c-14.8-14.9-32.4-26.7-51.8-34.7C3950.8,154.1,3930,150,3909.1,150L3909.1,150z M3978.7,308.8c0,9.9-1.9,19.7-5.8,28.9
|
||||
c-3.8,9.2-9.4,17.5-16.4,24.5c-7,7-15.4,12.6-24.5,16.3c-9.2,3.8-19,5.7-28.9,5.7h-129.4V233.4h129.4c10,0,19.8,2,29,5.8
|
||||
c9.2,3.8,17.5,9.4,24.5,16.5c7,7,12.6,15.4,16.3,24.6c3.8,9.2,5.7,19.1,5.6,29L3978.7,308.8z"/>
|
||||
<path class="st1" d="M3374.9,632.1l-178.3-483.5h100.7l117.3,346c4.6,12.4,7.9,25.2,9.9,38.2h1c1.4-13.2,4.8-26,9.9-38.2
|
||||
l117.6-346h101.3l-179.2,483.5H3374.9z"/>
|
||||
<path class="st1" d="M4101.3,632.1V148.6h77.5l228.3,299.9c8.2,10.3,15.3,21.5,21.3,33.2h1.4c-1.5-14.6-2.3-29.2-2.2-43.9V148.6
|
||||
h91.5v483.5h-77.5l-228.9-299.9c-8.1-10.4-15.2-21.5-21.2-33.2h-0.8c1.2,14.6,1.7,29.2,1.5,43.9v289.3H4101.3z"/>
|
||||
<path class="st2" d="M1434.2,147.2h-223.4v483.9h88.5V510.6c0-11.7,4.7-23,12.9-31.3c8.3-8.3,19.5-12.9,31.2-12.9h90.7
|
||||
c42.2,0,82.7-16.8,112.6-46.6s46.6-70.4,46.6-112.6c0.1-21-4-41.8-11.9-61.2c-8-19.4-19.7-37-34.5-51.9
|
||||
c-14.8-14.9-32.4-26.7-51.8-34.7C1475.9,151.3,1455.2,147.2,1434.2,147.2L1434.2,147.2z M1503.9,306c0,9.9-1.9,19.7-5.8,28.9
|
||||
c-3.8,9.2-9.4,17.5-16.4,24.5c-7,7-15.3,12.6-24.5,16.3c-9.2,3.8-19,5.7-28.9,5.7h-129.4V230.6h129.4c9.9,0,19.8,2,29,5.8
|
||||
c9.2,3.8,17.5,9.4,24.5,16.5c7,7,12.6,15.4,16.3,24.6c3.8,9.2,5.7,19.1,5.6,29L1503.9,306z"/>
|
||||
<path class="st2" d="M1607.4,631.3v-192c0-78.3,45.8-140.6,137.3-140.6c14.7-0.2,29.4,1.4,43.7,4.8v79
|
||||
c-10.4-0.7-19.9-0.7-23.6-0.7c-48.5,0-69.7,22.2-69.7,67.2v182.4H1607.4z"/>
|
||||
<path class="st2" d="M1814.6,468.3c0-96.3,72.8-169.7,174-169.7c101.2,0,173.9,73.5,173.9,169.7c0,96.3-72.8,170.5-173.9,170.5
|
||||
S1814.6,564.7,1814.6,468.3z M2075.9,468.3c0-54.7-36.7-93.6-87.3-93.6c-50.6,0-87.4,38.8-87.4,93.6c0,54.7,36.7,93.6,87.4,93.6
|
||||
C2039.3,561.9,2075.9,523.8,2075.9,468.3L2075.9,468.3z"/>
|
||||
<path class="st2" d="M2417.5,375.4h-94.9v121.3c0,42.3,15.2,61.6,58.8,61.6c4.2,0,14.6,0,27.8-0.7v71.5
|
||||
c-16.7,4.8-33.9,7.3-51.3,7.6c-73.5,0-123.4-44.3-123.4-128.2V375.4h-58.8v-69.7h14.6c11.7,0,23-4.7,31.2-12.9
|
||||
c8.3-8.3,12.9-19.5,12.9-31.2v-66.3h88.1v110.2h94.9V375.4z"/>
|
||||
<path class="st2" d="M2443.9,468.3c0-96.3,72.8-169.7,173.9-169.7c101.1,0,174,73.5,174,169.7c0,96.3-72.8,170.5-174,170.5
|
||||
S2443.9,564.7,2443.9,468.3z M2705.2,468.3c0-54.7-36.7-93.6-87.4-93.6s-87.3,38.8-87.3,93.6c0,54.7,36.7,93.6,87.3,93.6
|
||||
C2668.4,561.9,2705.2,523.8,2705.2,468.3z"/>
|
||||
<path class="st2" d="M2837.5,631.3V445.8c0-86,54.8-147.6,152.5-147.6c97.8,0,151.8,62,151.8,147.6v185h-87.3V453.1
|
||||
c0-47.8-21.5-77.6-64.5-77.6s-64.4,29.9-64.4,77.6v178.2H2837.5z"/>
|
||||
<path class="st3" d="M346.1,740.3c32.8,59.3,116.9,62.6,154,5.9l346.7-528.4c36.8-56,1.6-131.2-65-138.8L100.4,0.9
|
||||
C27.7-7.5-24,69.8,11.3,133.8L346.1,740.3z"/>
|
||||
|
||||
<linearGradient id="SVGID_00000083796956185287615240000010885015769944861357_" gradientUnits="userSpaceOnUse" x1="536.4819" y1="1113.179" x2="292.8189" y2="64.084" gradientTransform="matrix(1 0 0 -1 0 788)">
|
||||
<stop offset="0.4799" style="stop-color:#24ECC6;stop-opacity:0"/>
|
||||
<stop offset="0.9944" style="stop-color:#24ECC6"/>
|
||||
</linearGradient>
|
||||
<path style="fill-rule:evenodd;clip-rule:evenodd;fill:url(#SVGID_00000083796956185287615240000010885015769944861357_);" d="
|
||||
M346.1,740.3c32.8,59.3,116.9,62.6,154,5.9l346.7-528.4c36.8-56,1.6-131.2-65-138.8L100.4,0.8C27.8-7.5-24,69.7,11.4,133.7
|
||||
L346.1,740.3z"/>
|
||||
|
||||
<linearGradient id="SVGID_00000005978595599017039650000002259067875620926859_" gradientUnits="userSpaceOnUse" x1="759.6771" y1="79.3122" x2="219.4247" y2="1003.199" gradientTransform="matrix(1 0 0 -1 0 788)">
|
||||
<stop offset="6.601250e-02" style="stop-color:#ABFFEF"/>
|
||||
<stop offset="0.4499" style="stop-color:#CAC9FF"/>
|
||||
<stop offset="1" style="stop-color:#6D4AFF"/>
|
||||
</linearGradient>
|
||||
<path style="fill:url(#SVGID_00000005978595599017039650000002259067875620926859_);" d="M396.4,638.7L365.6,685
|
||||
c-12.5,18.7-40.4,17.6-51.2-2.1l31.7,57.5c5.7,10.2,12.8,18.8,21.1,25.7l0,0c39.3,33,102.2,27.1,133-19.8l346.7-528.4
|
||||
c36.8-56,1.6-131.2-65-138.8L100.4,0.9C27.7-7.5-24,69.8,11.3,133.8l2.7,4.9l580.1,67.1c37,4.3,56.5,46,36,77.1L396.4,638.7z"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.3 KiB |
21
src/theme.ts
21
src/theme.ts
|
|
@ -19,12 +19,14 @@ export const theme: Theme = {
|
|||
fontSize: '18px',
|
||||
lineHeight: '22px',
|
||||
margin: '0',
|
||||
li: {
|
||||
mb: '4px',
|
||||
},
|
||||
},
|
||||
},
|
||||
forms: {
|
||||
label: { width: 'auto', alignItems: 'center' },
|
||||
input: {
|
||||
// border: '2px solid',
|
||||
p: '4px 8px',
|
||||
mb: '8px',
|
||||
borderColor: 'grey',
|
||||
|
|
@ -34,7 +36,6 @@ export const theme: Theme = {
|
|||
},
|
||||
},
|
||||
select: {
|
||||
// border: '2px solid',
|
||||
cursor: 'pointer',
|
||||
p: '4px 8px',
|
||||
borderColor: 'grey',
|
||||
|
|
@ -67,6 +68,15 @@ export const theme: Theme = {
|
|||
p: 0,
|
||||
m: 0,
|
||||
},
|
||||
text: {
|
||||
all: 'unset',
|
||||
cursor: 'pointer',
|
||||
color: 'primaryDark',
|
||||
textDecoration: 'none',
|
||||
'&:hover': {
|
||||
textDecoration: 'underline',
|
||||
},
|
||||
},
|
||||
},
|
||||
links: {
|
||||
footer: {
|
||||
|
|
@ -81,4 +91,11 @@ export const theme: Theme = {
|
|||
},
|
||||
},
|
||||
},
|
||||
images: {
|
||||
vpnLogo: {
|
||||
height: '28px',
|
||||
width: 'auto',
|
||||
mb: '6px',
|
||||
},
|
||||
},
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue