Changed bg-color and border-color

Mihlayonke · Apr 13, 2024 · ce67f75 · ce67f75
1 parent 10e6413
commit ce67f75
Show file tree

Hide file tree

Showing 8 changed files with 29 additions and 32 deletions.
diff --git a/src/Components/About/about.scss b/src/Components/About/about.scss
@@ -130,7 +130,7 @@
   background-color: white;
 
   &:hover{
-      background-color: yellow;
+      background-color: #00d4ff;
   }
 }
 

diff --git a/src/Components/Certificate/certificate.scss b/src/Components/Certificate/certificate.scss
@@ -34,7 +34,7 @@
         overflow: hidden;
         border-radius: 10px;
         animation: backInLeft 3.5s;
-        border: 1px solid yellow;
+        border: 1px solid #00d4ff;
 
         .certificate-image {
             position: absolute;
@@ -63,7 +63,7 @@
         .title_ {
             margin-bottom: 0;
             margin-top: 0;
-            color: yellow;
+            color: #00d4ff;
             font-size: 24px;
             font-weight: 700;
             line-height: 24px;
@@ -81,7 +81,7 @@
             font-family: 'Helvetica';
 
             &:hover {
-                color: yellow;
+                color: #00d4ff;
             }
         }
 
@@ -107,7 +107,7 @@
 
         .btn:hover {
             transform: translateY(-3px);
-            background-color: yellow;
+            background-color: #00d4ff;
         }
 
         &:after {

diff --git a/src/Components/Contact/contact.scss b/src/Components/Contact/contact.scss
@@ -35,37 +35,32 @@
   input[type='text'],
   input[type='email'] {
     width: 100%;
-    background: #555;
+    background: #00d4ff;
     height: 50px;
     font-size: 16px;
-    color: #000;
+    color: black;
     padding: 0 20px;
     box-sizing: border-box;
-    border: 1px solid yellow;
+    border: 1px solid #00d4ff;
     border-radius: 8px;
 
     &:hover{
-      background-color: #bbbbbb;
+      background-color: #00d4ff;
 
     }
   }
 
   textarea {
     width: 100%;
-    background: #555;
+    background: #00d4ff;
     height: 50px;
     font-size: 16px;
-    color: #000; 
+    color: black; 
     padding: 20px;
     box-sizing: border-box;
     min-height: 220px;
-    border: 1px solid rgba(255, 255, 0);
+    border: 1px solid #00d4ff;
     border-radius: 8px;
-
-    &:hover{
-      background-color: #bbbbbb;
-
-    }
   }
 
   .flat-button{
@@ -89,7 +84,7 @@
     color: black;
 
     &:hover{
-      background-color: yellow;
+      background-color: #00d4ff;
 
     }
 
@@ -129,6 +124,7 @@
 }
 
 .info {
+    transition: all 0.5s ease;
     position: relative;
     background: #000000e5;
     width: 300px;
@@ -141,12 +137,12 @@
     opacity: 0;
     animation: fadeInRight 1.15s 2s;
     animation-fill-mode: forwards;
-    border: 1px solid yellow;
+    border: 1px solid 00d4ff;
     border-radius: 12px;
     cursor: pointer;
 
     .message{
-      color: yellow;
+      color: 00d4ff;
       font-style: italic;
       font-size: 14px;
       text-align: center;
@@ -159,6 +155,7 @@
 
     &:hover{
       background-image: url('../../../src/assets/images/Mihla.jpg');
+      object-fit: cover;
       background-size: 360px;
       color: #0a395100;
 

diff --git a/src/Components/Home/home.scss b/src/Components/Home/home.scss
@@ -20,7 +20,7 @@
         }
 
         h2 {
-            color:yellow;
+            color:#00d4ff;
             font-family: 'Coolvetica';
             letter-spacing: 1px;
             font-size: 19px;
@@ -47,7 +47,7 @@
             color: black;
 
             &:hover{
-                background-color: yellow;
+                background-color: #00d4ff;
 
             }
 

diff --git a/src/Components/MenuBar/bar.scss b/src/Components/MenuBar/bar.scss
@@ -62,7 +62,7 @@
             opacity: 0;
             -webkit-transition: all 0.3s ease-out;
             transition: all 0.3s ease-out;
-            color: yellow;
+            color: #00d4ff;
           }
 
           &:first-child {
@@ -119,7 +119,7 @@
 
           &:hover {
             svg{
-              color: yellow;
+              color: #00d4ff;
             }
 
           }

diff --git a/src/Components/Project/project.scss b/src/Components/Project/project.scss
@@ -33,9 +33,8 @@
         height: 350px;
         border-radius: 10px;
         animation: backInLeft 3.5s;
-        border: 1px solid yellow;
-        overflow-y: scroll;
-        overflow-x: hidden;
+        border: 1px solid #00d4ff;
+        overflow: hidden;
 
         .portfolio-image {
             position: absolute;
@@ -64,7 +63,7 @@
         .title {
             margin-bottom: 0;
             margin-top: 0;
-            color: yellow;
+            color: #00d4ff;
             font-size: 24px;
             font-weight: 700;
             line-height: 24px;
@@ -82,7 +81,7 @@
             font-family: 'Helvetica';
 
             &:hover {
-                color: yellow;
+                color: #00d4ff;
             }
         }
 
@@ -109,7 +108,7 @@
 
         .btn:hover {
             transform: translateY(-3px);
-            background-color: yellow;
+            background-color: #00d4ff;
         }
 
         &:after {
@@ -132,7 +131,7 @@
         }
 
         &:hover .content {
-
+            bottom: 0;
             background: transparent;
         }
     }

diff --git a/src/assets/images/Mihla.jpg b/src/assets/images/Mihla.jpg
diff --git a/src/index.scss b/src/index.scss
@@ -21,7 +21,8 @@ body {
     font: 300 calc(11px/1.4) 'Signika Negative',sans-serif;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
-    background: #333; 
+    background: rgb(2,0,36);
+    background: linear-gradient(90deg, rgba(2,0,36,1) 5%, rgba(9,9,121,1) 50%, rgba(0,212,255,1) 95%);
     overflow: hidden;
     display: block;
 }