ethics

src/app/ethics/ethics.component.html

@@ -2,7 +2,7 @@
     <div class="header_section">
         <img class="logo" src="assets/images/bajaj_header.png"/>
     </div>
-    <div class="align-middle">
+    <div class="align-middle title">
         <p class="txt-content font-body-xsmall-bold">{{languageConstants.codeOfConduct}}</p>
     </div>
     <div class="flex-row align-middle seperator">

src/app/ethics/ethics.component.scss

@@ -1,30 +1,49 @@
-@import '../../styles.scss';
-#notices{
+.page-container {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    background-color: #b4e8fd;
+}
+.font-body-xsmall-bold {
+    font-size: 0.812rem;
+    line-height: 1.125rem;
+    letter-spacing: 1px;
+    font-family: "Raleway VariableFont";
+    text-transform: uppercase;
+}
+.flex-row {
+    flex-direction: row;
+    display: flex;
+    width: 100%;
+}
+button {
+    border-radius: 10px;
+    font-size: 0.938rem;
+    width: 98%;
+    background: #0b5fa4 0 0 no-repeat padding-box !important;
+    margin: 2%;
+}
 .header_section {
     margin: 0 auto;
     padding: 10%;
-        .logo{
+}
+.header_section .logo {
     width: 80%;
     height: 80%;
 }
-    }
 .align-middle {
     width: 85%;
     margin: 0% auto;
     text-align: center;
-        color: $clr-sappire;
-        .font-body-xsmall-bold{
+    color: #0b5fa4;
+}
+.align-middle .font-body-xsmall-bold {
     text-transform: none;
 }
-        // input[type=text]{
-        //     background-color: #FFFFFFA6;
-        // }
-        .customDropDown{
-            background-color: #FFFFFFA6;
+.align-middle .customDropDown {
+    background-color: #fff;
     width: 100%;
     height: 4rem;
-            // border-top-right-radius: 1.3rem;
-            // border-bottom-right-radius: 1.3rem;
     border-radius: 0px 1.2rem 1.2rem 0px;
     font-size: 1.2rem;
     margin: 0;
@@ -32,38 +51,38 @@
     padding: 5% 2%;
     word-wrap: break-word;
     word-break: keep-all;
-            color: #0B5FA4;
+    color: #0b5fa4;
     font-weight: bold;
 }
-        .medium-font{
+.align-middle .medium-font {
     font-size: 1rem !important;
 }
-        .down-arrow{
+.align-middle .down-arrow {
     padding: 5% 0%;
     left: -8%;
     position: relative;
 }
-    }
 .dropDownClass {
-        background-color: #FFFFFFA6;
-        color: #0B5FA4;
+    background-color: #fff;
+    color: #0b5fa4;
     padding: 5%;
-        li{
+}
+.dropDownClass li {
     padding-bottom: 2%;
     list-style-type: disc;
     padding-left: 3%;
 }
-        .font-body-xsmall{
+.dropDownClass .font-body-xsmall {
     text-transform: none;
 }
-    }
 .seperator {
     margin-top: 2%;
 }
 .imageDropDown {
     width: 80%;
     margin: 0% 7%;
-        .transition-image{
+}
+.imageDropDown .transition-image {
     width: 100%;
     height: 100%;
     background: red;
@@ -73,5 +92,45 @@
     -o-transition: opacity 1s ease-in-out;
     transition: opacity 1s ease-in-out;
 }
+.title {
+    text-align: center;
+    margin:2%;
+    font-size: 1rem;
+}
+.dropdown {
+    width: 94%;
+    position: absolute;
+    z-index: 200;
+    background-color: #fff;
+    align-items: flex-start;
+    justify-content: flex-start;
+    margin-left: 2%;
+    border: 1px solid;
+}
+.dropdownParent {
+    position: absolute;
+    width: 60%;
+}
+.dropdown ul {
+    border: 1px solid #d7d7d7;
+}
+.dropdown li {
+    padding: 2% 2% 2% 3%;
 }
+.dropdown li a {
+    width: 100%;
+    display: block;
+    padding: 2% 2% 2% 3%;
+    height: 40px;
+    color: #000;
+}
+.dropdown ul > li a:hover, .dropdown ul > li a:active, .dropdown ul > li a:visited {
+    background-color: #e0e0e0;
+    color: #444;
+}
+.dropdown ul > li:last-child {
+    padding-bottom: 2%;
+}
+.dropdown .dropdownItem {
+    width: 100%;
 }

src/app/leave-status/leave-status.component.scss

@@ -20,7 +20,7 @@
         margin: auto;
     }
     .title-txt{
-        color: $clr-sappire;
+        color: #0B5FA4;
         text-align: end;
         margin: auto;
         padding-right: 1%;
@@ -38,7 +38,7 @@
         padding-right: 1%;
     }
     .leave-status{
-        color: $clr-sappire;
+        color: #0B5FA4;
         font-size: 12px;
     }
     .success{
@@ -52,7 +52,7 @@
         padding-right: 1%;
     }
     .active-status{
-        background-color: $clr-sappire;
+        background-color: #0B5FA4;
         text-align: center;
         padding-right: 1%;
     }

src/app/notices/notices.component.scss

@@ -12,7 +12,7 @@
         width: 85%;
         margin: 0% auto;
         text-align: center;
-        color: $clr-sappire;
+        color: #0B5FA4;
         // input[type=text]{
         //     background-color: #FFFFFFA6;
         // }

src/app/policies/policies.component.scss

@@ -12,7 +12,7 @@
         width: 85%;
         margin: 0% auto;
         text-align: center;
-        color: $clr-sappire;
+        color: #0B5FA4;
         .font-body-xsmall-bold{
             text-transform: none;
         }

src/styles/common.scss

@@ -125,7 +125,7 @@ label {
 }
 
 .seperator {
-  border-top: 1px solid $clr-grey-border;
+  border-top: 1px solid #e0e0e0;
   width: 100%;
   margin: 5%;
 }
@@ -170,12 +170,12 @@ label {
 }
 .dashed {
   @include marginTRBL(10%, 0%, 0%, 0%);
-  border: 1px dashed $clr-grey-border;
+  border: 1px dashed #e0e0e0;
   width: 100%;
 }
 .solid {
   @include marginTRBL(10%, 0%, 0%, 0%);
-  border: 1px solid $clr-grey-border;
+  border: 1px solid #e0e0e0;
   width: 100%;
 }
 .mix1 {
@@ -263,8 +263,8 @@ label {
 .dropdown ul > li a:hover,
 .dropdown ul > li a:active,
 .dropdown ul > li a:visited {
-  background-color: $clr-grey-border;
-  color: $clr-grey-medium;
+  background-color: #e0e0e0;
+  color:#444444;
 }
 .dropdown ul > li:last-child {
   padding-bottom: 2%;
@@ -275,7 +275,7 @@ label {
 .dashed-content {
   position: relative;
   .border-bottom-bg {
-    background: $clr-grey-border;
+    background: #e0e0e0;
     width: 100%;
     height: 5px;
     position: absolute;

src/styles/form-inputs.scss

@@ -16,9 +16,9 @@ select {
   font-family: Trade Gothic LT Com Bold;
   height: 50px;
   width: 100%;
-  color: $clr-grey-medium;
+  color:#444444;
   background: $clr-white;
-  border: 1px solid $clr-grey-border;
+  border: 1px solid #e0e0e0;
   border-radius: 5px;
   font-size: 0.87rem;
   line-height: 50px;