Dalston: Add a custom Block Style for the Cover Block.

This commit is contained in:
Allan Cole 2019-09-19 13:30:19 -04:00
parent ead5288d82
commit d881ae5594
4 changed files with 50 additions and 0 deletions

View file

@ -0,0 +1,15 @@
.wp-block-cover.is-style-hover-reveal.has-background-dim:before {
opacity: 0;
}
.wp-block-cover.is-style-hover-reveal.wp-block-cover__inner-container {
opacity: 0;
}
.wp-block-cover.is-style-hover-reveal:hover .wp-block-cover__inner-container {
opacity: 1;
}
.wp-block-cover.is-style-hover-reveal.has-background-dim:hover:before {
opacity: 1;
}

View file

@ -0,0 +1,6 @@
( function( blocks ) {
blocks.registerBlockStyle( 'core/cover', {
name: 'hover-reveal',
label: 'Hover Reveal'
} );
}( window.wp.blocks ) );

View file

@ -174,3 +174,19 @@ function dalston_editor_styles() {
wp_enqueue_style( 'dalston-editor-fonts', dalston_fonts_url(), array(), null );
}
add_action( 'enqueue_block_editor_assets', 'dalston_editor_styles' );
/**
* Enqueue Custom Cover Block Styles and Scripts
*/
function dalston_block_extends() {
wp_enqueue_script( 'dalston-extend-cover-block',
get_stylesheet_directory_uri() . '/block-extends/extend-cover-block.js',
array( 'wp-blocks' )
);
wp_enqueue_style( 'dalston-extend-cover-block-style',
get_stylesheet_directory_uri() . '/block-extends/extend-cover-block.css'
);
}
add_action( 'enqueue_block_assets', 'dalston_block_extends' );

View file

@ -2381,6 +2381,11 @@ table th,
z-index: 1;
}
.main-navigation > div > ul li:hover, .main-navigation > div > ul li[focus-within] {
cursor: pointer;
z-index: 99999;
}
.main-navigation > div > ul li:hover, .main-navigation > div > ul li:focus-within {
cursor: pointer;
z-index: 99999;
@ -2393,6 +2398,14 @@ table th,
/* Submenu display */
}
.main-navigation > div > ul li:hover > ul,
.main-navigation > div > ul li[focus-within] > ul,
.main-navigation > div > ul li ul:hover,
.main-navigation > div > ul li ul:focus {
visibility: visible;
opacity: 1;
display: block;
}
.main-navigation > div > ul li:hover > ul,
.main-navigation > div > ul li:focus-within > ul,
.main-navigation > div > ul li ul:hover,
.main-navigation > div > ul li ul:focus {