Improve header styles

access-ci-org · Jul 19, 2023 · 43fdef0 · 43fdef0
1 parent 6a144a2
commit 43fdef0
Show file tree

Hide file tree

Showing 4 changed files with 71 additions and 18 deletions.
diff --git a/CHANGELOG b/CHANGELOG
@@ -1,3 +1,6 @@
+v0.3.26 20230719      Dinuka De Silva
+  - Improve header styles
+
 v0.3.25 20230601      Dinuka De Silva
   - Improve header and footer styles
 

diff --git a/b5_ac_conect/css/style.css b/b5_ac_conect/css/style.css
diff --git a/b5_ac_conect/css/style.css.map b/b5_ac_conect/css/style.css.map
diff --git a/b5_ac_conect/scss/_styles_access.scss b/b5_ac_conect/scss/_styles_access.scss
@@ -186,6 +186,13 @@ footer {
         background-image: url(../assets/img/icons/bars-solid.svg);
     }
 
+    .sf-depth-1 {
+        ul {
+            padding: 10px !important;
+            background-color: $access-medium;
+        }
+    }
+
     ul {
         li {
 
@@ -194,11 +201,20 @@ footer {
                 &.sf-depth-1 {
                     color: $access-light;
                     background-color: $access-dark;
+                    font-weight: 700;
+                    font-size: 14px;
+                    padding: 16px 8px;
+                }
+
+                &.sf-depth-2 {
+                    color: $access-light;
+                    background-color: $access-medium;
+                    font-weight: 600;
+                    font-size: 14px;
+                    padding: 6px 5px;
                 }
 
-                padding: 16px 8px;
                 text-decoration: none;
-                font-weight: 700;
 
                 &:hover, &:focus {
                     color: $access-light;
@@ -210,10 +226,6 @@ footer {
                     color: $access-light;
                     background-color: $access-medium;
                 }
-
-                color: $access-light;
-                background-color: $access-medium;
-                font-size: 14px;
             }
 
             &.sfHover a {
@@ -236,6 +248,13 @@ footer {
         line-height: 10px;
     }
 
+    .sf-depth-1 {
+        ul {
+            padding: 10px !important;
+            background-color: $access-medium;
+        }
+    }
+
     ul {
         @extend .d-inline-block;
         @extend .list-inline;
@@ -252,13 +271,21 @@ footer {
                 color: $access-light;
 
                 text-decoration: none;
-                font-weight: 600;
-                font-size: 16px;
-                padding: 16px 24px;
 
                 &.sf-depth-1 {
                     color: $access-dark;
                     background-color: white;
+                    font-weight: 600;
+                    font-size: 16px;
+                    padding: 16px 24px;
+                }
+
+                &.sf-depth-2 {
+                    color: $access-light;
+                    background-color: $access-medium;
+                    font-weight: 600;
+                    font-size: 14px;
+                    padding: 6px 5px;
                 }
 
                 &:hover {