Twenty Fourteen: implement an alternate "slider" view for home page featured content. Props iamtakashi for the design and implementation. Slider JavaScript code adapted from FlexSlider v2.2.0 props WooThemes and mbmufffin. See #25550.
git-svn-id: https://develop.svn.wordpress.org/trunk@25979 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Lance Willett
parent
e3e3e1d109
commit
93b93b103f
@ -9,38 +9,24 @@
|
||||
?>
|
||||
|
||||
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
|
||||
<a class="attachment-featured-featured" href="<?php the_permalink(); ?>" rel="<?php the_ID(); ?>">
|
||||
<?php
|
||||
if ( has_post_thumbnail() ) :
|
||||
<a class="post-thumbnail" href="<?php the_permalink(); ?>" rel="<?php the_ID(); ?>">
|
||||
<?php
|
||||
if ( has_post_thumbnail() ) :
|
||||
if ( 'grid' == get_theme_mod( 'featured_content_layout' ) )
|
||||
the_post_thumbnail( 'post-thumbnail-grid' );
|
||||
|
||||
else :
|
||||
$images = get_children( array(
|
||||
'post_parent' => get_the_ID(),
|
||||
'post_type' => 'attachment',
|
||||
'post_mime_type' => 'image',
|
||||
'orderby' => 'menu_order',
|
||||
'order' => 'ASC',
|
||||
'numberposts' => 1,
|
||||
) );
|
||||
|
||||
if ( $images ) :
|
||||
$image = array_shift( $images );
|
||||
echo wp_get_attachment_image( $image->ID, 'post-thumbnail-grid' );
|
||||
endif;
|
||||
endif;
|
||||
?>
|
||||
else
|
||||
the_post_thumbnail( 'post-thumbnail-slider' );
|
||||
endif;
|
||||
?>
|
||||
</a>
|
||||
|
||||
<div class="entry-wrap">
|
||||
<header class="entry-header">
|
||||
<?php if ( in_array( 'category', get_object_taxonomies( get_post_type() ) ) && twentyfourteen_categorized_blog() ) : ?>
|
||||
<div class="entry-meta">
|
||||
<span class="cat-links"><?php echo get_the_category_list( _x( ', ', 'Used between list items, there is a space after the comma.', 'twentyfourteen' ) ); ?></span>
|
||||
</div><!-- .entry-meta -->
|
||||
<?php endif; ?>
|
||||
<header class="entry-header">
|
||||
<?php if ( in_array( 'category', get_object_taxonomies( get_post_type() ) ) &&twentyfourteen_categorized_blog() ) : ?>
|
||||
<div class="entry-meta">
|
||||
<span class="cat-links"><?php echo get_the_category_list( _x( ', ', 'Used between list items, there is a space after the comma.', 'twentyfourteen' ) ); ?></span>
|
||||
</div><!-- .entry-meta -->
|
||||
<?php endif; ?>
|
||||
|
||||
<?php the_title( '<h1 class="entry-title"><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h1>' ); ?>
|
||||
</header><!-- .entry-header -->
|
||||
</div>
|
||||
<?php the_title( '<h1 class="entry-title"><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">','</a></h1>' ); ?>
|
||||
</header><!-- .entry-header -->
|
||||
</article><!-- #post-## -->
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
?>
|
||||
|
||||
<div id="featured-content" class="featured-content">
|
||||
|
||||
<div class="featured-content-inner">
|
||||
<?php
|
||||
do_action( 'twentyfourteen_featured_posts_before' );
|
||||
|
||||
@ -26,5 +26,5 @@
|
||||
|
||||
wp_reset_postdata();
|
||||
?>
|
||||
|
||||
</div><!-- .featured-content-inner -->
|
||||
</div><!-- #featured-content .featured-content -->
|
||||
|
||||
@ -68,6 +68,7 @@ function twentyfourteen_setup() {
|
||||
add_theme_support( 'post-thumbnails' );
|
||||
|
||||
// Add several sizes for Post Thumbnails.
|
||||
add_image_size( 'post-thumbnail-slider', 1038, 576, true );
|
||||
add_image_size( 'post-thumbnail-grid', 672, 372, true );
|
||||
add_image_size( 'post-thumbnail', 672, 0 );
|
||||
|
||||
@ -219,9 +220,8 @@ function twentyfourteen_font_url() {
|
||||
* @return void
|
||||
*/
|
||||
function twentyfourteen_scripts() {
|
||||
|
||||
// Add Lato font, used in the main stylesheet.
|
||||
wp_enqueue_style( 'twentyfourteen-lato' );
|
||||
wp_enqueue_style( 'twentyfourteen-lato', twentyfourteen_font_url(), array(), null );
|
||||
|
||||
// Add Genericons font, used in the main stylesheet.
|
||||
wp_enqueue_style( 'genericons', get_template_directory_uri() . '/fonts/genericons.css', array(), '3.0' );
|
||||
@ -238,10 +238,10 @@ function twentyfourteen_scripts() {
|
||||
if ( is_active_sidebar( 'sidebar-3' ) )
|
||||
wp_enqueue_script( 'jquery-masonry' );
|
||||
|
||||
wp_enqueue_script( 'twentyfourteen-script', get_template_directory_uri() . '/js/functions.js', array( 'jquery' ), '20131011', true );
|
||||
if ( 'slider' == get_theme_mod( 'featured_content_layout' ) )
|
||||
wp_enqueue_script( 'twentyfourteen-slider', get_template_directory_uri() . '/js/slider.js', array( 'jquery' ), '20131028', true );
|
||||
|
||||
// Add Lato font used in the main stylesheet.
|
||||
wp_enqueue_style( 'twentyfourteen-lato', twentyfourteen_font_url(), array(), null );
|
||||
wp_enqueue_script( 'twentyfourteen-script', get_template_directory_uri() . '/js/functions.js', array( 'jquery' ), '20131011', true );
|
||||
}
|
||||
add_action( 'wp_enqueue_scripts', 'twentyfourteen_scripts' );
|
||||
|
||||
@ -365,6 +365,7 @@ endif;
|
||||
* 4. Full-width content layout.
|
||||
* 5. Presence of footer widgets.
|
||||
* 6. Single views.
|
||||
* 7. Featured content layout.
|
||||
*
|
||||
* @since Twenty Fourteen 1.0
|
||||
*
|
||||
@ -395,6 +396,11 @@ function twentyfourteen_body_classes( $classes ) {
|
||||
if ( is_singular() )
|
||||
$classes[] = 'singular';
|
||||
|
||||
if ( is_front_page() && 'slider' == get_theme_mod( 'featured_content_layout' ) )
|
||||
$classes[] = 'slider';
|
||||
elseif ( is_front_page() )
|
||||
$classes[] = 'grid';
|
||||
|
||||
return $classes;
|
||||
}
|
||||
add_filter( 'body_class', 'twentyfourteen_body_classes' );
|
||||
|
||||
@ -30,6 +30,29 @@ function twentyfourteen_customize_register( $wp_customize ) {
|
||||
'section' => 'colors',
|
||||
'settings' => 'accent_color',
|
||||
) ) );
|
||||
|
||||
// Add the featured content section.
|
||||
$wp_customize->add_section( 'featured_content', array(
|
||||
'title' => __( 'Featured Content', 'twentyfourteen' ),
|
||||
'priority' => 120,
|
||||
) );
|
||||
|
||||
// Add the featured content layout setting and control.
|
||||
$wp_customize->add_setting( 'featured_content_layout', array(
|
||||
'default' => 'grid',
|
||||
'type' => 'theme_mod',
|
||||
'capability' => 'edit_theme_options',
|
||||
) );
|
||||
|
||||
$wp_customize->add_control( 'featured_content_layout', array(
|
||||
'label' => __( 'Layout', 'twentyfourteen' ),
|
||||
'section' => 'featured_content',
|
||||
'type' => 'select',
|
||||
'choices' => array(
|
||||
'grid' => __( 'Grid', 'twentyfourteen' ),
|
||||
'slider' => __( 'Slider', 'twentyfourteen' ),
|
||||
),
|
||||
) );
|
||||
}
|
||||
add_action( 'customize_register', 'twentyfourteen_customize_register' );
|
||||
|
||||
|
||||
@ -157,15 +157,15 @@ class Twenty_Fourteen_Ephemera_Widget extends WP_Widget {
|
||||
$total_images = count( $images );
|
||||
|
||||
if ( has_post_thumbnail() ) :
|
||||
$featured_image = get_the_post_thumbnail( get_the_ID(), 'featured-thumbnail-formatted' );
|
||||
$post_thumbnail = get_the_post_thumbnail( get_the_ID(), 'post-thumbnail' );
|
||||
elseif ( $total_images > 0 ) :
|
||||
$image = array_shift( $images );
|
||||
$featured_image = wp_get_attachment_image( $image, 'featured-thumbnail-formatted' );
|
||||
$post_thumbnail = wp_get_attachment_image( $image, 'post-thumbnail' );
|
||||
endif;
|
||||
|
||||
if ( ! empty ( $featured_image ) ) :
|
||||
if ( ! empty ( $post_thumbnail ) ) :
|
||||
?>
|
||||
<a href="<?php the_permalink(); ?>"><?php echo $featured_image; ?></a>
|
||||
<a href="<?php the_permalink(); ?>"><?php echo $post_thumbnail; ?></a>
|
||||
<?php
|
||||
endif;
|
||||
?>
|
||||
|
||||
@ -2,9 +2,7 @@
|
||||
var body = $( 'body' ),
|
||||
_window = $( window );
|
||||
|
||||
/**
|
||||
* Enables menu toggle for small screens.
|
||||
*/
|
||||
// Enable menu toggle for small screens.
|
||||
( function() {
|
||||
var nav = $( '#primary-navigation' ), button, menu;
|
||||
if ( ! nav )
|
||||
@ -26,7 +24,7 @@
|
||||
} );
|
||||
} )();
|
||||
|
||||
/**
|
||||
/*
|
||||
* Makes "skip to content" link work correctly in IE9 and Chrome for better
|
||||
* accessibility.
|
||||
*
|
||||
@ -44,9 +42,7 @@
|
||||
} );
|
||||
|
||||
$( function() {
|
||||
/**
|
||||
* Search toggle.
|
||||
*/
|
||||
// Search toggle.
|
||||
$( '.search-toggle' ).on( 'click.twentyfourteen', function() {
|
||||
var that = $( this ),
|
||||
wrapper = $( '.search-box-wrapper' );
|
||||
@ -58,7 +54,7 @@
|
||||
wrapper.find( '.search-field' ).focus();
|
||||
} );
|
||||
|
||||
/**
|
||||
/*
|
||||
* Fixed navbar.
|
||||
*
|
||||
* The callback on the scroll event is only added if there is a header
|
||||
@ -76,17 +72,13 @@
|
||||
} );
|
||||
}
|
||||
|
||||
/**
|
||||
* Focus styles for primary menu.
|
||||
*/
|
||||
// Focus styles for primary menu.
|
||||
$( '.primary-navigation' ).find( 'a' ).on( 'focus.twentyfourteen blur.twentyfourteen', function() {
|
||||
$( this ).parents().toggleClass( 'focus' );
|
||||
} );
|
||||
} );
|
||||
|
||||
/**
|
||||
* Arranges footer widgets vertically.
|
||||
*/
|
||||
// Arrange footer widgets vertically.
|
||||
if ( $.isFunction( $.fn.masonry ) ) {
|
||||
$( '#footer-sidebar' ).masonry( {
|
||||
itemSelector: '.widget',
|
||||
@ -97,5 +89,15 @@
|
||||
isResizable: true,
|
||||
isRTL: $( 'body' ).is( '.rtl' )
|
||||
} );
|
||||
}
|
||||
} )( jQuery );
|
||||
};
|
||||
|
||||
// Initialize Featured Content slider.
|
||||
_window.load( function() {
|
||||
if ( body.is( '.slider' ) ) {
|
||||
$( '.featured-content' ).featuredslider( {
|
||||
selector: '.featured-content-inner > article',
|
||||
controlsContainer: '.featured-content'
|
||||
} );
|
||||
}
|
||||
} );
|
||||
} )( jQuery );
|
||||
|
||||
572
src/wp-content/themes/twentyfourteen/js/slider.js
Normal file
572
src/wp-content/themes/twentyfourteen/js/slider.js
Normal file
@ -0,0 +1,572 @@
|
||||
/*
|
||||
* Twenty Fourteen Featured Content Slider
|
||||
*
|
||||
* Adapted from FlexSlider v2.2.0, copyright 2012 WooThemes
|
||||
* @link http://www.woothemes.com/flexslider/
|
||||
*/
|
||||
|
||||
( function( $ ) {
|
||||
// FeaturedSlider: object instance.
|
||||
$.featuredslider = function( el, options ) {
|
||||
var slider = $( el );
|
||||
|
||||
// Make variables public.
|
||||
slider.vars = $.extend( {}, $.featuredslider.defaults, options );
|
||||
|
||||
var namespace = slider.vars.namespace,
|
||||
msGesture = window.navigator && window.navigator.msPointerEnabled && window.MSGesture,
|
||||
touch = ( ( 'ontouchstart' in window ) || msGesture || window.DocumentTouch && document instanceof DocumentTouch ),
|
||||
eventType = 'click touchend MSPointerUp',
|
||||
watchedEvent = '',
|
||||
watchedEventClearTimer,
|
||||
methods = {},
|
||||
focused = true;
|
||||
|
||||
// Store a reference to the slider object.
|
||||
$.data( el, 'featuredslider', slider );
|
||||
|
||||
// Private slider methods.
|
||||
methods = {
|
||||
init: function() {
|
||||
slider.animating = false;
|
||||
slider.currentSlide = 0;
|
||||
slider.animatingTo = slider.currentSlide;
|
||||
slider.atEnd = ( slider.currentSlide === 0 || slider.currentSlide === slider.last );
|
||||
slider.containerSelector = slider.vars.selector.substr( 0, slider.vars.selector.search( ' ' ) );
|
||||
slider.slides = $( slider.vars.selector, slider );
|
||||
slider.container = $( slider.containerSelector, slider );
|
||||
slider.count = slider.slides.length;
|
||||
slider.prop = 'marginLeft';
|
||||
slider.args = {};
|
||||
// TOUCH
|
||||
slider.transitions = ( function() {
|
||||
var obj = document.createElement( 'div' ),
|
||||
props = ['perspectiveProperty', 'WebkitPerspective', 'MozPerspective', 'OPerspective', 'msPerspective'];
|
||||
for ( var i in props ) {
|
||||
if ( obj.style[ props[i] ] !== undefined ) {
|
||||
slider.pfx = props[i].replace( 'Perspective', '' ).toLowerCase();
|
||||
slider.prop = '-' + slider.pfx + '-transform';
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}() );
|
||||
// CONTROLSCONTAINER
|
||||
if ( slider.vars.controlsContainer !== '' )
|
||||
slider.controlsContainer = $( slider.vars.controlsContainer ).length > 0 && $( slider.vars.controlsContainer );
|
||||
|
||||
slider.doMath();
|
||||
|
||||
// INIT
|
||||
slider.setup( 'init' );
|
||||
|
||||
// CONTROLNAV
|
||||
methods.controlNav.setup();
|
||||
|
||||
// DIRECTIONNAV
|
||||
methods.directionNav.setup();
|
||||
|
||||
// KEYBOARD
|
||||
if ( $( slider.containerSelector ).length === 1 ) {
|
||||
$( document ).bind( 'keyup', function( event ) {
|
||||
var keycode = event.keyCode;
|
||||
if ( ! slider.animating && ( keycode === 39 || keycode === 37 ) ) {
|
||||
var target = ( keycode === 39 ) ? slider.getTarget( 'next' ) : ( keycode === 37 ) ? slider.getTarget( 'prev' ) : false;
|
||||
slider.featureAnimate( target );
|
||||
}
|
||||
} );
|
||||
}
|
||||
|
||||
// TOUCH
|
||||
if ( touch )
|
||||
methods.touch();
|
||||
|
||||
$( window ).bind( 'resize orientationchange focus', methods.resize );
|
||||
|
||||
slider.find( 'img' ).attr( 'draggable', 'false' );
|
||||
},
|
||||
|
||||
controlNav: {
|
||||
setup: function() {
|
||||
methods.controlNav.setupPaging();
|
||||
},
|
||||
setupPaging: function() {
|
||||
var type = 'control-paging',
|
||||
j = 1,
|
||||
item,
|
||||
slide;
|
||||
|
||||
slider.controlNavScaffold = $( '<ol class="' + namespace + 'control-nav ' + namespace + type + '"></ol>' );
|
||||
|
||||
if ( slider.pagingCount > 1 ) {
|
||||
for ( var i = 0; i < slider.pagingCount; i++ ) {
|
||||
slide = slider.slides.eq( i );
|
||||
item = '<a>' + j + '</a>';
|
||||
slider.controlNavScaffold.append( '<li>' + item + '</li>' );
|
||||
j++;
|
||||
}
|
||||
}
|
||||
|
||||
// CONTROLSCONTAINER
|
||||
( slider.controlsContainer ) ? $( slider.controlsContainer ).append( slider.controlNavScaffold ) : slider.append( slider.controlNavScaffold );
|
||||
methods.controlNav.set();
|
||||
|
||||
methods.controlNav.active();
|
||||
|
||||
slider.controlNavScaffold.delegate( 'a, img', eventType, function( event ) {
|
||||
event.preventDefault();
|
||||
|
||||
if ( watchedEvent === '' || watchedEvent === event.type ) {
|
||||
var $this = $( this ),
|
||||
target = slider.controlNav.index( $this );
|
||||
|
||||
if ( ! $this.hasClass( namespace + 'active' ) ) {
|
||||
slider.direction = ( target > slider.currentSlide ) ? 'next' : 'prev';
|
||||
slider.featureAnimate( target );
|
||||
}
|
||||
}
|
||||
|
||||
// Set up flags to prevent event duplication.
|
||||
if ( watchedEvent === '' )
|
||||
watchedEvent = event.type;
|
||||
|
||||
methods.setToClearWatchedEvent();
|
||||
} );
|
||||
},
|
||||
set: function() {
|
||||
var selector = 'a';
|
||||
slider.controlNav = $( '.' + namespace + 'control-nav li ' + selector, ( slider.controlsContainer ) ? slider.controlsContainer : slider );
|
||||
},
|
||||
active: function() {
|
||||
slider.controlNav.removeClass( namespace + 'active' ).eq( slider.animatingTo ).addClass( namespace + 'active' );
|
||||
},
|
||||
update: function( action, pos ) {
|
||||
if ( slider.pagingCount > 1 && action === 'add' ) {
|
||||
slider.controlNavScaffold.append( $( '<li><a>' + slider.count + '</a></li>' ) );
|
||||
} else if ( slider.pagingCount === 1 ) {
|
||||
slider.controlNavScaffold.find( 'li' ).remove();
|
||||
} else {
|
||||
slider.controlNav.eq( pos ).closest( 'li' ).remove();
|
||||
}
|
||||
methods.controlNav.set();
|
||||
( slider.pagingCount > 1 && slider.pagingCount !== slider.controlNav.length ) ? slider.update( pos, action ) : methods.controlNav.active();
|
||||
}
|
||||
},
|
||||
|
||||
directionNav: {
|
||||
setup: function() {
|
||||
var directionNavScaffold = $( '<ul class="' + namespace + 'direction-nav"><li><a class="' + namespace + 'prev" href="#">' + slider.vars.prevText + '</a></li><li><a class="' + namespace + 'next" href="#">' + slider.vars.nextText + '</a></li></ul>' );
|
||||
|
||||
// CONTROLSCONTAINER
|
||||
if ( slider.controlsContainer ) {
|
||||
$( slider.controlsContainer ).append( directionNavScaffold );
|
||||
slider.directionNav = $( '.' + namespace + 'direction-nav li a', slider.controlsContainer );
|
||||
} else {
|
||||
slider.append( directionNavScaffold );
|
||||
slider.directionNav = $( '.' + namespace + 'direction-nav li a', slider );
|
||||
}
|
||||
|
||||
methods.directionNav.update();
|
||||
|
||||
slider.directionNav.bind( eventType, function( event ) {
|
||||
event.preventDefault();
|
||||
var target;
|
||||
|
||||
if ( watchedEvent === '' || watchedEvent === event.type ) {
|
||||
target = ( $( this ).hasClass( namespace + 'next' ) ) ? slider.getTarget( 'next' ) : slider.getTarget( 'prev' );
|
||||
slider.featureAnimate( target );
|
||||
}
|
||||
|
||||
// Set up flags to prevent event duplication.
|
||||
if ( watchedEvent === '' )
|
||||
watchedEvent = event.type;
|
||||
|
||||
methods.setToClearWatchedEvent();
|
||||
} );
|
||||
},
|
||||
update: function() {
|
||||
var disabledClass = namespace + 'disabled';
|
||||
if ( slider.pagingCount === 1 ) {
|
||||
slider.directionNav.addClass( disabledClass ).attr( 'tabindex', '-1' );
|
||||
} else {
|
||||
slider.directionNav.removeClass( disabledClass ).removeAttr( 'tabindex' );
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
touch: function() {
|
||||
var startX,
|
||||
startY,
|
||||
offset,
|
||||
cwidth,
|
||||
dx,
|
||||
startT,
|
||||
scrolling = false,
|
||||
localX = 0,
|
||||
localY = 0,
|
||||
accDx = 0;
|
||||
|
||||
if ( ! msGesture ) {
|
||||
el.addEventListener( 'touchstart', onTouchStart, false );
|
||||
|
||||
function onTouchStart( e ) {
|
||||
if ( slider.animating ) {
|
||||
e.preventDefault();
|
||||
} else if ( ( window.navigator.msPointerEnabled ) || e.touches.length === 1 ) {
|
||||
cwidth = slider.w;
|
||||
startT = Number( new Date() );
|
||||
|
||||
// Local vars for X and Y points.
|
||||
localX = e.touches[0].pageX;
|
||||
localY = e.touches[0].pageY;
|
||||
|
||||
offset = ( slider.animatingTo === slider.last ) ? 0 :
|
||||
( slider.currentSlide === slider.last ) ? slider.limit : ( slider.currentSlide + slider.cloneOffset ) * cwidth;
|
||||
startX = localX;
|
||||
startY = localY;
|
||||
|
||||
el.addEventListener( 'touchmove', onTouchMove, false );
|
||||
el.addEventListener( 'touchend', onTouchEnd, false );
|
||||
}
|
||||
}
|
||||
|
||||
function onTouchMove( e ) {
|
||||
// Local vars for X and Y points.
|
||||
localX = e.touches[0].pageX;
|
||||
localY = e.touches[0].pageY;
|
||||
|
||||
dx = startX - localX;
|
||||
scrolling = Math.abs( dx ) < Math.abs( localY - startY );
|
||||
|
||||
var fxms = 500;
|
||||
|
||||
if ( ! scrolling || Number( new Date() ) - startT > fxms ) {
|
||||
e.preventDefault();
|
||||
if ( slider.transitions ) {
|
||||
slider.setProps( offset + dx, 'setTouch' );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function onTouchEnd( e ) {
|
||||
// Finish the touch by undoing the touch session.
|
||||
el.removeEventListener( 'touchmove', onTouchMove, false );
|
||||
|
||||
if ( slider.animatingTo === slider.currentSlide && ! scrolling && ! ( dx === null ) ) {
|
||||
var updateDx = dx,
|
||||
target = ( updateDx > 0 ) ? slider.getTarget( 'next' ) : slider.getTarget( 'prev' );
|
||||
|
||||
slider.featureAnimate( target );
|
||||
}
|
||||
el.removeEventListener( 'touchend', onTouchEnd, false );
|
||||
|
||||
startX = null;
|
||||
startY = null;
|
||||
dx = null;
|
||||
offset = null;
|
||||
}
|
||||
} else {
|
||||
el.style.msTouchAction = 'none';
|
||||
el._gesture = new MSGesture();
|
||||
el._gesture.target = el;
|
||||
el.addEventListener( 'MSPointerDown', onMSPointerDown, false );
|
||||
el._slider = slider;
|
||||
el.addEventListener( 'MSGestureChange', onMSGestureChange, false );
|
||||
el.addEventListener( 'MSGestureEnd', onMSGestureEnd, false );
|
||||
|
||||
function onMSPointerDown( e ) {
|
||||
e.stopPropagation();
|
||||
if ( slider.animating ) {
|
||||
e.preventDefault();
|
||||
} else {
|
||||
el._gesture.addPointer( e.pointerId );
|
||||
accDx = 0;
|
||||
cwidth = slider.w;
|
||||
startT = Number( new Date() );
|
||||
offset = ( slider.animatingTo === slider.last ) ? 0 : ( slider.currentSlide === slider.last ) ? slider.limit : ( slider.currentSlide + slider.cloneOffset ) * cwidth;
|
||||
}
|
||||
}
|
||||
|
||||
function onMSGestureChange( e ) {
|
||||
e.stopPropagation();
|
||||
var slider = e.target._slider;
|
||||
if ( ! slider )
|
||||
return;
|
||||
|
||||
var transX = -e.translationX,
|
||||
transY = -e.translationY;
|
||||
|
||||
// Accumulate translations.
|
||||
accDx = accDx + transX;
|
||||
dx = accDx;
|
||||
scrolling = Math.abs( accDx ) < Math.abs( -transY );
|
||||
|
||||
if ( e.detail === e.MSGESTURE_FLAG_INERTIA ) {
|
||||
setImmediate( function () {
|
||||
el._gesture.stop();
|
||||
} );
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
if ( ! scrolling || Number( new Date() ) - startT > 500 ) {
|
||||
e.preventDefault();
|
||||
if ( slider.transitions ) {
|
||||
slider.setProps( offset + dx, 'setTouch' );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function onMSGestureEnd( e ) {
|
||||
e.stopPropagation();
|
||||
var slider = e.target._slider;
|
||||
if ( ! slider )
|
||||
return;
|
||||
|
||||
if ( slider.animatingTo === slider.currentSlide && ! scrolling && ! ( dx === null ) ) {
|
||||
var updateDx = dx,
|
||||
target = ( updateDx > 0 ) ? slider.getTarget( 'next' ) : slider.getTarget( 'prev' );
|
||||
|
||||
slider.featureAnimate( target );
|
||||
}
|
||||
|
||||
startX = null;
|
||||
startY = null;
|
||||
dx = null;
|
||||
offset = null;
|
||||
accDx = 0;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
resize: function() {
|
||||
if ( ! slider.animating && slider.is( ':visible' ) ) {
|
||||
slider.doMath();
|
||||
|
||||
// SMOOTH HEIGHT
|
||||
methods.smoothHeight();
|
||||
slider.newSlides.width( slider.computedW );
|
||||
slider.setProps( slider.computedW, 'setTotal' );
|
||||
}
|
||||
},
|
||||
|
||||
smoothHeight: function( dur ) {
|
||||
var $obj = slider.viewport;
|
||||
( dur ) ? $obj.animate( { 'height': slider.slides.eq( slider.animatingTo ).height() }, dur ) : $obj.height( slider.slides.eq( slider.animatingTo ).height() );
|
||||
},
|
||||
|
||||
setToClearWatchedEvent: function() {
|
||||
clearTimeout( watchedEventClearTimer );
|
||||
watchedEventClearTimer = setTimeout( function() {
|
||||
watchedEvent = '';
|
||||
}, 3000 );
|
||||
}
|
||||
};
|
||||
|
||||
// Public methods.
|
||||
slider.featureAnimate = function( target ) {
|
||||
if ( target !== slider.currentSlide )
|
||||
slider.direction = ( target > slider.currentSlide ) ? 'next' : 'prev';
|
||||
|
||||
if ( ! slider.animating && slider.is( ':visible' ) ) {
|
||||
slider.animating = true;
|
||||
slider.animatingTo = target;
|
||||
|
||||
// CONTROLNAV
|
||||
methods.controlNav.active();
|
||||
|
||||
slider.slides.removeClass( namespace + 'active-slide' ).eq( target ).addClass( namespace + 'active-slide' );
|
||||
|
||||
slider.atEnd = target === 0 || target === slider.last;
|
||||
|
||||
// DIRECTIONNAV
|
||||
methods.directionNav.update();
|
||||
|
||||
var dimension = slider.computedW,
|
||||
margin, slideString, calcNext;
|
||||
|
||||
if ( slider.currentSlide === 0 && target === slider.count - 1 && slider.direction !== 'next' ) {
|
||||
slideString = 0;
|
||||
} else if ( slider.currentSlide === slider.last && target === 0 && slider.direction !== 'prev' ) {
|
||||
slideString = ( slider.count + 1 ) * dimension;
|
||||
} else {
|
||||
slideString = ( target + slider.cloneOffset ) * dimension;
|
||||
}
|
||||
slider.setProps( slideString, '', slider.vars.animationSpeed );
|
||||
if ( slider.transitions ) {
|
||||
if ( ! slider.atEnd ) {
|
||||
slider.animating = false;
|
||||
slider.currentSlide = slider.animatingTo;
|
||||
}
|
||||
slider.container.unbind( 'webkitTransitionEnd transitionend' );
|
||||
slider.container.bind( 'webkitTransitionEnd transitionend', function() {
|
||||
slider.wrapup( dimension );
|
||||
} );
|
||||
} else {
|
||||
slider.container.animate( slider.args, slider.vars.animationSpeed, 'swing', function() {
|
||||
slider.wrapup( dimension );
|
||||
} );
|
||||
}
|
||||
|
||||
// SMOOTH HEIGHT
|
||||
methods.smoothHeight( slider.vars.animationSpeed );
|
||||
}
|
||||
};
|
||||
|
||||
slider.wrapup = function( dimension ) {
|
||||
if ( slider.currentSlide === 0 && slider.animatingTo === slider.last ) {
|
||||
slider.setProps( dimension, 'jumpEnd' );
|
||||
} else if ( slider.currentSlide === slider.last && slider.animatingTo === 0 ) {
|
||||
slider.setProps( dimension, 'jumpStart' );
|
||||
}
|
||||
slider.animating = false;
|
||||
slider.currentSlide = slider.animatingTo;
|
||||
};
|
||||
|
||||
slider.getTarget = function( dir ) {
|
||||
slider.direction = dir;
|
||||
if ( dir === 'next' ) {
|
||||
return ( slider.currentSlide === slider.last ) ? 0 : slider.currentSlide + 1;
|
||||
} else {
|
||||
return ( slider.currentSlide === 0 ) ? slider.last : slider.currentSlide - 1;
|
||||
}
|
||||
};
|
||||
|
||||
slider.setProps = function( pos, special, dur ) {
|
||||
var target = ( function() {
|
||||
var posCheck = ( pos ) ? pos : slider.itemW * slider.animatingTo,
|
||||
posCalc = ( function() {
|
||||
switch ( special ) {
|
||||
case 'setTotal': return ( slider.currentSlide + slider.cloneOffset ) * pos;
|
||||
case 'setTouch': return pos;
|
||||
case 'jumpEnd': return slider.count * pos;
|
||||
case 'jumpStart': return pos;
|
||||
default: return pos;
|
||||
}
|
||||
}() );
|
||||
|
||||
return ( posCalc * -1 ) + 'px';
|
||||
}() );
|
||||
|
||||
if ( slider.transitions ) {
|
||||
target = 'translate3d(' + target + ',0,0 )';
|
||||
dur = ( dur !== undefined ) ? ( dur / 1000 ) + 's' : '0s';
|
||||
slider.container.css( '-' + slider.pfx + '-transition-duration', dur );
|
||||
}
|
||||
|
||||
slider.args[slider.prop] = target;
|
||||
if ( slider.transitions || dur === undefined )
|
||||
slider.container.css( slider.args );
|
||||
};
|
||||
|
||||
slider.setup = function( type ) {
|
||||
var sliderOffset, arr;
|
||||
|
||||
if ( type === 'init' ) {
|
||||
slider.viewport = $( '<div class="' + namespace + 'viewport"></div>' ).css( { 'overflow': 'hidden', 'position': 'relative' } ).appendTo( slider ).append( slider.container );
|
||||
slider.cloneCount = 0;
|
||||
slider.cloneOffset = 0;
|
||||
}
|
||||
slider.cloneCount = 2;
|
||||
slider.cloneOffset = 1;
|
||||
// Clear out old clones.
|
||||
if ( type !== 'init' )
|
||||
slider.container.find( '.clone' ).remove();
|
||||
|
||||
slider.container.append( slider.slides.first().clone().addClass( 'clone' ).attr( 'aria-hidden', 'true' ) ).prepend( slider.slides.last().clone().addClass( 'clone' ).attr( 'aria-hidden', 'true' ) );
|
||||
slider.newSlides = $( slider.vars.selector, slider );
|
||||
|
||||
sliderOffset = slider.currentSlide + slider.cloneOffset;
|
||||
slider.container.width( ( slider.count + slider.cloneCount ) * 200 + '%' );
|
||||
slider.setProps( sliderOffset * slider.computedW, 'init' );
|
||||
setTimeout( function() {
|
||||
slider.doMath();
|
||||
slider.newSlides.css( { 'width': slider.computedW, 'float': 'left', 'display': 'block' } );
|
||||
// SMOOTH HEIGHT
|
||||
methods.smoothHeight();
|
||||
}, ( type === 'init' ) ? 100 : 0 );
|
||||
|
||||
slider.slides.removeClass( namespace + 'active-slide' ).eq( slider.currentSlide ).addClass( namespace + 'active-slide' );
|
||||
};
|
||||
|
||||
slider.doMath = function() {
|
||||
var slide = slider.slides.first();
|
||||
|
||||
slider.w = ( slider.viewport===undefined ) ? slider.width() : slider.viewport.width();
|
||||
slider.h = slide.height();
|
||||
slider.boxPadding = slide.outerWidth() - slide.width();
|
||||
|
||||
slider.itemW = slider.w;
|
||||
slider.pagingCount = slider.count;
|
||||
slider.last = slider.count - 1;
|
||||
slider.computedW = slider.itemW - slider.boxPadding;
|
||||
};
|
||||
|
||||
slider.update = function( pos, action ) {
|
||||
slider.doMath();
|
||||
|
||||
// Update currentSlide and slider.animatingTo if necessary.
|
||||
if ( pos < slider.currentSlide ) {
|
||||
slider.currentSlide += 1;
|
||||
} else if ( pos <= slider.currentSlide && pos !== 0 ) {
|
||||
slider.currentSlide -= 1;
|
||||
}
|
||||
slider.animatingTo = slider.currentSlide;
|
||||
|
||||
// Update controlNav.
|
||||
if ( action === 'add' || slider.pagingCount > slider.controlNav.length ) {
|
||||
methods.controlNav.update( 'add' );
|
||||
} else if ( action === 'remove' || slider.pagingCount < slider.controlNav.length ) {
|
||||
if ( slider.currentSlide > slider.last ) {
|
||||
slider.currentSlide -= 1;
|
||||
slider.animatingTo -= 1;
|
||||
}
|
||||
methods.controlNav.update( 'remove', slider.last );
|
||||
}
|
||||
// Update directionNav.
|
||||
methods.directionNav.update();
|
||||
};
|
||||
|
||||
// FeaturedSlider: initialize.
|
||||
methods.init();
|
||||
};
|
||||
|
||||
// Ensure the slider isn't focused if the window loses focus.
|
||||
$( window ).blur( function ( e ) {
|
||||
focused = false;
|
||||
} ).focus( function ( e ) {
|
||||
focused = true;
|
||||
} );
|
||||
|
||||
// Default settings.
|
||||
$.featuredslider.defaults = {
|
||||
namespace: 'slider-', // String: prefix string attached to the class of every element generated by the plugin.
|
||||
selector: '.slides > li', // String: selector, must match a simple pattern.
|
||||
animationSpeed: 600, // Integer: Set the speed of animations, in milliseconds.
|
||||
controlsContainer: '', // jQuery Object/Selector: container navigation to append elements.
|
||||
|
||||
// Text labels: @todo allow translation
|
||||
prevText: 'Previous', // String: Set the text for the "previous" directionNav item.
|
||||
nextText: 'Next' // String: Set the text for the "next" directionNav item.
|
||||
};
|
||||
|
||||
// FeaturedSlider: plugin function.
|
||||
$.fn.featuredslider = function( options ) {
|
||||
if ( options === undefined )
|
||||
options = {};
|
||||
|
||||
if ( typeof options === 'object' ) {
|
||||
return this.each( function() {
|
||||
var $this = $( this ),
|
||||
selector = ( options.selector ) ? options.selector : '.slides > li',
|
||||
$slides = $this.find( selector );
|
||||
|
||||
if ( $slides.length === 1 || $slides.length === 0 ) {
|
||||
$slides.fadeIn( 400 );
|
||||
} else if ( $this.data( 'featuredslider' ) === undefined ) {
|
||||
new $.featuredslider( this, options );
|
||||
}
|
||||
} );
|
||||
}
|
||||
};
|
||||
} )( jQuery );
|
||||
@ -8,20 +8,18 @@
|
||||
*/
|
||||
?>
|
||||
<div id="secondary">
|
||||
<div id="secondary-top">
|
||||
<?php
|
||||
$description = get_bloginfo( 'description' );
|
||||
if ( ! empty ( $description ) ) :
|
||||
?>
|
||||
<h2 class="site-description"><?php echo esc_html( $description ); ?></h2>
|
||||
<?php endif; ?>
|
||||
<?php
|
||||
$description = get_bloginfo( 'description' );
|
||||
if ( ! empty ( $description ) ) :
|
||||
?>
|
||||
<h2 class="site-description"><?php echo esc_html( $description ); ?></h2>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ( has_nav_menu( 'secondary' ) ) : ?>
|
||||
<nav role="navigation" class="navigation site-navigation secondary-navigation">
|
||||
<?php wp_nav_menu( array( 'theme_location' => 'secondary' ) ); ?>
|
||||
</nav>
|
||||
<?php endif; ?>
|
||||
</div><!-- #secondary-top -->
|
||||
<?php if ( has_nav_menu( 'secondary' ) ) : ?>
|
||||
<nav role="navigation" class="navigation site-navigation secondary-navigation">
|
||||
<?php wp_nav_menu( array( 'theme_location' => 'secondary' ) ); ?>
|
||||
</nav>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>
|
||||
<div id="primary-sidebar" class="primary-sidebar widget-area" role="complementary">
|
||||
@ -29,6 +27,6 @@
|
||||
do_action( 'before_sidebar' );
|
||||
dynamic_sidebar( 'sidebar-1' );
|
||||
?>
|
||||
</div><!-- #secondary-bottom -->
|
||||
</div><!-- #primary-sidebar .primary-sidebar -->
|
||||
<?php endif; ?>
|
||||
</div><!-- #secondary -->
|
||||
|
||||
@ -556,12 +556,7 @@ img[class*="attachment-"],
|
||||
|
||||
img.size-full,
|
||||
img.size-large,
|
||||
img.wp-post-image {
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.attachment-featured-featured img,
|
||||
img.wp-post-image,
|
||||
.post-thumbnail img {
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
@ -708,6 +703,8 @@ img.wp-smiley {
|
||||
.footer-sidebar:after,
|
||||
.hentry:before,
|
||||
.hentry:after,
|
||||
.slider-direction-nav:before,
|
||||
.slider-direction-nav:after,
|
||||
[class*="content"]:before,
|
||||
[class*="content"]:after,
|
||||
[class*="site"]:before,
|
||||
@ -719,6 +716,7 @@ img.wp-smiley {
|
||||
.clear:after,
|
||||
.footer-sidebar:after,
|
||||
.hentry:after,
|
||||
.slider-direction-nav:after,
|
||||
[class*="content"]:after,
|
||||
[class*="site"]:after {
|
||||
clear: both;
|
||||
@ -732,6 +730,7 @@ img.wp-smiley {
|
||||
.contributor-posts-link:before,
|
||||
.menu-toggle:before,
|
||||
.search-toggle:before,
|
||||
.slider-direction-nav a:before,
|
||||
.widget_twentyfourteen_ephemera .widget-title:before {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
display: inline-block;
|
||||
@ -780,14 +779,14 @@ span + .edit-link:before,
|
||||
}
|
||||
|
||||
.site-header {
|
||||
background-color: #000;
|
||||
max-width: 1260px;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
z-index: 3;
|
||||
z-index: 4;
|
||||
}
|
||||
|
||||
.header-main {
|
||||
background-color: #000;
|
||||
min-height: 48px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
@ -812,7 +811,7 @@ span + .edit-link:before,
|
||||
cursor: pointer;
|
||||
float: right;
|
||||
height: 48px;
|
||||
margin-right: 38px;
|
||||
margin-right: 48px;
|
||||
text-align: center;
|
||||
width: 48px;
|
||||
}
|
||||
@ -845,10 +844,10 @@ span + .edit-link:before,
|
||||
.search-box .search-field {
|
||||
background-color: #fff;
|
||||
float: right;
|
||||
font-size: 13px;
|
||||
font-size: 16px;
|
||||
margin: 12px 10px;
|
||||
padding: 3px 2px 3px 6px;
|
||||
width: 240px;
|
||||
padding: 1px 2px 2px 6px;
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
|
||||
@ -929,7 +928,7 @@ span + .edit-link:before,
|
||||
.secondary-navigation {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
|
||||
font-size: 14px;
|
||||
margin: 48px 0 0;
|
||||
margin: 48px 0;
|
||||
}
|
||||
|
||||
.secondary-navigation a {
|
||||
@ -1006,7 +1005,7 @@ span + .edit-link:before,
|
||||
float: none;
|
||||
height: auto;
|
||||
margin: 0;
|
||||
min-height: 180px;
|
||||
min-height: 192px;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
z-index: 0;
|
||||
@ -1978,6 +1977,7 @@ a.post-thumbnail:hover {
|
||||
#secondary {
|
||||
background-color: #000;
|
||||
border-top: 1px solid #000;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
|
||||
clear: both;
|
||||
color: rgba(255, 255, 255, 0.55);
|
||||
font-size: 14px;
|
||||
@ -1998,6 +1998,9 @@ a.post-thumbnail:hover {
|
||||
.primary-sidebar {
|
||||
padding-top: 48px;
|
||||
}
|
||||
.secondary-navigation + .primary-sidebar {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.footer-sidebar a,
|
||||
.primary-sidebar a {
|
||||
@ -2079,7 +2082,7 @@ a.post-thumbnail:hover {
|
||||
.widget-area input[type="reset"],
|
||||
.widget-area input[type="submit"] {
|
||||
font-size: 11px;
|
||||
padding: 6px 24px;
|
||||
padding: 6px 15px;
|
||||
}
|
||||
|
||||
.widget-area input[type="email"],
|
||||
@ -2446,7 +2449,6 @@ a.post-thumbnail:hover {
|
||||
}
|
||||
|
||||
.footer-sidebar {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
|
||||
padding-top: 48px;
|
||||
}
|
||||
|
||||
@ -2455,6 +2457,10 @@ a.post-thumbnail:hover {
|
||||
padding: 15px 10px;
|
||||
}
|
||||
|
||||
#supplementary + .site-info {
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
.site-info a {
|
||||
color: rgba(255, 255, 255, 0.75);
|
||||
}
|
||||
@ -2474,35 +2480,47 @@ a.post-thumbnail:hover {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.featured-content-inner {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.featured-content .hentry {
|
||||
color: #fff;
|
||||
margin: 0;
|
||||
max-width: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.attachment-featured-featured {
|
||||
background-color: #000;
|
||||
.featured-content .post-thumbnail,
|
||||
.featured-content .post-thumbnail:hover {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.featured-content .post-thumbnail {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
min-height: 0;
|
||||
position: relative;
|
||||
padding-top: 55.357142857%;
|
||||
}
|
||||
|
||||
.attachment-featured-featured:hover img {
|
||||
opacity: 0.85;
|
||||
.featured-content .post-thumbnail img {
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.featured-content .entry-wrap {
|
||||
.featured-content .entry-header {
|
||||
background-color: #000;
|
||||
border-color: #000;
|
||||
border-style: solid;
|
||||
border-width: 12px 10px;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
min-height: 96px;
|
||||
overflow: hidden;
|
||||
padding: 24px 10px;
|
||||
}
|
||||
|
||||
.featured-content a {
|
||||
@ -2533,20 +2551,132 @@ a.post-thumbnail:hover {
|
||||
}
|
||||
|
||||
|
||||
/* Slider */
|
||||
|
||||
.slider .featured-content .hentry {
|
||||
display: none;
|
||||
-webkit-backface-visibility: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.slider .featured-content .post-thumbnail {
|
||||
padding-top: 55.49132947%;
|
||||
}
|
||||
|
||||
.slider-control-paging {
|
||||
background-color: #000;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
float: left;
|
||||
list-style: none;
|
||||
margin: -24px 0 0 0;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.slider-control-paging li {
|
||||
float: left;
|
||||
margin: 2px 4px 2px 0;
|
||||
}
|
||||
|
||||
.slider-control-paging li:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.slider-control-paging a {
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
height: 44px;
|
||||
position: relative;
|
||||
text-indent: -999em;
|
||||
width: 44px;
|
||||
}
|
||||
|
||||
.slider-control-paging a:before {
|
||||
background-color: #4d4d4d;
|
||||
content: "";
|
||||
height: 12px;
|
||||
left: 10px;
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
.slider-control-paging a:hover:before {
|
||||
background-color: #24890d;
|
||||
}
|
||||
|
||||
.slider-control-paging a.slider-active:before {
|
||||
background-color: #41a62a;
|
||||
}
|
||||
|
||||
.slider-direction-nav {
|
||||
clear: both;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.slider-direction-nav li {
|
||||
border-color: #fff;
|
||||
border-style: solid;
|
||||
border-width: 2px 1px 0 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
float: left;
|
||||
text-align: center;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.slider-direction-nav li:last-child {
|
||||
border-width: 2px 0 0 1px;
|
||||
}
|
||||
|
||||
.slider-direction-nav a {
|
||||
background-color: #000;
|
||||
display: block;
|
||||
font-size: 0;
|
||||
height: 46px;
|
||||
}
|
||||
|
||||
.slider-direction-nav a:hover {
|
||||
background-color: #24890d;
|
||||
}
|
||||
|
||||
.slider-direction-nav a:before {
|
||||
content: "\f430";
|
||||
color: #fff;
|
||||
font-size: 32px;
|
||||
line-height: 46px;
|
||||
}
|
||||
|
||||
.slider-direction-nav a.slider-next:before {
|
||||
content: "\f429";
|
||||
}
|
||||
|
||||
.slider-direction-nav .slider-disabled {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* 10.0 Media Queries
|
||||
* -----------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
@media screen and (max-width: 400px) {
|
||||
.list-view .post-thumbnail {
|
||||
.list-view .site-content .post-thumbnail {
|
||||
background: none;
|
||||
min-height: 0;
|
||||
width: auto;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.list-view .post-thumbnail img {
|
||||
.list-view .site-content .post-thumbnail img {
|
||||
float: left;
|
||||
margin: 0 10px 3px 0;
|
||||
width: 84px;
|
||||
@ -2745,6 +2875,10 @@ a.post-thumbnail:hover {
|
||||
}
|
||||
|
||||
@media screen and (min-width: 673px) {
|
||||
.header-main {
|
||||
padding: 0 0 0 30px;
|
||||
}
|
||||
|
||||
.content-area {
|
||||
float: left;
|
||||
padding-top: 36px;
|
||||
@ -2795,6 +2929,11 @@ a.post-thumbnail:hover {
|
||||
padding-left: 30px;
|
||||
}
|
||||
|
||||
#secondary,
|
||||
#supplementary {
|
||||
padding: 0 30px;
|
||||
}
|
||||
|
||||
.content-sidebar {
|
||||
border: 0;
|
||||
float: right;
|
||||
@ -2803,29 +2942,74 @@ a.post-thumbnail:hover {
|
||||
width: 33.33333333%;
|
||||
}
|
||||
|
||||
.featured-content .hentry {
|
||||
.grid .featured-content .hentry {
|
||||
float: left;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.featured-content .hentry:nth-child( 2n+1 ) {
|
||||
.grid .featured-content .hentry:nth-child( 2n+1 ) {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.featured-content .entry-wrap {
|
||||
.grid .featured-content .entry-header {
|
||||
border-color: #000;
|
||||
border-style: solid;
|
||||
border-width: 12px 10px;
|
||||
height: 96px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.attachment-featured-featured {
|
||||
height: 186px;
|
||||
.slider .featured-content .entry-title {
|
||||
font-size: 22px;
|
||||
line-height: 1.0909090909;
|
||||
}
|
||||
|
||||
.slider .featured-content .entry-header {
|
||||
bottom: 0;
|
||||
min-height: inherit;
|
||||
padding: 24px 30px 48px;
|
||||
position: absolute;
|
||||
width: 50%;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.slider-control-paging {
|
||||
background: transparent;
|
||||
margin-top: -48px;
|
||||
padding-left: 20px;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.slider-direction-nav {
|
||||
clear: none;
|
||||
float: right;
|
||||
margin-top: -48px;
|
||||
width: 98px;
|
||||
}
|
||||
|
||||
.slider-direction-nav li {
|
||||
border: none;
|
||||
padding: 0 1px; 0 0;
|
||||
}
|
||||
|
||||
.slider-direction-nav li:last-child {
|
||||
padding: 0 0 0 1px;
|
||||
}
|
||||
|
||||
.slider-direction-nav a {
|
||||
height: 48px;
|
||||
}
|
||||
|
||||
.slider-direction-nav a:before {
|
||||
line-height: 48px;
|
||||
}
|
||||
|
||||
.site-info {
|
||||
padding: 15px 30px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 782px) {
|
||||
.header-main {
|
||||
padding: 0 0 0 30px;
|
||||
}
|
||||
|
||||
.search-toggle {
|
||||
margin-right: 0;
|
||||
}
|
||||
@ -2945,10 +3129,6 @@ a.post-thumbnail:hover {
|
||||
.primary-navigation li .current-menu-ancestor > a {
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
.attachment-featured-featured {
|
||||
height: 213px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 810px) {
|
||||
@ -2992,10 +3172,6 @@ a.post-thumbnail:hover {
|
||||
.contributor-summary {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.attachment-featured-featured {
|
||||
height: 224px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 870px) {
|
||||
@ -3057,10 +3233,6 @@ a.post-thumbnail:hover {
|
||||
.featured-content {
|
||||
margin-bottom: -24px;
|
||||
}
|
||||
|
||||
.attachment-featured-featured {
|
||||
height: 241px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1008px) {
|
||||
@ -3101,14 +3273,13 @@ a.post-thumbnail:hover {
|
||||
|
||||
#secondary {
|
||||
background-color: transparent;
|
||||
border-top: 0;
|
||||
border: 0;
|
||||
clear: none;
|
||||
float: left;
|
||||
font-size: 11px;
|
||||
line-height: 1.6363636363;
|
||||
margin: 0 0 0 -100%;
|
||||
min-height: 100vh;
|
||||
padding: 0 30px;
|
||||
width: 122px;
|
||||
}
|
||||
|
||||
@ -3145,7 +3316,7 @@ a.post-thumbnail:hover {
|
||||
.secondary-navigation {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
|
||||
font-size: 11px;
|
||||
margin: 0 0 48px;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.secondary-navigation ul,
|
||||
@ -3203,10 +3374,6 @@ a.post-thumbnail:hover {
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
.site-info {
|
||||
padding: 15px 30px;
|
||||
}
|
||||
|
||||
.front-page-content-wrapper {
|
||||
float: left;
|
||||
}
|
||||
@ -3215,25 +3382,21 @@ a.post-thumbnail:hover {
|
||||
padding-left: 182px;
|
||||
}
|
||||
|
||||
.featured-content .hentry {
|
||||
.grid .featured-content .hentry {
|
||||
width: 33.3333333%;
|
||||
}
|
||||
|
||||
.featured-content .hentry:nth-child( 2n+1 ) {
|
||||
.grid .featured-content .hentry:nth-child( 2n+1 ) {
|
||||
clear: none;
|
||||
}
|
||||
|
||||
.featured-content .hentry:nth-child( 3n+1 ) {
|
||||
.grid .featured-content .hentry:nth-child( 3n+1 ) {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.featured-content .entry-wrap {
|
||||
.grid .featured-content .entry-header {
|
||||
height: 120px;
|
||||
}
|
||||
|
||||
.attachment-featured-featured {
|
||||
height: 152px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1040px) {
|
||||
@ -3273,10 +3436,6 @@ a.post-thumbnail:hover {
|
||||
padding-right: 30px;
|
||||
padding-left: 30px;
|
||||
}
|
||||
|
||||
.attachment-featured-featured {
|
||||
height: 158px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1080px) {
|
||||
@ -3301,6 +3460,33 @@ a.post-thumbnail:hover {
|
||||
.secondary-navigation ul ul {
|
||||
left: 162px;
|
||||
}
|
||||
|
||||
.slider .featured-content .entry-title {
|
||||
font-size: 33px;
|
||||
}
|
||||
|
||||
.slider .featured-content .entry-header,
|
||||
.slider-control-paging {
|
||||
width: 534px;
|
||||
}
|
||||
|
||||
.slider-control-paging {
|
||||
padding-left: 24px;
|
||||
}
|
||||
|
||||
.slider-control-paging li {
|
||||
margin: 12px 12px 12px 0
|
||||
}
|
||||
|
||||
.slider-control-paging a {
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
}
|
||||
|
||||
.slider-control-paging a:before {
|
||||
left: 6px;
|
||||
top: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1110px) {
|
||||
@ -3317,10 +3503,6 @@ a.post-thumbnail:hover {
|
||||
padding-right: 30px;
|
||||
padding-left: 30px;
|
||||
}
|
||||
|
||||
.attachment-featured-featured {
|
||||
height: 164px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1218px) {
|
||||
@ -3349,10 +3531,6 @@ a.post-thumbnail:hover {
|
||||
.full-width .site-content footer.entry-meta {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.attachment-featured-featured {
|
||||
height: 184px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1260px) {
|
||||
@ -3369,8 +3547,4 @@ a.post-thumbnail:hover {
|
||||
.site-content blockquote.alignright {
|
||||
margin-right: -18%;
|
||||
}
|
||||
|
||||
.attachment-featured-featured {
|
||||
height: 192px;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user