diff options
| author | Fuwn <[email protected]> | 2020-11-10 11:50:24 -0800 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2020-11-10 11:50:24 -0800 |
| commit | 2a16314865ebd408fee4edfbc89eb632c887b795 (patch) | |
| tree | 89db566af5c4c13cec8f35f3ecf1be0a426c27f3 /src/App | |
| download | me-rewrite-typescript.tar.xz me-rewrite-typescript.zip | |
Diffstat (limited to 'src/App')
| -rw-r--r-- | src/App/App.scss | 41 | ||||
| -rw-r--r-- | src/App/App.test.tsx | 9 | ||||
| -rw-r--r-- | src/App/App.tsx | 26 |
3 files changed, 76 insertions, 0 deletions
diff --git a/src/App/App.scss b/src/App/App.scss new file mode 100644 index 0000000..c02a1e2 --- /dev/null +++ b/src/App/App.scss @@ -0,0 +1,41 @@ +// @import "~bootstrap/scss/bootstrap.scss"; +@import "../styles/bulma.scss"; + +.App { + text-align: center; +} + +.App-logo { + height: 40vmin; + pointer-events: none; +} + +@media (prefers-reduced-motion: no-preference) { + .App-logo { + animation: App-logo-spin infinite 20s linear; + } +} + +.App-header { + background-color: #282c34; + min-height: 100vh; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + font-size: calc(10px + 2vmin); + color: white; +} + +.App-link { + color: #61dafb; +} + +@keyframes App-logo-spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} diff --git a/src/App/App.test.tsx b/src/App/App.test.tsx new file mode 100644 index 0000000..2a68616 --- /dev/null +++ b/src/App/App.test.tsx @@ -0,0 +1,9 @@ +import React from 'react'; +import { render, screen } from '@testing-library/react'; +import App from './App'; + +test('renders learn react link', () => { + render(<App />); + const linkElement = screen.getByText(/learn react/i); + expect(linkElement).toBeInTheDocument(); +}); diff --git a/src/App/App.tsx b/src/App/App.tsx new file mode 100644 index 0000000..d6d01b9 --- /dev/null +++ b/src/App/App.tsx @@ -0,0 +1,26 @@ +import React from 'react'; +import logo from '../assets/logo.svg'; +import './App.scss'; + +import NavigationBar from "../components/Navigation/NavigationBar"; + +function App() { + return ( + <div className="App"> + <NavigationBar /> + + <header className="App-header"> + <img src={logo} className="App-logo" alt="logo" /> + <p>Edit <code>src/App.tsx</code> and save to reload.</p> + <a className="App-link" + href="https://reactjs.org" + target="_blank" + rel="noopener noreferrer"> + Learn React + </a> + </header> + </div> + ); +} + +export default App; |