diff --git a/crabfit-frontend/public/.well-known/microsoft-identity-association.json b/crabfit-frontend/public/.well-known/microsoft-identity-association.json
index 4a95022..671e444 100644
--- a/crabfit-frontend/public/.well-known/microsoft-identity-association.json
+++ b/crabfit-frontend/public/.well-known/microsoft-identity-association.json
@@ -1,7 +1,7 @@
{
"associatedApplications": [
{
- "applicationId": "78739601-9834-4d41-a281-74ca2a50b2e6"
+ "applicationId": "5d1ab8af-1ba3-4b79-b033-b0ee509c2be6"
}
]
-}
\ No newline at end of file
+}
diff --git a/crabfit-frontend/src/components/Button/buttonStyle.ts b/crabfit-frontend/src/components/Button/buttonStyle.ts
index 7a31fcb..c3a6338 100644
--- a/crabfit-frontend/src/components/Button/buttonStyle.ts
+++ b/crabfit-frontend/src/components/Button/buttonStyle.ts
@@ -64,6 +64,24 @@ export const Top = styled.button`
border-radius: 100px;
animation: load .5s linear infinite;
}
+
+ @media (prefers-reduced-motion: reduce) {
+ &:after {
+ content: 'loading...';
+ color: #FFF;
+ animation: none;
+ width: initial;
+ height: initial;
+ left: 50%;
+ transform: translateX(-50%);
+ border: 0;
+ top: 0;
+ bottom: 0;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+ }
`}
`;
diff --git a/crabfit-frontend/src/components/Donate/Donate.tsx b/crabfit-frontend/src/components/Donate/Donate.tsx
index d981890..30ced8c 100644
--- a/crabfit-frontend/src/components/Donate/Donate.tsx
+++ b/crabfit-frontend/src/components/Donate/Donate.tsx
@@ -30,6 +30,11 @@ const Donate = () => {
}
};
+ const linkPressed = () => {
+ setIsOpen(false);
+ gtag('event', 'donate', { 'event_category': 'donate' });
+ };
+
useEffect(() => {
if (store.TWA === undefined) {
store.setTWA(document.referrer.includes('android-app://fit.crab'));
@@ -94,8 +99,8 @@ const Donate = () => {
{
- gtag('event', 'donate', { 'event_category': 'donate' });
if (store.TWA) {
+ gtag('event', 'donate', { 'event_category': 'donate' });
event.preventDefault();
if (window.confirm(t('donate.messages.about'))) {
if (purchase() === false) {
@@ -130,10 +135,10 @@ const Donate = () => {
}}
>
- setIsOpen(false)} ref={firstLinkRef} href="https://www.paypal.com/donate?business=N89X6YXRT5HKW&item_name=Crab+Fit+Donation¤cy_code=AUD&amount=2" target="_blank" rel="noreferrer">{t('donate.options.$2')}
- setIsOpen(false)} href="https://www.paypal.com/donate?business=N89X6YXRT5HKW&item_name=Crab+Fit+Donation¤cy_code=AUD&amount=5" target="_blank" rel="noreferrer">{t('donate.options.$5')}
- setIsOpen(false)} href="https://www.paypal.com/donate?business=N89X6YXRT5HKW&item_name=Crab+Fit+Donation¤cy_code=AUD&amount=10" target="_blank" rel="noreferrer">{t('donate.options.$10')}
- setIsOpen(false)} href="https://www.paypal.com/donate?business=N89X6YXRT5HKW&item_name=Crab+Fit+Donation¤cy_code=AUD" target="_blank" rel="noreferrer">{t('donate.options.choose')}
+ {t('donate.options.$2')}
+ {t('donate.options.$5')}
+ {t('donate.options.$10')}
+ {t('donate.options.choose')}
);
diff --git a/crabfit-frontend/src/components/Donate/donateStyle.ts b/crabfit-frontend/src/components/Donate/donateStyle.ts
index ff9d4c2..ad32073 100644
--- a/crabfit-frontend/src/components/Donate/donateStyle.ts
+++ b/crabfit-frontend/src/components/Donate/donateStyle.ts
@@ -58,4 +58,8 @@ export const Options = styled.div`
font-weight: 800;
}
}
+
+ @media (prefers-reduced-motion: reduce) {
+ transition: none;
+ }
`;
diff --git a/crabfit-frontend/src/components/GoogleCalendar/GoogleCalendar.tsx b/crabfit-frontend/src/components/GoogleCalendar/GoogleCalendar.tsx
index b1517a0..74f5694 100644
--- a/crabfit-frontend/src/components/GoogleCalendar/GoogleCalendar.tsx
+++ b/crabfit-frontend/src/components/GoogleCalendar/GoogleCalendar.tsx
@@ -113,8 +113,8 @@ const GoogleCalendar = ({ timeZone, timeMin, timeMax, onImport }) => {
- {/* eslint-disable-next-line */}
{t('event:you.google_cal.login')}
+ {/* eslint-disable-next-line */}
( {
e.preventDefault();
signOut();
diff --git a/crabfit-frontend/src/components/GoogleCalendar/googleCalendarStyle.ts b/crabfit-frontend/src/components/GoogleCalendar/googleCalendarStyle.ts
index fe31510..2afc26f 100644
--- a/crabfit-frontend/src/components/GoogleCalendar/googleCalendarStyle.ts
+++ b/crabfit-frontend/src/components/GoogleCalendar/googleCalendarStyle.ts
@@ -125,4 +125,8 @@ export const Icon = styled.img`
height: 24px;
width: 24px;
margin-right: 12px;
+
+ ${props => props.theme.mode === 'light' && `
+ filter: invert(1);
+ `}
`;
diff --git a/crabfit-frontend/src/components/Loading/loadingStyle.ts b/crabfit-frontend/src/components/Loading/loadingStyle.ts
index 44bd8bb..84665ff 100644
--- a/crabfit-frontend/src/components/Loading/loadingStyle.ts
+++ b/crabfit-frontend/src/components/Loading/loadingStyle.ts
@@ -23,4 +23,13 @@ export const Loader = styled.div`
border-left-color: transparent;
border-radius: 100px;
animation: load .5s linear infinite;
+
+ @media (prefers-reduced-motion: reduce) {
+ animation: none;
+ border: 0;
+
+ &::before {
+ content: 'loading...';
+ }
+ }
`;
diff --git a/crabfit-frontend/src/components/Logo/logoStyle.ts b/crabfit-frontend/src/components/Logo/logoStyle.ts
index 1243b21..5edeace 100644
--- a/crabfit-frontend/src/components/Logo/logoStyle.ts
+++ b/crabfit-frontend/src/components/Logo/logoStyle.ts
@@ -27,6 +27,11 @@ export const A = styled.a`
&:hover img {
animation: jelly .5s 1;
}
+ @media (prefers-reduced-motion: reduce) {
+ &:hover img {
+ animation: none;
+ }
+ }
`;
export const Top = styled.div`
diff --git a/crabfit-frontend/src/components/OutlookCalendar/OutlookCalendar.tsx b/crabfit-frontend/src/components/OutlookCalendar/OutlookCalendar.tsx
index cae2983..ce62594 100644
--- a/crabfit-frontend/src/components/OutlookCalendar/OutlookCalendar.tsx
+++ b/crabfit-frontend/src/components/OutlookCalendar/OutlookCalendar.tsx
@@ -19,10 +19,12 @@ import {
import outlookLogo from 'res/outlook.svg';
+const scopes = ['Calendars.Read', 'Calendars.Read.Shared'];
+
// Initialise the MSAL object
const publicClientApplication = new PublicClientApplication({
auth: {
- clientId: '78739601-9834-4d41-a281-74ca2a50b2e6',
+ clientId: '5d1ab8af-1ba3-4b79-b033-b0ee509c2be6',
redirectUri: process.env.NODE_ENV === 'production' ? 'https://crab.fit' : 'http://localhost:3000',
},
cache: {
@@ -61,9 +63,7 @@ const OutlookCalendar = ({ timeZone, timeMin, timeMax, onImport }) => {
const signIn = async () => {
try {
- await publicClientApplication.loginPopup({
- scopes: ['Calendars.Read', 'Calendars.Read.Shared'],
- });
+ await publicClientApplication.loginPopup({ scopes });
} catch (e) {
console.error(e);
} finally {
@@ -90,7 +90,7 @@ const OutlookCalendar = ({ timeZone, timeMin, timeMax, onImport }) => {
// Try to get silently
const result = await publicClientApplication.acquireTokenSilent({
- scopes: ['Calendars.Read', 'Calendars.Read.Shared'],
+ scopes,
account: accounts[0],
});
return result.accessToken;
@@ -102,9 +102,7 @@ const OutlookCalendar = ({ timeZone, timeMin, timeMax, onImport }) => {
'no_account_in_silent_request'
].includes(e.message)) {
// Try to get with popup
- const result = await publicClientApplication.acquireTokenPopup({
- scopes: ['Calendars.Read', 'Calendars.Read.Shared'],
- });
+ const result = await publicClientApplication.acquireTokenPopup({ scopes });
return result.accessToken;
} else {
throw e;
@@ -139,6 +137,7 @@ const OutlookCalendar = ({ timeZone, timeMin, timeMax, onImport }) => {
.finally(() => setFreeBusyLoading(false));
};
+ // eslint-disable-next-line
useEffect(() => checkLogin(), []);
useEffect(() => {
@@ -158,6 +157,7 @@ const OutlookCalendar = ({ timeZone, timeMin, timeMax, onImport }) => {
signOut();
});
}
+ // eslint-disable-next-line
}, [client]);
return (
@@ -180,8 +180,8 @@ const OutlookCalendar = ({ timeZone, timeMin, timeMax, onImport }) => {
- {/* eslint-disable-next-line */}
{t('event:you.outlook_cal')}
+ {/* eslint-disable-next-line */}
( {
e.preventDefault();
signOut();
diff --git a/crabfit-frontend/src/components/Settings/settingsStyle.ts b/crabfit-frontend/src/components/Settings/settingsStyle.ts
index 6a28798..0f42b74 100644
--- a/crabfit-frontend/src/components/Settings/settingsStyle.ts
+++ b/crabfit-frontend/src/components/Settings/settingsStyle.ts
@@ -29,6 +29,10 @@ export const OpenButton = styled.button`
${props => props.isOpen && `
transform: rotate(-45deg);
`}
+
+ @media (prefers-reduced-motion: reduce) {
+ transition: none;
+ }
`;
export const Cover = styled.div`
@@ -73,6 +77,10 @@ export const Modal = styled.div`
transform: translateY(0);
visibility: visible;
`}
+
+ @media (prefers-reduced-motion: reduce) {
+ transition: none;
+ }
`;
export const Heading = styled.span`
diff --git a/crabfit-frontend/src/pages/Home/homeStyle.ts b/crabfit-frontend/src/pages/Home/homeStyle.ts
index 2dd67a2..16e1f89 100644
--- a/crabfit-frontend/src/pages/Home/homeStyle.ts
+++ b/crabfit-frontend/src/pages/Home/homeStyle.ts
@@ -70,6 +70,14 @@ export const Logo = styled.img`
animation: none;
transform: scale(.85);
}
+
+ @media (prefers-reduced-motion: reduce) {
+ animation: none;
+ transition: none;
+ &:active {
+ transform: none;
+ }
+ }
`;
export const Links = styled.nav`