Initial commit

components/styles/About.module.css

@@ -0,0 +1,20 @@
+.aboutTitle {
+  color: #308dfb;
+  font-family: "Poppins", sans-serif;
+  font-size: 1.3rem;
+  font-weight: 800;
+}
+
+.aboutParagraph {
+  color: rgb(85, 85, 85);
+  font-family: "Mulish", sans-serif;
+  font-size: 1.2rem;
+}
+
+.aboutBackgroundText {
+  font-family: "Poppins", sans-serif;
+  font-size: 8rem;
+  letter-spacing: 20px;
+  font-weight: 600;
+  color: rgba(85, 85, 85, 0.1);
+}

components/styles/Header.module.css

@@ -0,0 +1,44 @@
+.title {
+  color: #2c3e50;
+  font-family: "Montserrat", sans-serif;
+  font-weight: 700;
+  font-size: 1.2rem;
+  font-family: "Poppins", sans-serif;
+  color: rgb(45, 46, 50);
+}
+
+.navLink {
+  color: #34495e;
+  font-family: "Open Sans", sans-serif;
+  font-weight: 600;
+  font-size: 1.1rem;
+  transition: color 0.3s ease-in-out;
+  font-family: "Poppins", sans-serif;
+  color: rgb(45, 46, 50);
+}
+
+.navLink:hover {
+  color: #3498db;
+}
+
+.mobileMenuButton {
+  color: rgb(45, 46, 50);
+  transition: color 0.3s ease-in-out;
+}
+
+.mobileMenuButton:hover {
+  color: #3498db;
+}
+
+.mobileNavLink {
+  color: rgb(45, 46, 50);
+  font-family: "Open Sans", sans-serif;
+  font-weight: 600;
+  font-size: 1.2rem;
+  padding: 0.75rem 0;
+  transition: color 0.3s ease-in-out;
+}
+
+.mobileNavLink:hover {
+  color: #3498db;
+}

components/styles/Presentation.module.css

@@ -0,0 +1,34 @@
+.description {
+  color: rgb(85, 85, 85);
+  font-family: "Mulish", sans-serif;
+  font-size: 1.3rem;
+}
+
+.techIcon {
+  transition: transform 0.3s;
+}
+.techIcon:hover {
+  transform: scale(1.15) rotate(-5deg);
+}
+.animatedImage {
+  height: 400px;
+  width: 400px;
+  border: 3px solid rgb(45, 46, 50);
+  border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
+  animation: imgAnim 8s ease-in-out infinite;
+  background-position: center;
+  background-size: cover;
+  background-repeat: no-repeat;
+}
+
+@keyframes imgAnim {
+  0% {
+    border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
+  }
+  50% {
+    border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%;
+  }
+  100% {
+    border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
+  }
+}