Kodilan.com frontend redesigned

.eslintrc.js

@@ -30,7 +30,9 @@ module.exports = {
     'max-len': ['error', {
       code: 200,
       ignoreComments: true,
+      ignoreTemplateLiterals: true,
       ignoreStrings: true,
+      ignorePattern: 'd="([\\s\\S]*?)"',
       ignoreRegExpLiterals: true,
     }],
     'vue/order-in-components': ['error', {

src/assets/css/base.css

@@ -161,7 +161,7 @@ table {
 ================================================== */
 
 body {
-  background-color: #fff;
+  background-color: #F1F2F4;
   font-size: 14px;
   line-height: 27px;
   color: #666;
@@ -221,7 +221,7 @@ a.menu-trigger,
 .category-small-box span,
 .testimonial,
 .testimonial p {
-  font-family: "Montserrat", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", "Montserrat", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
 }
 
 /* #Margin Styles
@@ -502,7 +502,7 @@ hr {
 ================================================== */
 
 a {
-  color: #505050;
+  color: #26ae61;
   text-decoration: none;
   outline: 0;
   -webkit-transition: color 0.2s ease-in-out;
@@ -590,16 +590,27 @@ select {
   padding: 14px 18px;
   outline: none;
   font-size: 14px;
-  color: #909090;
+  color: #000000;
   margin: 0;
   max-width: 100%;
   width: 100%;
   box-sizing: border-box;
   display: block;
-  background-color: #fcfcfc;
+  background-color: #FAFAFA;
   font-weight: 500;
   border: 1px solid #e0e0e0;
   opacity: 1;
+  box-shadow: 0px 2px 4px -2px rgba(0,0,0,.065);
+}
+
+.fake-input::placeholder,
+input[type="text"]::placeholder,
+input[type="password"]::placeholder,
+input[type="email"]::placeholder,
+input[type="number"]::placeholder,
+textarea::placeholder,
+select::placeholder {
+  color: #909090;
 }
 
 select {
@@ -611,14 +622,26 @@ input[type="password"]:focus,
 input[type="email"]:focus,
 input[type="number"]:focus,
 textarea:focus {
-  color: #808080;
+  color: #000000;
+  background-color: #FFF;
   -webkit-transition: all 0.1s ease-in-out;
   -moz-transition: all 0.1s ease-in-out;
   -o-transition: all 0.1s ease-in-out;
   -ms-transition: all 0.1s ease-in-out;
   transition: all 0.1s ease-in-out;
-  border: 1px solid #d8d8d8;
+  border: 1px solid #26AE61;
+  opacity: 1;
+  box-shadow: inset 0px 1px 3px 0 rgba(0, 0, 0, 0.065) , 0px 2px 4px -2px rgba(0,0,0,.065), 0px 10px 15px -3px rgba(0,0,0,.05);
+}
+
+input[type="text"].flat:focus,
+input[type="password"].flat:focus,
+input[type="email"].flat:focus,
+input[type="number"].flat:focus,
+textarea.flat:focus {
+  border: none;
   opacity: 1;
+  box-shadow: none;
 }
 
 ::-webkit-input-placeholder {