Resolve issues

Make service section background cover container, resolve SVG attribute errors, fix key error on projects and ignore eslint error on useEffect hook

Author: joachmak

src/components/About.tsx

@@ -11,6 +11,7 @@ export default function About() {
             background: "linear-gradient( rgba(0, 0, 0, " + darknessOverlayIntensity + "), rgba(0, 0, 0, " + darknessOverlayIntensity + ") ), url('/img/about/about.JPG')",
             backgroundAttachment: "fixed",
             backgroundPosition: "center",
+            backgroundSize: "cover",
             minHeight: minHeight,
             zIndex: 3,
             color: "white",
@@ -46,4 +47,4 @@ export default function About() {
             </div>
         </>
     )
-}
+}

src/components/Navbar.tsx

@@ -39,7 +39,7 @@ export default function Navbar(props: navInterface) {
                 setCurrentSection(sections[0])
             }
         });
-    }, [])
+    }, []) // eslint-disable-line
     let cols = size.lg ? 6 : 2;
     let styles = {
         container: {
@@ -143,4 +143,4 @@ export default function Navbar(props: navInterface) {
             </div>
         </>
     )
-}
+}

src/components/Projects.tsx

@@ -127,7 +127,7 @@ export default function Projects() {
                 <GridItem colSpan={4}>
                     <Grid templateColumns={'repeat(' + cols + ', 1fr)'}
                           templateRows={'repeat(' + rows + ', ' + rowHeight + 'px)'} gap={2}>
-                        {projects.map(project => <Project key={project.title} title={project.title ? project.title : undefined} images={project.images}/>)}
+                        {projects.map(project => <Project key={project.images[0].url} title={project.title ? project.title : undefined} images={project.images}/>)}
                     </Grid>
                 </GridItem>
                 {size.lg && <GridItem/>}
@@ -178,4 +178,4 @@ function Project(props: projectInterface) {
             </GridItem>
         </>
     )
-}
+}

src/components/Services.tsx

@@ -55,9 +55,9 @@ export default function Services() {
                                         viewBox="0 0 24 24"
                                         fill="none"
                                         stroke="currentColor"
-                                        stroke-width="1"
-                                        stroke-linecap="round"
-                                        stroke-linejoin="round"
+                                        strokeWidth="1"
+                                        strokeLinecap="round"
+                                        strokeLinejoin="round"
                                         style={styles.icon}
                                     >
                                         <line x1="18" y1="2" x2="22" y2="6" />
@@ -78,9 +78,9 @@ export default function Services() {
                                         viewBox="0 0 24 24"
                                         fill="currentColor"
                                         stroke="white"
-                                        stroke-width="1"
-                                        stroke-linecap="round"
-                                        stroke-linejoin="round"
+                                        strokeWidth="1"
+                                        strokeLinecap="round"
+                                        strokeLinejoin="round"
                                         style={styles.icon}
                                     >
                                         <g>
@@ -103,9 +103,9 @@ export default function Services() {
                                         viewBox="0 0 24 24"
                                         fill="none"
                                         stroke="currentColor"
-                                        stroke-width="1"
-                                        stroke-linecap="round"
-                                        stroke-linejoin="round"
+                                        strokeWidth="1"
+                                        strokeLinecap="round"
+                                        strokeLinejoin="round"
                                         style={styles.icon}
                                     >
                                         <path d="M15 12l-8.5 8.5c-.83.83-2.17.83-3 0 0 0 0 0 0 0a2.12 2.12 0 010-3L12 9" />
@@ -126,4 +126,4 @@ export default function Services() {
             <div className="triangleDivBottom" />
         </>
     )
-}
+}