added css files to components

src/components/Details.jsx

@@ -1,11 +1,12 @@
 /* ----- Project Imports ----- */
-
+import "@/styles/details.css";
 
 
 function Details() {
   return (
     <article className="detailsContainer">
     <p>This be some details</p>
+    <a href="#projects">Projects</a>
     </article>
   );
 };

src/components/Projects.jsx

@@ -1,10 +1,11 @@
 /* ----- Project Imports ----- */
-
+import "@/styles/projects.css";
 
 
 function Projects() {
   return (
     <article className="projectsContainer">
+    <h2 id="projects">This is projects area title</h2>
     <p>This be some projects</p>
     </article>
   );

src/styles/content.css

@@ -1,5 +1,6 @@
 .contentContainer {
   display: flex;
+  flex-direction: column;
   background: linear-gradient(109.6deg, rgb(0, 0, 0) 11.2%, rgb(11, 132, 145) 91.1%);
   min-height: 100%;
 }

src/styles/details.css

@@ -0,0 +1,4 @@
+.detailsContainer {
+  padding: 3rem;
+  min-height: 100vh;
+}

src/styles/projects.css

@@ -0,0 +1,4 @@
+.projectsContainer {
+  min-height: 100vh;
+  padding: 3rem;
+}