gulpfile.js

@@ -5,6 +5,7 @@ const cssMin = require("gulp-clean-css")
 const terser = require("gulp-terser");
 const ftp = require("vinyl-ftp");
 const env = require("gulp-env");
+
 env({
 	file: ".env",
 	type: ".ini"

src/css/about.css

@@ -0,0 +1,7 @@
+section#about {
+    margin-bottom: 5rem;
+}
+
+section#about div {
+    padding: 0.1em 5em;
+}

src/css/cv.css

@@ -30,10 +30,17 @@ section#curriculumvitae .timeline {
     gap: 1em;
     display: flex;
     flex-direction: column;
-    margin: 0 auto;
     height: 100%;
 }
 
+/*section#curriculumvitae .timeline#edu {
+    margin: 0 auto;
+}
+
+section#curriculumvitae .timeline#work {
+    margin-left: auto;
+}*/
+
 section#curriculumvitae #work {
     margin: 0 auto 0 8rem;
 }

src/css/main.css

@@ -4,7 +4,8 @@
 /*local imports*/
 @import "nav.css";
 @import "about.css";
-
+@import "cv.css";
+@import "mediaQueries.css";
 
 /****** Root Style ******/
 :root {

src/index.html

@@ -17,6 +17,7 @@
             <a href="/">
                 <h1>rohit pai</h1>
             </a>
+
             <div class="nav-btn">
                 <label for="nav-check">
                     <span></span>
@@ -24,6 +25,7 @@
                     <span></span>
                 </label>
             </div>
+
             <ul>
                 <li><a href="#about" class="textShadow active"><span>&lt;</span>about<span>&gt;</span></a></li>
                 <li><a href="#curriculumvitae" class="textShadow"><span>&lt;</span>cv<span>&gt;</span></a></li>
@@ -32,12 +34,14 @@
                 <li><a href="#" class="textShadow"><span>&lt;</span>blog<span>&gt;</span></a></li>
             </ul>
         </nav>
+
         <div>
             <h1>full stack developer</h1>
             <a href="" class="btn btnPrimary boxShadowIn boxShadowOut">Contact Me</a>
             <a href="#about"><i class="fas fa-chevron-down"></i></a>
         </div>
     </header>
+
     <main>
         <section id="about">
             <h1>about</h1>
@@ -52,6 +56,7 @@
                 <a href="other/rohitpaicv.pdf" class="btn btnOutline boxShadowIn boxShadowOut" download>Download CV</a>
             </div>
         </section>
+
         <section id="curriculumvitae">
             <h1>curriculum vitae</h1>
             <div class="cvGrid">
@@ -68,6 +73,7 @@
                 </div>
             </div>
         </section>
+
         <section id="projects">
             <div class="mainProj">
                 <h1>project title to be generated</h1>
@@ -83,9 +89,11 @@
                     </div>
                 </div>
             </div>
+
             <div class="otherProj">
                 <h1>other projects</h1>
-                <div class="oProjGrid"><img src="" alt="">
+                <div class="oProjGrid">
+                    <img src="" alt="">
                     <div class="flexCol">
                         <div>
                             <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Velit, voluptates.</p>
@@ -96,7 +104,8 @@
                         </div>
                     </div>
                 </div>
-                <div class="oProjGrid"><img src="" alt="">
+                <div class="oProjGrid">
+                    <img src="" alt="">
                     <div class="flexCol">
                         <div>
                             <p>Adipisci aspernatur consectetur debitis fugiat minus mollitia rem ullam, voluptate.</p>
@@ -107,7 +116,8 @@
                         </div>
                     </div>
                 </div>
-                <div class="oProjGrid"><img src="" alt="">
+                <div class="oProjGrid">
+                    <img src="" alt="">
                     <div class="flexCol">
                         <div>
                             <p>Beatae culpa distinctio dolorum eius et fugit optio reiciendis soluta!</p>
@@ -118,7 +128,8 @@
                         </div>
                     </div>
                 </div>
-                <a href="" class="btn btnPrimary boxShadowIn boxShadowOut"></a></div>
+                <a href="" class="btn btnPrimary boxShadowIn boxShadowOut"></a>
+            </div>
         </section>
         <section id="contact">
             <div id="findme">