diff --git a/public/index.html b/public/index.html index aa069f2..22df692 100644 --- a/public/index.html +++ b/public/index.html @@ -10,6 +10,8 @@ content="Web site created using create-react-app" /> + + - React App + CoverView diff --git a/src/components/App.js b/src/components/App.js index 4ce1e33..0a81287 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -1,10 +1,17 @@ import React from 'react'; +import CoverImage from './CoverImage'; + class App extends React.Component{ render(){ - return
App
; + return ( + + + + + ); } } diff --git a/src/components/CoverImage.css b/src/components/CoverImage.css new file mode 100644 index 0000000..3d450df --- /dev/null +++ b/src/components/CoverImage.css @@ -0,0 +1,27 @@ +.cover{ + margin:auto; + width:auto; + height:auto; + background-color: #c5a8ff; + text-align: center; + +} + +.card{ + height:150px; + min-width:400px; + border-radius: 10px; + margin:50px; + background-color: #ffffff; + display:inline-block; + box-shadow: 10px 10px #8c52ff; + text-align: center; + color:#676683; + border:none; + justify-content: center; + align-items: center; + vertical-align: middle; + padding:50px; + +} +h1{height:auto;} \ No newline at end of file diff --git a/src/components/CoverImage.js b/src/components/CoverImage.js new file mode 100644 index 0000000..ba88a29 --- /dev/null +++ b/src/components/CoverImage.js @@ -0,0 +1,19 @@ +import React from 'react'; +import './CoverImage.css'; + + +class CoverImage extends React.Component{ + + + render(){ + return ( +
+
+

5 Simple apps I built while learning JavaScript

+
+
+ ); + } +} + +export default CoverImage; \ No newline at end of file