sergiotarxz/Wordpress
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Twenty Seventeen: Display scroll down arrow when no menu

Browse Source 
This improves scrollability without a menu.

Props nnaimov, melchoyce, davidakennedy
Fixes #38392



git-svn-id: https://develop.svn.wordpress.org/trunk@38909 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Tammie Lister 2016-10-25 16:50:49 +00:00
parent 94201ff1f5
commit c388ff84ee
3 changed files with 19 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/wp-content/themes/twentyseventeen/assets/js/global.js
View File

@ -10,7 +10,7 @@
$navWrap = $navigation.find( '.wrap' ), $navWrap = $navigation.find( '.wrap' ),
$navMenuItem = $navigation.find( '.menu-item' ), $navMenuItem = $navigation.find( '.menu-item' ),
$menuToggle = $navigation.find( '.menu-toggle' ), $menuToggle = $navigation.find( '.menu-toggle' ),
$menuScrollDown = $navigation.find( '.menu-scroll-down' ), $menuScrollDown = $body.find( '.menu-scroll-down' ),
$sidebar = $body.find( '#secondary' ), $sidebar = $body.find( '#secondary' ),
$entryContent = $body.find( '.entry-content' ), $entryContent = $body.find( '.entry-content' ),
$formatQuote = $body.find( '.format-quote blockquote' ), $formatQuote = $body.find( '.format-quote blockquote' ),
@ -143,7 +143,7 @@
$( document ).ready( function() { $( document ).ready( function() {
// Let's fire some JavaScript! // Let's fire some JavaScript!
if ( 'true' === twentyseventeenScreenReaderText.has_navigation ) { if ( $menuScrollDown.length ) {
/** /**
* 'Scroll Down' arrow in menu area * 'Scroll Down' arrow in menu area

18
src/wp-content/themes/twentyseventeen/style.css
View File

@ -1464,7 +1464,7 @@ a:hover .nav-title,
/* Scroll down arrow */ /* Scroll down arrow */
.navigation-top .menu-scroll-down { .site-header .menu-scroll-down {
display: none; display: none;
} }
@ -3514,24 +3514,32 @@ article.panel-placeholder {
display: none; display: none;
} }
.site-navigation-fixed.navigation-top .menu-scroll-down { .site-navigation-fixed.site-header.menu-scroll-down {
display: none; display: none;
} }
/* Scroll down arrow */ /* Scroll down arrow */
.navigation-top .menu-scroll-down { .site-header .menu-scroll-down {
color: #767676;
display: block; display: block;
padding: 0.5em 0.5em 0.4em; padding: 0.5em 0.5em 0.4em;
position: absolute; position: absolute;
right: 0; right: 0;
top: 0.9em;
-webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */ -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
-ms-transform: rotate(90deg); /* IE 9 */ -ms-transform: rotate(90deg); /* IE 9 */
transform: rotate(90deg); transform: rotate(90deg);
} }
.site-header .menu-scroll-down {
color: #fff;
top: 2em;
}
.site-header .navigation-top .menu-scroll-down {
color: #767676;
top: 0.9em;
}
.menu-scroll-down:focus { .menu-scroll-down:focus {
outline: thin dotted; outline: thin dotted;
} }

4
src/wp-content/themes/twentyseventeen/template-parts/header/site-branding.php
View File

@ -27,5 +27,9 @@
<?php endif; ?> <?php endif; ?>
</div><!-- .site-branding-text --> </div><!-- .site-branding-text -->
<?php if ( ( twentyseventeen_is_frontpage() || ( is_home() && is_front_page() ) ) && ! has_nav_menu( 'top' ) ) : ?>
<a href="#content" class="menu-scroll-down"><?php echo twentyseventeen_get_svg( array( 'icon' => 'next' ) ); ?><span class="screen-reader-text"><?php _e( 'Scroll Down', 'twentyseventeen' ); ?></span></a>
<?php endif; ?>
</div><!-- .wrap --> </div><!-- .wrap -->
</div><!-- .site-branding --> </div><!-- .site-branding -->