diff --git a/client/package.json b/client/package.json index 7d411660c09dbaeea4d973211f241aa9496c3c7d..0a4ff64eed3b791fc2787cc1298eba4fb6c896fc 100644 --- a/client/package.json +++ b/client/package.json @@ -38,8 +38,7 @@ "scripts": { "start": "react-scripts start", "build": "react-scripts build", - "test": "react-scripts test", - "eject": "react-scripts eject" + "test": "react-scripts test" }, "eslintConfig": { "extends": [ diff --git a/client/src/App.test.tsx b/client/src/components/App/App.test.tsx similarity index 53% rename from client/src/App.test.tsx rename to client/src/components/App/App.test.tsx index 3ac67fdce5a2a8c5232e5623a0a0aa5d48e9b6cb..22e0a53fd76bd04f94d3d50a475bef1e7eec891f 100644 --- a/client/src/App.test.tsx +++ b/client/src/components/App/App.test.tsx @@ -1,11 +1,11 @@ import React from 'react'; import { render, screen } from '@testing-library/react'; -import App from './components/App'; +import App from './index'; -test('renders learn react link', () => { +test('app renders `Home`', () => { render(<App />); - const linkElement = screen.getByText(/Hello world!/i); + const linkElement = screen.getByText(/Home/i); expect(linkElement).toBeInTheDocument(); }); diff --git a/client/src/components/App/app.scss b/client/src/components/App/app.scss index 73c97de2d735ce7c426b53ddce412a69334b8315..8f983833512a086ccabc5da2218d62d95cc0c27b 100644 --- a/client/src/components/App/app.scss +++ b/client/src/components/App/app.scss @@ -1,6 +1,7 @@ @use 'settings.scss'; @use 'mixins.scss'; + html { scroll-behavior: smooth; } @@ -11,3 +12,4 @@ body { color: black; } } + diff --git a/client/src/components/App/index.tsx b/client/src/components/App/index.tsx index 0c963897a0e4c721b872cc8d0b473853b282df8a..47a090d560e28574c756647bbba55ded348d4b4f 100644 --- a/client/src/components/App/index.tsx +++ b/client/src/components/App/index.tsx @@ -5,7 +5,7 @@ import { BrowserRouter as Router, Switch, Route } from 'react-router-dom'; import Home from 'components/pages/Home'; import './app.scss'; -function App() { +export default function App() { return ( <Router> <Switch> @@ -15,5 +15,3 @@ function App() { ); } -export default App; - diff --git a/client/src/components/pages/Home/index.tsx b/client/src/components/pages/Home/index.tsx index 8ae1b889edca780b0d3fcceabaaf8aeb956b6e3f..262d5709569dc4ada5dfb0b698037245c6e5c7ca 100644 --- a/client/src/components/pages/Home/index.tsx +++ b/client/src/components/pages/Home/index.tsx @@ -1,8 +1,9 @@ -function Home() { + +export default function Home() { return ( <div> Home </div> ); } -export default Home; + diff --git a/client/src/scss/functions.scss b/client/src/scss/functions.scss index 4e74cf1a0fcdf310c0326b2aef996681dbe2833b..7ff0241f919006682dbaef8696bd8567a21fb7ba 100644 --- a/client/src/scss/functions.scss +++ b/client/src/scss/functions.scss @@ -1,3 +1,4 @@ + @function toRem($px) { @return ($px / 16px)+0rem; } @@ -14,3 +15,4 @@ @function hoverify($color) { @return scale-color($color, $lightness: +5%, $hue: +5%); } + diff --git a/client/src/scss/mixins.scss b/client/src/scss/mixins.scss index 1b3a6a955f3b8cee01c49c9808697eb121a23160..9a1a03fee80d5f0e1edddf11c8e015337c0ef537 100644 --- a/client/src/scss/mixins.scss +++ b/client/src/scss/mixins.scss @@ -6,3 +6,4 @@ @content; } } + diff --git a/client/src/scss/settings.scss b/client/src/scss/settings.scss index 730ffa0c1bfb6bf890240b2db03d0e052d6a535c..31d0fe07bbcc7bd660ebbb1aca2530d03203a7fc 100644 --- a/client/src/scss/settings.scss +++ b/client/src/scss/settings.scss @@ -1,4 +1,5 @@ -//COLORS + +// Colors $primary: #AC42FF; $secondary: #F15154; $accent: #7DEFFF; @@ -20,7 +21,7 @@ $radial-gradient: radial-gradient(100% 115% at 0% 0%, $primary 0%, $secondary 10 $body-color: #4B4B4B; -//TYPOGRAPHY +// Typography $weight-light: 300; $weight-regular: 400; $weight-medium: 500; @@ -28,10 +29,11 @@ $weight-semi-bold: 600; $weight-bold: 700; -//Breakpoints +// Breakpoints $breakpoints: ( 'small': 360px, 'medium': 820px, 'large': 1280px, 'xlarge': 1420px ); +