I added the new graphic to the header

I added the new golf swing graphic to the nav bar.  It doesn't match
what Collins thinks may be best, but to keep the topbar nav consistant,
it has to be in the positon it is in now.

diff --git a/assets/central-swing-nav-graphic.png b/assets/central-swing-nav-graphic.png
new file mode 100644 (file)
index 0000000..89c40aa
Binary files /dev/null and b/assets/central-swing-nav-graphic.png differ

diff --git a/css/app.css b/css/app.css
index cd2e1ee..9753257 100644 (file)
--- a/css/app.css
+++ b/css/app.css
@@ -6608,6 +6608,27 @@ ul#sec-nav {
         border-top-right-radius: 10px;
         border-bottom-left-radius: 0;
         border-bottom-right-radius: 0; }
+    .top-bar-section ul li:last-child:not(.has-form) {
+      top: -65px; }
+      .top-bar-section ul li:last-child:not(.has-form) a:not(.button) {
+        background-image: url(../assets/central-swing-nav-graphic.png);
+        background-position: top left;
+        background-repeat: no-repeat;
+        color: transparent;
+        width: 192px;
+        min-height: 107px; }
+        .top-bar-section ul li:last-child:not(.has-form) a:not(.button):hover {
+          width: 192px;
+          background: #1479b0;
+          color: transparent;
+          background-image: url(../assets/central-swing-nav-graphic.png);
+          background-position: top left;
+          background-repeat: no-repeat; }
+      .top-bar-section ul li:last-child:not(.has-form) .dropdown li {
+        top: auto; }
+        .top-bar-section ul li:last-child:not(.has-form) .dropdown li a {
+          min-height: 0;
+          width: 100%; }
     .top-bar-section ul li .dropdown {
       z-index: 1;
       position: relative;
@@ -6663,7 +6684,9 @@ ul#sec-nav {
           line-height: 1.2;
           padding: 0;
           text-transform: none;
-          text-align: left; }
+          text-align: left;
+          min-height: 0;
+          width: 100%; }
         .top-bar-section ul li .dropdown li.active:not(.has-form) a:not(.button) {
           color: #690433;
           padding: 0;
@@ -6672,6 +6695,9 @@ ul#sec-nav {
           text-transform: none; }
           .top-bar-section ul li .dropdown li.active:not(.has-form) a:not(.button):hover {
             background: transparent; }
+        .top-bar-section ul li .dropdown li:last-child {
+          top: auto;
+          height: auto; }
     .top-bar-section ul li.drop-left > .dropdown {
       right: 0 !important;
       left: auto !important;

diff --git a/header.php b/header.php
index a013531..55c678f 100644 (file)
--- a/header.php
+++ b/header.php
@@ -53,7 +53,7 @@ Note 2: 'Nb cols' parameter for Bootstrap only.
                             <div id="logo" class="medium-8 large-4 columns show-for-medium-up text-center">
                                 <a href="<?php bloginfo('url'); ?>"><img class="text-center" alt="Mount Pleasant logo" src="<?php bloginfo('template_url'); ?>/assets/mt-pleasant-pure-mi-logo.png"></a>
                             </div>
-                            <div class="search-top medium-3 columns show-for-medium-up">
+                            <div class="search-top medium-4 columns show-for-medium-up">
                                 <?php get_template_part('parts/search');?>
                                 <ul id="sec-nav" class="right">
                                     <li><a href="<?php bloginfo('url'); ?>">Home</a></li>
@@ -66,9 +66,6 @@ Note 2: 'Nb cols' parameter for Bootstrap only.
                             </div>
                         </div>
                         <?php get_template_part('parts/top-bar');?>
-                        <div class="row collapse golf-container">
-                            <a href="<?php echo get_permalink(3041); ?>"><img id="golf-logo" alt="Michigan's Central Swing" src="<?php bloginfo('template_url'); ?>/assets/central-swing-logo-small.jpg"></a>
-                        </div>
                         <a id="sm-logo" class="show-for-small-down text-center" href="<?php bloginfo('url'); ?>"><img alt="Mount Pleasant logo" src="<?php bloginfo('template_url'); ?>/assets/mt-pleasant-pure-mi-logo.png"></a>
                     </header>
                     <?php get_template_part('parts/off-canvas-menu');?>

diff --git a/scss/_topbar.scss b/scss/_topbar.scss
index 8e6dbd5..3ee12be 100644 (file)
--- a/scss/_topbar.scss
+++ b/scss/_topbar.scss
@@ -60,9 +60,6 @@
 //                    text-shadow: -1 0 1px $d-blue;
 //                    text-shadow: 0 -1 1px $d-blue;
                 }
-            }
-            &:last-child {
-                
             }
             &.menu-item-has-children.has-dropdown {
                 a {
@@ -78,6 +75,36 @@
                     }
                 }
             }
+            &:last-child {
+                &:not(.has-form) {
+                    top: -65px;
+                    a:not(.button) {
+                        background-image: url(../assets/central-swing-nav-graphic.png);
+                        background-position: top left;
+                        background-repeat: no-repeat;
+                        color: transparent;
+                        width: 192px;
+                        min-height: 107px;
+                        &:hover {
+                            width: 192px;
+                            background: $blue;
+                            color: transparent;
+                            background-image: url(../assets/central-swing-nav-graphic.png);
+                            background-position: top left;
+                            background-repeat: no-repeat;
+                        }
+                    }
+                    .dropdown {
+                        li {
+                            top: auto;
+                            a {
+                                min-height: 0;
+                                width: 100%;
+                            }
+                        }
+                    }
+                }
+            }
             .dropdown {
                 z-index: 1;
                 position: relative;
@@ -145,6 +172,8 @@
                             padding: 0;
                             text-transform: none;
                             text-align: left;
+                            min-height: 0;
+                            width: 100%;
                         }
                     }
                     &.active:not(.has-form) a:not(.button) {
@@ -157,6 +186,16 @@
                             background: transparent;
                         }
                     }
+                    &:last-child {
+                        top: auto;
+                        height: auto;
+//                        a {
+//                            color: $black;
+//                            &:hover {
+//                                color: $blue;
+//                            }
+//                        }
+                    }
                 }
             } 
             &.drop-left > .dropdown {