diff --git a/.env.template b/.env.template index e122053..37c1000 100644 --- a/.env.template +++ b/.env.template @@ -1,2 +1,4 @@ REACT_APP_API_URL= -REACT_APP_TELEGRAM_BOT_NAME= \ No newline at end of file +REACT_APP_TELEGRAM_BOT_NAME= + +# REACT_APP_DONATE_LINK= \ No newline at end of file diff --git a/src/App.css b/src/App.css index 78cc313..12a1b69 100644 --- a/src/App.css +++ b/src/App.css @@ -1,9 +1,20 @@ +:root { + background: var(--chakra-colors-teal-100); +} + #QRFlex { width: 30%; } -@media only screen and (max-width: 600px) { +#contentFlex { + width: 30%; +} + +@media only screen and (max-width: 800px) { #QRFlex { width: 90%; } + #contentFlex { + width: 90%; + } } diff --git a/src/screens/HomeScreen.js b/src/screens/HomeScreen.js index 161f1fa..cd6f61d 100644 --- a/src/screens/HomeScreen.js +++ b/src/screens/HomeScreen.js @@ -1,6 +1,6 @@ -import { Button, Divider, Flex, Image, Spinner, Text } from '@chakra-ui/react'; +import { Button, Divider, Flex, Image, Link, Spinner, Text } from '@chakra-ui/react'; import axios from 'axios'; -import { React, useEffect, useState } from 'react'; +import { Fragment, React, useEffect, useState } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { Redirect, useHistory } from 'react-router-dom'; import { authLogout } from '../features/auth/authSlice'; @@ -66,8 +66,20 @@ function Home() { - - + { + process.env.REACT_APP_DONATE_LINK && + + + + + Servers require money to run, and apps require labor to develop and maintain. + You can show your support by donating what you can. Every cent counts, buy me + my next coffee, or help pay for a month of server usage! + + + } + + ); diff --git a/src/screens/LoginScreen.js b/src/screens/LoginScreen.js index 86f2273..16eda2b 100644 --- a/src/screens/LoginScreen.js +++ b/src/screens/LoginScreen.js @@ -1,6 +1,4 @@ -import { - Flex, Heading, useToast -} from '@chakra-ui/react'; +import { Divider, Flex, Heading, Link, Text, useToast } from '@chakra-ui/react'; import axios from 'axios'; import { React } from 'react'; import { useDispatch, useSelector } from 'react-redux'; @@ -83,12 +81,12 @@ function Login() { return ( - + SSR Covid Tracing @@ -96,6 +94,19 @@ function Login() { Login + + + Privacy notes:
+ Telegram Login allows us to verify your identity, without + collecting any of your data. Telegram does NOT give us your + phone number. The only piece of information stored on our server + is your Telegram ID, this is an internal ID Number Telegram uses + that is SEPARATE from your Telegram Username. +

+ All the code for this project is Open Source, that means anyone, + including you can audit and verify that your information is being + handled securely. +
);