From 02fb75c450f69a44c305aab3d8d165184494622e Mon Sep 17 00:00:00 2001
From: clyates <chris@clyates.plus.com>
Date: Thu, 10 Apr 2014 15:25:06 +0100
Subject: [PATCH] Update _top-bar.scss

Fix to three issues:

Removing the background from .top-bar-section ul (line 286) prevents bleed through of dropdown background colour onto the top level if ul elements have had padding declared elsewhere

Adding padding: 0; to .dropdown (line 385) ensures that dropdown menus align the the top menu item and sit alongside each other whether or not ul elements have had padding declared elsewhere

Changes to line heights (lines 484, 491, and 549)  make top level links the same height as the Top Bar removing the "overhang" at the bottom, while keeping the line height for dropdown links
---
 scss/foundation/components/_top-bar.scss | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/scss/foundation/components/_top-bar.scss b/scss/foundation/components/_top-bar.scss
index 5b04856ed..ce2c61a85 100644
--- a/scss/foundation/components/_top-bar.scss
+++ b/scss/foundation/components/_top-bar.scss
@@ -283,7 +283,6 @@ $topbar-arrows: true !default; //Set false to remove the triangle icon from the
         width: 100%;
         height: auto;
         display: block;
-        background: $topbar-dropdown-bg;
         font-size: $rem-base;
         margin: 0;
       }
@@ -383,6 +382,7 @@ $topbar-arrows: true !default; //Set false to remove the triangle icon from the
 
       // Styling elements inside of dropdowns
       .dropdown {
+        padding: 0;
         position: absolute;
         #{$default-float}: 100%;
         top: 0;
@@ -480,7 +480,6 @@ $topbar-arrows: true !default; //Set false to remove the triangle icon from the
           &:not(.has-form) {
             a:not(.button) {
               padding: 0 $topbar-link-padding;
-              line-height: $topbar-height;
               background: $topbar-link-bg;
               &:hover { background: $topbar-link-bg-hover; }
             }
@@ -488,7 +487,6 @@ $topbar-arrows: true !default; //Set false to remove the triangle icon from the
           &.active:not(.has-form) {
             a:not(.button) {
               padding: 0 $topbar-link-padding;
-              line-height: $topbar-height;
               color: $topbar-link-color-active;
               background: $topbar-link-bg-active;
               &:hover { background: $topbar-link-bg-active-hover; }
@@ -547,7 +545,7 @@ $topbar-arrows: true !default; //Set false to remove the triangle icon from the
           li {
             a {
               color: $topbar-dropdown-link-color;
-              line-height: 1;
+              line-height: $topbar-height;
               white-space: nowrap;
               padding: 12px $topbar-link-padding;
               background: $topbar-dropdown-link-bg;
-- 
2.47.2