change main colors

Author: carlosjorger

css/navbar.css

@@ -22,7 +22,7 @@
 
 .nav-link:hover {
     background-color: rgb(36, 28, 45);
-    color: aqua !important
+    color: var(--default-secundary-font-color)aqua !important
 }
 
 .nav-link:visited {

css/presentation-section.css

@@ -1,12 +1,12 @@
 .presentation {
-    color: rgb(148, 112, 220);
+    color: var(--default-font-color);
     font-family: var(--default-font-family);
     padding: 1em;
 }
 
 #presentation-title {
     font-size: 2.6rem;
-    color: aqua;
+    color: var( --default-secundary-font-color);
     animation: 1s show-presentation ease;
 }
 

css/project-section.css

@@ -33,16 +33,16 @@
 }
 
 #open-ecommerce {
-    border-right: groove 0.2rem aqua;
-    border-top: groove 0.2rem aqua;
-    border-bottom: groove 0.2rem aqua;
+    border-right: groove 0.2rem var(--default-secundary-font-color);
+    border-top: groove 0.2rem var(--default-secundary-font-color);
+    border-bottom: groove 0.2rem var(--default-secundary-font-color);
     align-self: flex-end;
 }
 
 #angular-portfolio {
-    border-left: groove 0.2rem aqua;
-    border-top: groove 0.2rem aqua;
-    border-bottom: groove 0.2rem aqua;
+    border-left: groove 0.2rem var(--default-secundary-font-color);
+    border-top: groove 0.2rem var(--default-secundary-font-color);
+    border-bottom: groove 0.2rem var(--default-secundary-font-color);
     align-self: flex-start;
 
 }

css/styles.css

@@ -1,6 +1,8 @@
 :root {
   --default-font-family: "Lato", sans-serif;
-  --default-font-color: rgb(148, 112, 220);
+  --default-font-color: rgb(213, 193, 255);
+  --default-secundary-font-color: rgb(133, 249, 249);
+
   background-color: rgb(9, 3, 15);
   font-size: 25px;
   scroll-behavior: smooth;
@@ -61,7 +63,7 @@ a {
 i {
   color: rgb(148, 112, 220);
   margin: 0.2em 0.2em;
-  color: aqua;
+  color: var(--default-secundary-font-color);
 }
 
 nav {
@@ -127,9 +129,9 @@ nav {
 
 /* unvisited link */
 .work-link:link {
-  color: aqua;
-  text-decoration-color: aqua;
-  background-image: linear-gradient(aqua, aqua);
+  color: var(--default-secundary-font-color);
+  text-decoration-color: var(--default-secundary-font-color);
+  background-image: linear-gradient(var(--default-secundary-font-color), var(--default-secundary-font-color));
   background-size: 100% 0%;
   background-position: 0% 100%;
   background-repeat: no-repeat;
@@ -138,8 +140,8 @@ nav {
 }
 
 .work-link:visited {
-  color: aqua;
-  text-decoration-color: aqua;
+  color: var(--default-secundary-font-color);
+  text-decoration-color: var(--default-secundary-font-color);
 }
 
 /* mouse over link */
@@ -160,7 +162,7 @@ nav {
 
 .icon-link:hover>i {
   color: black;
-  text-shadow: 0px 0px 15px aqua;
+  text-shadow: 0rem 0rem 1rem aqua;
 }
 
 @media (max-width: 1100px) {