added background image for earth and resized all planets

ChristoGrab · Feb 9, 2023 · 302dc8d · 302dc8d
1 parent 4d64c12
commit 302dc8d
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 49 deletions.
diff --git a/public/earth.png b/public/earth.png
diff --git a/src/App.css b/src/App.css
diff --git a/src/App.js b/src/App.js
@@ -1,5 +1,4 @@
 import { BrowserRouter, Route, Routes } from "react-router-dom";
-import './App.css';
 import Navigation from './components/Navigation';
 import Viewport from './components/Viewport';
 import InfoCard from "./components/InfoCard";

diff --git a/src/components/Planet/Planet.css b/src/components/Planet/Planet.css
@@ -24,7 +24,8 @@
 .earth {
   height: 360px;
   width: 360px;
-  background: blue;
+  background-image: url('../../../public/earth.png');
+  background-position: 270px 450px;
 }
 
 .mars {
@@ -35,26 +36,26 @@
 }
 
 .jupiter {
-  height: 500px;
-  width: 500px;
+  height: 460px;
+  width: 460px;
   background: linear-gradient(to top right, black, white, orange);
 }
 
 .saturn {
-  height: 500px;
-  width: 500px;
+  height: 445px;
+  width: 445px;
   background: red;
 }
 
 .uranus {
-  height: 500px;
-  width: 500px;
+  height: 425px;
+  width: 425px;
   background: red;
 }
 
 .neptune {
-  height: 500px;
-  width: 500px;
+  height: 400px;
+  width: 400px;
   background: red;
 }
 

diff --git a/src/components/Viewport/index.js b/src/components/Viewport/index.js
@@ -5,7 +5,7 @@ const Viewport = () => {
 
   return (
     <div className="main-page-container">
-      <div className="title">Solarium v0.3</div>
+      <div className="title">Solarium v0.4</div>
       <div className="creator">Made by Christo Grabowski</div>
       <Sun />
     </div>