diff --git a/.eslintrc.js b/.eslintrc.js index 6067a09..81fb2d0 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -1,42 +1,31 @@ module.exports = { - extends: [ - 'airbnb-typescript', - 'airbnb/hooks', - 'plugin:@typescript-eslint/recommended', - 'plugin:jest/recommended', - 'prettier', - 'prettier/react', - 'prettier/@typescript-eslint', - 'plugin:prettier/recommended', - ], - plugins: ['react', '@typescript-eslint', 'jest'], - env: { - browser: true, - es6: true, - jest: true, - }, - globals: { - Atomics: 'readonly', - SharedArrayBuffer: 'readonly', - }, - root: true, - parser: '@typescript-eslint/parser', - parserOptions: { - ecmaFeatures: { - jsx: true, + parser: '@typescript-eslint/parser', // Specifies the ESLint parserx + plugins: ['react-hooks', 'prettier'], + settings: { + react: { + version: 'detect', // Tells eslint-plugin-react to automatically detect the version of React to use }, - ecmaVersion: 2018, - sourceType: 'module', - project: './tsconfig.json', }, + extends: [ + 'plugin:react/recommended', + 'plugin:@typescript-eslint/recommended', + 'plugin:prettier/recommended', // Make sure this is always the last configuration in the extends array. + 'plugin:jest/recommended', + ], rules: { - 'linebreak-style': 'off', + // Place to specify ESLint rules. Can be used to overwrite rules specified from the extended configs + // Consider turning on eventually... lots of warnings though. + 'max-len': ['error', 100], + '@typescript-eslint/explicit-module-boundary-types': 'off', + 'react/react-in-jsx-scope': 'off', + // This rule is redundent when using arrow functions and we should only use arrow functions 'react/prop-types': 'off', - 'import/no-extraneous-dependencies': ['error', { devDependencies: true }], 'prettier/prettier': [ 'error', { - endOfLine: 'auto', + trailingComma: 'all', + arrowParens: 'always', + printWidth: 100, }, ], }, diff --git a/package.json b/package.json index 8582df8..dbf09ac 100644 --- a/package.json +++ b/package.json @@ -13,12 +13,14 @@ "i18next": "^17.0.4", "i18next-browser-languagedetector": "^3.0.1", "lodash": "^4.17.20", + "luxon": "^1.26.0", "match-sorter": "^6.1.0", "react": "^16.8.6", "react-dom": "^16.8.6", "react-i18next": "^10.11.2", "react-router-dom": "^5.2.0", "react-scripts": "4.0.1", + "react-svg": "^12.1.0", "react-use": "^15.3.8", "web-vitals": "^1.0.1" }, @@ -50,6 +52,7 @@ "@testing-library/react": "^11.2.3", "@types/jest": "^26.0.20", "@types/lodash": "^4.14.167", + "@types/luxon": "^1.26.2", "@types/react": "^17.0.0", "@types/react-dom": "^17.0.0", "@types/react-router-dom": "^5.1.7", @@ -57,15 +60,10 @@ "@typescript-eslint/parser": "^4.12.0", "axios-mock-adapter": "^1.19.0", "eslint": "7.2.0", - "eslint-config-airbnb": "18.2.1", - "eslint-config-airbnb-typescript": "^12.0.0", "eslint-config-prettier": "^7.1.0", - "eslint-plugin-import": "^2.22.1", "eslint-plugin-jest": "^24.1.3", "eslint-plugin-jsx-a11y": "^6.4.1", "eslint-plugin-prettier": "^3.3.1", - "eslint-plugin-react": "^7.21.5", - "eslint-plugin-react-hooks": "4.0.0", "husky": "^3.0.5", "jest": "^26.6.3", "prettier": "^2.2.1", diff --git a/public/favicon.ico b/public/favicon.ico index a11777c..e65f203 100644 Binary files a/public/favicon.ico and b/public/favicon.ico differ diff --git a/public/logo192.png b/public/logo192.png index fc44b0a..c98e888 100644 Binary files a/public/logo192.png and b/public/logo192.png differ diff --git a/public/logo512.png b/public/logo512.png index a4e47a6..1f4911a 100644 Binary files a/public/logo512.png and b/public/logo512.png differ diff --git a/src/App.scss b/src/App.scss index 054fad8..9f9d869 100644 --- a/src/App.scss +++ b/src/App.scss @@ -46,6 +46,18 @@ } .header { + .logo { + height: 40px; + display: inline-block; + vertical-align: middle; + margin-right: 10px; + + & svg { + height: 100%; + width: auto; + } + } + .title-desktop { @media all and (max-width: 820px) { display: none; @@ -74,7 +86,17 @@ } } +@media all and (min-width: 800px) { + .mobile { + display: none !important; + } +} + @media all and (max-width: 800px) { + .desktop { + display: none !important; + } + .report-problem-container { font-size: 12px; padding: 10px; diff --git a/src/App.tsx b/src/App.tsx index 661cc83..e3fb7bf 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -13,12 +13,47 @@ import Footer from './components/Footer'; const theme = createMuiTheme({ palette: { primary: { - main: '#3F51B5', + main: '#00B5E2', + contrastText: '#ffffff', }, secondary: { - main: '#009688', + main: '#212322', }, }, + typography: { + h1: { + fontWeight: 600, + }, + h2: { + fontWeight: 600, + }, + h3: { + fontWeight: 600, + }, + h4: { + fontWeight: 600, + }, + h5: { + fontWeight: 600, + }, + h6: { + fontWeight: 600, + }, + fontFamily: [ + 'Open Sans', + '-apple-system', + 'BlinkMacSystemFont', + 'Segoe UI', + 'Roboto', + 'Oxygen', + 'Ubuntu', + 'Cantarell', + 'Fira Sans', + 'Droid Sans', + 'Helvetica Neue', + , + ].join(','), + }, }); const App: FunctionComponent = () => { @@ -30,7 +65,7 @@ const App: FunctionComponent = () => { - +