Styles and markup changes for titles, header, menus

Logo size increased, header height increased, top-nav now bottom-
aligned, titles removed from page sections, parent page titles
moved to the left of the sub-menus, hover effect changed for menus.

diff --git a/assets/js/navigation.js b/assets/js/navigation.js
index 74d026b..a2cdc44 100755 (executable)
--- a/assets/js/navigation.js
+++ b/assets/js/navigation.js
@@ -135,6 +135,18 @@
 
         });
 
+        $(".static-home-link").click(function() {
+
+        var scrollTarget = $('.home');
+//            console.log(scrollTarget);
+            if (scrollTarget) {
+                $('body, html').animate({
+                    scrollTop: scrollTarget.offset().top-100
+                }, 300);
+            }
+
+        });
+
         function setActiveNavItem() {
 //            $(".twentyseventeen-panel").each(function() {
 //                if(myTopPosition > $(this).offset().top && ( $(this).offset().top + $(this).outerHeight() > myTopPosition) ) {

diff --git a/front-page.php b/front-page.php
index 85539d8..03d040d 100755 (executable)
--- a/front-page.php
+++ b/front-page.php
@@ -44,7 +44,7 @@ get_header(); ?>
                                         'post_parent'      => '0',
                                         'post_status'      => 'publish',
                                         'suppress_filters' => false,
-                                        'post_name__in'         => ['services','portfolio','contact-us'],
+                                        'post_name__in'    => ['services','portfolio','contact-us'],
                                 );
                                 $all_parents = get_posts( $parent_args );
 
@@ -55,7 +55,7 @@ get_header(); ?>
 
                                         <hr class='content-separator'>
                                         <div id="nav-<?php echo $a_parent->ID;?>" class="parent-container nav-parent">
-                                            <h1><?php echo $a_parent->post_title; ?></h1>
+                                            <h1><?php echo $a_parent->post_title; ?>:</h1>
 
                                         <?php
                                             $child_args = array(
@@ -69,9 +69,12 @@ get_header(); ?>
                                                 'suppress_filters' => false
                                             );
                                             $child_posts = get_posts( $child_args );
-                                            if (count($child_posts) > 1) {
                                         ?>
+
                                             <ul class="page-nav-container">
+                                        <?php
+                                            if (count($child_posts) > 1) {
+                                        ?>
                                             <?php
                                             $nav_count = 0;
                                             foreach ($child_posts as $child_post) {
@@ -83,8 +86,9 @@ get_header(); ?>
                                                 $nav_count++;
                                             }
                                             ?>
-                                            </ul>
+
                                         <?php } ?>
+                                            </ul>
                                         </div>
                                         <div id="content-<?php echo $a_parent->ID;?>" class="parent-container content-parent">
                                             <ul class="page-content-container">
@@ -96,9 +100,9 @@ get_header(); ?>
                                                         <article id='page-<?php echo $child_post->ID; ?>' class='<?php if ($content_count !== 0) { echo "inactive";}?> twentyseventeen-panel page type-page hentry status-<?php echo $child_post->post_status; ?>' type-<?php echo $child_post->post_type; ?>>
                                                             <div class='panel-content'>
                                                                 <div class='wrap'>
-                                                                    <header class="entry-header">
-                                                                        <h2 class="entry-title"><?php echo $child_post->post_title; ?></h2>
-                                                                    </header><!-- .entry-header -->
+<!--                                                                    <header class="entry-header">
+                                                                        <h2 class="entry-title"><?php // echo $child_post->post_title; ?></h2>
+                                                                    </header> .entry-header -->
                                                                     <div class="entry-content">
 
                                                                         <p><?php echo apply_filters( 'the_content', get_post_field('post_content', $child_post->ID) ); ?></p>

diff --git a/header.php b/header.php
index 341a275..8e9a68f 100755 (executable)
--- a/header.php
+++ b/header.php
@@ -25,7 +25,7 @@
 <body <?php body_class(); ?>>
     <div id="top-nav">
         <div class="top-nav-left">
-            <a class="static-nav-link" href="#frontpage-sub-title">
+            <a class="static-home-link" href="#home">
                 <img src="<?php bloginfo('template_url');?>/assets/images/header-logo.png">
             </a>
         </div>
@@ -55,7 +55,7 @@
                             'post_name__in'         => ['services','portfolio','contact-us'],
                     );
                     $nav_items = get_posts( $nav_items_args );
