Commit 5f22b056 authored by Balasuriya D.A.M.'s avatar Balasuriya D.A.M.

Install and test Chakra UI

parent 9b79a9f4
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -3,9 +3,13 @@ ...@@ -3,9 +3,13 @@
"version": "0.1.0", "version": "0.1.0",
"private": true, "private": true,
"dependencies": { "dependencies": {
"@chakra-ui/react": "^1.8.8",
"@emotion/react": "^11.9.0",
"@emotion/styled": "^11.8.1",
"@testing-library/jest-dom": "^5.16.3", "@testing-library/jest-dom": "^5.16.3",
"@testing-library/react": "^12.1.4", "@testing-library/react": "^12.1.4",
"@testing-library/user-event": "^13.5.0", "@testing-library/user-event": "^13.5.0",
"framer-motion": "^6.2.10",
"react": "^18.0.0", "react": "^18.0.0",
"react-dom": "^18.0.0", "react-dom": "^18.0.0",
"react-scripts": "5.0.0", "react-scripts": "5.0.0",
......
import { Button } from '@chakra-ui/react';
import './App.css'; import './App.css';
function App() { function App() {
return ( return (
<div className="App"> <div className="App">
Hello Docotor <Button colorScheme='blue'>Button</Button>
</div> </div>
); );
} }
......
...@@ -2,11 +2,15 @@ import React from 'react'; ...@@ -2,11 +2,15 @@ import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import './index.css'; import './index.css';
import App from './App'; import App from './App';
import { ChakraProvider } from '@chakra-ui/react'
ReactDOM.render( ReactDOM.render(
<React.StrictMode> <React.StrictMode>
<App /> <ChakraProvider>
<App />
</ChakraProvider>
</React.StrictMode>, </React.StrictMode>,
document.getElementById('root') document.getElementById('root')
//rendering everything on root tag //rendering everything on root tag
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment