Moved some styling to new file. modified class names and generalized …

…some styles

src/Home.module.css

@@ -0,0 +1,39 @@
+.landingTitle {
+    /* TEMPORARY color till global theme is placed*/
+    color: #035496;
+    font-size: 2em;
+    margin-bottom: 1rem;
+    margin-left: 1em;
+    margin-right: 1em;
+}
+
+h2 {
+    /* TEMPORARY color till global theme is placed*/
+    color: #057cde;
+    font-size: 1.5em;
+    margin-bottom: 0.5rem;
+    margin-left: 1em;
+    margin-right: 1em;
+}
+
+p {
+    /* TEMPORARY color till global theme is placed*/
+    color: #59b1f9;
+    margin-bottom: 0.5rem;
+    margin-left: 1em;
+    margin-right: 1em;
+}
+
+.centerText {
+    text-align: center;
+}
+
+.landingBackground {
+    background-image: url("/landing-background.jpg");
+    background-position: center;
+    background-size: cover;
+    width: 100vw;
+    height: 100vh;
+}
+
+

src/app/globals.css

@@ -26,41 +26,3 @@ body {
     rgb(var(--background-start-rgb));
 }
 
-.h1-landing-text {
-  /* TEMPORARY color till global theme is placed*/
-  color: #035496;
-  font-size: 2em;
-  margin-bottom: 1rem;
-  margin-left: 1em;
-  margin-right: 1em;
-}
-
-.h2-landing-text {
-  /* TEMPORARY color till global theme is placed*/
-  color: #057cde;
-  font-size: 1.5em;
-  margin-bottom: 0.5rem;
-  margin-left: 1em;
-  margin-right: 1em;
-}
-
-.p-landing-text {
-  /* TEMPORARY color till global theme is placed*/
-  color: #59b1f9;
-  margin-bottom: 0.5rem;
-  margin-left: 1em;
-  margin-right: 1em;
-}
-
-.center-text {
-  text-align: center;
-}
-
-.landing-background {
-  background-image: url("/landing-background.jpg");
-  background-position: center;
-  background-size: cover;
-  width: 100vw;
-  height: 100vh;
-}
-

src/app/page.tsx

@@ -1,9 +1,9 @@
 export default function Home() {
   return (
-    <main className="center-text landing-background">
-      <h1 className="h1-landing-text">Society of Software Developers</h1>
-      <h2 className="h2-landing-text">Software Development & Design</h2>
-      <p className="p-landing-text">
+    <main className={`${styles.centerText} ${styles.landingBackground}`}>
+      <h1>Society of Software Developers</h1>
+      <h2>Software Development & Design</h2>
+      <p>
         We are an organization that helps students learn and apply software
         engineering principles to real-world applications. We host weekly
         workshops on topics like software design to help bridge the gap between
@@ -12,8 +12,8 @@ export default function Home() {
         better prepare members for team projects, internships, and careers in
         software development.
       </p>
-      <h2 className="h2-landing-text">Fall 2023 Meetings</h2>
-      <p className="p-landing-text">
+      <h2>Fall 2023 Meetings</h2>
+      <p>
         Tuesday, 6:15pm in CISE A101 and over Zoom
       </p>
     </main>