From 22b15f833d388d2fed12b7f4dcd917c57712cbec Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adri=C3=A1n=20Oliva?= Date: Wed, 17 May 2023 18:33:41 -0600 Subject: Added bootstrap library. We now have better looking assets! --- package-lock.json | 29 +++++++++++++++++++++++++++++ package.json | 1 + src/App.css | 39 --------------------------------------- src/App.jsx | 11 +++++------ src/features/counter/Counter.jsx | 4 +++- src/index.css | 13 ------------- src/main.jsx | 15 ++++++++------- 7 files changed, 46 insertions(+), 66 deletions(-) delete mode 100644 src/App.css delete mode 100644 src/index.css diff --git a/package-lock.json b/package-lock.json index a6d6fc0..09d0a9a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,7 @@ "version": "0.0.0", "dependencies": { "@reduxjs/toolkit": "^1.9.5", + "bootstrap": "^5.2.3", "react": "^18.2.0", "react-dom": "^18.2.0", "react-redux": "^8.0.5" @@ -779,6 +780,16 @@ "integrity": "sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==", "dev": true }, + "node_modules/@popperjs/core": { + "version": "2.11.7", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.7.tgz", + "integrity": "sha512-Cr4OjIkipTtcXKjAsm8agyleBuDHvxzeBoa1v543lbv1YaIwQjESsVcmjiWiPEbC1FIeHOG/Op9kdCmAmiS3Kw==", + "peer": true, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/popperjs" + } + }, "node_modules/@reduxjs/toolkit": { "version": "1.9.5", "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.5.tgz", @@ -875,6 +886,24 @@ "node": ">=4" } }, + "node_modules/bootstrap": { + "version": "5.2.3", + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.2.3.tgz", + "integrity": "sha512-cEKPM+fwb3cT8NzQZYEu4HilJ3anCrWqh3CHAok1p9jXqMPsPTBhU25fBckEJHJ/p+tTxTFTsFQGM+gaHpi3QQ==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/twbs" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/bootstrap" + } + ], + "peerDependencies": { + "@popperjs/core": "^2.11.6" + } + }, "node_modules/browserslist": { "version": "4.21.5", "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.21.5.tgz", diff --git a/package.json b/package.json index 42abdb9..892b437 100644 --- a/package.json +++ b/package.json @@ -9,6 +9,7 @@ }, "dependencies": { "@reduxjs/toolkit": "^1.9.5", + "bootstrap": "^5.2.3", "react": "^18.2.0", "react-dom": "^18.2.0", "react-redux": "^8.0.5" diff --git a/src/App.css b/src/App.css deleted file mode 100644 index 01cc586..0000000 --- a/src/App.css +++ /dev/null @@ -1,39 +0,0 @@ -.App { - text-align: center; -} - -.App-logo { - height: 40vmin; - pointer-events: none; -} - -@media (prefers-reduced-motion: no-preference) { - .App-logo { - animation: App-logo-float infinite 3s ease-in-out; - } -} - -.App-header { - min-height: 100vh; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - font-size: calc(10px + 2vmin); -} - -.App-link { - color: rgb(112, 76, 182); -} - -@keyframes App-logo-float { - 0% { - transform: translateY(0); - } - 50% { - transform: translateY(10px); - } - 100% { - transform: translateY(0px); - } -} diff --git a/src/App.jsx b/src/App.jsx index 7fbcae5..f12edb5 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,13 +1,12 @@ import React from "react"; -import "./App.css"; import { Counter } from "./features/counter/Counter"; function App() { - return ( -
- -
- ); + return ( +
+ +
+ ); } export default App; diff --git a/src/features/counter/Counter.jsx b/src/features/counter/Counter.jsx index d589bf9..b8453b2 100644 --- a/src/features/counter/Counter.jsx +++ b/src/features/counter/Counter.jsx @@ -8,17 +8,19 @@ export function Counter() { return (
+

{count}

- {count} diff --git a/src/index.css b/src/index.css deleted file mode 100644 index 4a1df4d..0000000 --- a/src/index.css +++ /dev/null @@ -1,13 +0,0 @@ -body { - margin: 0; - font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", - "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", - sans-serif; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -code { - font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", - monospace; -} diff --git a/src/main.jsx b/src/main.jsx index a7ca55d..38d8b53 100644 --- a/src/main.jsx +++ b/src/main.jsx @@ -1,14 +1,15 @@ import React from "react"; import ReactDOM from "react-dom/client"; -import { Provider } from 'react-redux' +import { Provider } from "react-redux"; import { store } from "./app/store"; import App from "./App"; -import "./index.css"; +import "bootstrap/dist/css/bootstrap.css"; +import "bootstrap/dist/js/bootstrap"; ReactDOM.createRoot(document.getElementById("root")).render( - - - - - + + + + + ); -- cgit v1.2.3