diff --git a/App.jsx b/App.jsx new file mode 100644 index 0000000..544f65e --- /dev/null +++ b/App.jsx @@ -0,0 +1,20 @@ +import React from "react"; +import Header from "./Header"; +import Footer from "./Footer"; +import Info from "./Info"; + +function App() { + return ( +
+
+
+ ); +} + +export default App; diff --git a/Footer.jsx b/Footer.jsx new file mode 100644 index 0000000..5c8825f --- /dev/null +++ b/Footer.jsx @@ -0,0 +1,11 @@ +import React from "react"; + +function Footer() { + return ( + + ); +} + +export default Footer; diff --git a/Header.jsx b/Header.jsx new file mode 100644 index 0000000..7f0938d --- /dev/null +++ b/Header.jsx @@ -0,0 +1,11 @@ +import React from "react"; + +function Header(){ + return( +
+

ShapeAI Bootcamps

+
+ ); +} + +export default Header; \ No newline at end of file diff --git a/Info.jsx b/Info.jsx new file mode 100644 index 0000000..12c0343 --- /dev/null +++ b/Info.jsx @@ -0,0 +1,12 @@ +import React from "react"; + +function Info() { + return ( +
+

Javascript and React.js

+

A basix Web Devlopment React JS Bootcamp!

+
+ ); +} + +export default Info; diff --git a/index.html b/index.html new file mode 100644 index 0000000..38334de --- /dev/null +++ b/index.html @@ -0,0 +1,12 @@ + + + + JSX + + + + +
+ + + diff --git a/index.js b/index.js new file mode 100644 index 0000000..0b68bb1 --- /dev/null +++ b/index.js @@ -0,0 +1,5 @@ +import React from "react"; +import ReactDOM from "react-dom"; +import App from "./components/App"; + +ReactDOM.render(, document.getElementById("root")); diff --git a/package.json b/package.json new file mode 100644 index 0000000..89e3ee7 --- /dev/null +++ b/package.json @@ -0,0 +1,30 @@ +{ + "name": "react", + "version": "1.0.0", + "description": "React example starter project", + "keywords": [ + "react", + "starter" + ], + "main": "src/index.js", + "dependencies": { + "react": "17.0.2", + "react-dom": "17.0.2" + }, + "devDependencies": { + "@babel/runtime": "7.13.8", + "typescript": "4.1.3" + }, + "scripts": { + "start": "react-scripts start", + "build": "react-scripts build", + "test": "react-scripts test --env=jsdom", + "eject": "react-scripts eject" + }, + "browserslist": [ + ">0.2%", + "not dead", + "not ie <= 11", + "not op_mini all" + ] +} \ No newline at end of file diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..1b8869d --- /dev/null +++ b/styles.css @@ -0,0 +1,56 @@ +* { + padding: 0; + margin: 0; + box-sizing: border-box; +} +html { + font-family: "Montserrat", sans-serif; +} +body { + background: #eee; + padding: 0 16px; +} + +header { + background-color: palevioletred; + margin: auto -16px; + padding: 16px 32px; + box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3); +} + +header h1 { + color: #fff; + font-family: "McLaren", cursive; + font-weight: 200; +} + +footer { + position: absolute; + text-align: center; + bottom: 0; + width: 100%; + height: 2.5rem; +} + +footer p { + color: #000; +} +.note { + background: #fff; + border-radius: 7px; + box-shadow: 0 2px 5px #ccc; + padding: 10px; + width: 240px; + margin: 16px; + float: left; +} +.note h1 { + font-size: 1.1em; + margin-bottom: 6px; +} +.note p { + font-size: 1.1em; + margin-bottom: 10px; + white-space: pre-wrap; + word-wrap: break-word; +}