-                    echo '<li><a class="static-nav-link" href="#frontpage-sub-title"> Home </a></li>';
+                    echo '<li><a class="static-home-link" href="#home"> Home </a></li>';
                     foreach ( $nav_items as $nav_item ) {
                         echo '<li><a class="static-nav-link" href="#nav-'. $nav_item->ID .'"> ' . $nav_item->post_title . '</a></li>';
                     }

diff --git a/style.css b/style.css
index 49ab024..997b18c 100755 (executable)
--- a/style.css
+++ b/style.css
@@ -1591,7 +1591,7 @@ a:hover .nav-title,
     float: left;
 }
 .top-nav-left > img {
-    height: 50px;
+    height: 65px;
 }
 .top-nav-right {
     float: right;
@@ -1748,7 +1748,7 @@ a:hover .nav-title,
     .home #top-nav {
         background-color: white;
         border-bottom: 2px solid black;
-        height: 65px;
+        height: 80px;
         padding-top: 7px;
         padding-left: 0;
         position: fixed;
@@ -1837,15 +1837,18 @@ body {
 #top-nav {
     background-color: white;
     border-bottom: 2px solid black;
-    height: 65px;
+    height: 80px;
     padding-left: 25px;
     padding-top: 7px;
     position: fixed;
     width: 100%;
     z-index: 9;
 }
+.home ul.top-nav-right-list {
+    margin-top: 30px;
+}
 .top-nav-left img {
-    height: 50px;
+    height: 65px;
 }
 
 #masthead .wrap {
@@ -2000,7 +2003,7 @@ body:not(.title-tagline-hidden) .site-branding-text {
        position: fixed;
        height: auto;
        left: 50%;
-        margin-top: 40px;
+        margin-top: 75px;
        max-width: 1000%;
        //min-height: 100%;
        min-width: 100%;
@@ -2128,8 +2131,11 @@ body:not(.has-header-image):not(.has-header-video) .custom-header-media {
 }
 .parent-container h1 {
     font-size: 60px;
-    font-weight: bold;
+    font-weight: normal;
     margin-bottom: 5px;
+    position: absolute;
+    left: 10%;
+    text-transform: lowercase;
 }
 @media screen and (max-width: 768px) {
     .parent-container h1 {
@@ -2143,25 +2149,37 @@ body:not(.has-header-image):not(.has-header-video) .custom-header-media {
     clear: both;
     float: none;
     list-style: none;
+    margin-top: 35px;
+}
+@media screen and (max-width: 1640px) {
+    .page-nav-container {
+        margin-top: 85px;
+    }
 }
 .page-nav-container li {
     display: inline;
     cursor: pointer;
-    border: 1px solid lightgrey;
+/*    border-width: 0 1px;
+    border-style: solid;
+    border-color: lightgrey;*/
     float: left;
     list-style: outside none none;
+    text-transform: lowercase;
+    color: #666666
 }
+
 @media screen and (max-width: 768px) {
     .page-nav-container li {
         width: 100%;
         text-align: center;
     }
 }
-.page-nav-container li:hover {
-    background-color: #f3f3f3;
+.page-nav-container li:hover .panel-toggle {
+    color: black;
 }
-.page-nav-container li.active {
-    background-color: #f3f3f3;
+.page-nav-container li.active .panel-toggle {
+    color: black;
+    text-decoration: underline;
 }
 .page-content-container {
     clear: both;
@@ -2196,7 +2214,14 @@ body:not(.has-header-image):not(.has-header-video) .custom-header-media {
 .panel-toggle {
     float: left;
     display: block;
-    padding: 10px;
+    padding: 2px 10px;
+    font-size: 18px;
+}
+.page-nav-container li .panel-toggle {
+    border-right: 1px solid #666666;
+}
+.page-nav-container li:last-child .panel-toggle {
+    border-right: 0;
 }
 @media screen and (max-width: 768px) {
     .panel-toggle {
@@ -4091,7 +4116,7 @@ object {
        .home.blog.has-header-image .custom-header-media,
        .home.blog.has-header-video .custom-header-media {
 /*             height: 1200px;*/
-               height: 41vh;
+               height: 51vh;
                max-height: 100%;
                overflow: hidden;
        }