styles updated to global style

Author: the-duckchild

src/App.test.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { render } from "@testing-library/react";
-import PhotoOfTheDay from "./Components/photoOfTheDay";
+import PhotoOfTheDay from "./Components/photoOfTheDay/photoOfTheDay";
 
 test("renders photo of the day", () => {
   render(<PhotoOfTheDay />);

src/App.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import "./App.scss";
 import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
-import PhotoOfTheDay from "./Components/photoOfTheDay";
+import PhotoOfTheDay from "./Components/photoOfTheDay/photoOfTheDay";
 
 function App() {
   return (

src/Components/photoOfTheDay.scss …ponents/photoOfTheDay/photoOfTheDay.scsssrc/Components/photoOfTheDay.scss renamed to src/Components/photoOfTheDay/photoOfTheDay.scss src/Components/photoOfTheDay.scss renamed to src/Components/photoOfTheDay/photoOfTheDay.scss

@@ -1,18 +1,15 @@
- $background-color: #062356;
- $text-color: #FFFFF2;
- $lighter-orange: #EE8434;
- $button-grey: #878888;
-$general-font: "Public Sans";
+@import "../Styles/GlobalStyles.scss";
+ 
 
  body {
-    background-color: $background-color;
-    font-family: $general-font
+    background-color: $blueBackground;
+    font-family: $PublicSans;
  }
 
  .photoOfTheDayContainer{
      display: flex;
      justify-content: center; 
-     background-color: $background-color;
+     background-color: $blueBackground;
 
  }
 
@@ -30,7 +27,7 @@ $general-font: "Public Sans";
 .explanation {
     width: 70%;
     margin: auto;
-    color: $text-color;
+    color: $whiteFontColor;
     padding: 5px;
     text-align: center;
     display: none;
@@ -39,7 +36,7 @@ $general-font: "Public Sans";
 .photoTitle {
     width: 70%;
     margin: auto;
-    color: $text-color;
+    color: $whiteFontColor;
     padding: 5px;
     text-align: center;
 }

src/Components/photoOfTheDay.spec.tsx …nts/photoOfTheDay/photoOfTheDay.spec.tsxsrc/Components/photoOfTheDay.spec.tsx renamed to src/Components/photoOfTheDay/photoOfTheDay.spec.tsx src/Components/photoOfTheDay.spec.tsx renamed to src/Components/photoOfTheDay/photoOfTheDay.spec.tsx

@@ -48,10 +48,6 @@ export default function PhotoOfTheDay() {
 
   return (
     <div>
-      <link
-        href="https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap"
-        rel="stylesheet"
-      ></link>
       <div className="photoOfTheDayContainer">
         <img
           src={photo}