public function add_custom_css() { $media_query = esc_attr( $this->extras_config['media_query_width'] ); $extra = $this->extras_config['css']; $css = sprintf( ' /* Genesis+AMP responsive menu styles. --------------------------------------------- */ @media only screen and (min-width: %1$s) { .menu-item.genesis-amp-combined { display: none } } @media only screen and (max-width: %1$s) { .header-menu .genesis-responsive-menu, .genesis-responsive-menu { display: block; position: absolute; left: -9999px; opacity: 0; -webkit-transform: scaleY(0); -moz-transform: scaleY(0); -ms-transform: scaleY(0); -o-transform: scaleY(0); transform: scaleY(0); transform-origin: top; -webkit-transition: transform 0.2s ease; -moz-transition: transform 0.2s ease; o-transition: transform 0.2s ease; transition: transform 0.2s ease; } .genesis-nav-menu.responsive-menu.toggled-on, .genesis-responsive-menu.toggled-on { opacity: 1; position: relative; left: auto; -webkit-transform: scaleY(1); -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1); } .genesis-responsive-menu.toggled-on .menu-item .sub-menu, .genesis-responsive-menu.toggled-on .menu-item:hover > .sub-menu { display: none; } .genesis-responsive-menu.toggled-on .sub-menu-toggle.toggled-on + .sub-menu { display: block; width: 100%%; -webkit-transform: scaleY(1); -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1); } %2$s }', $media_query, $extra ); /** * Filter the CSS output. * * @since 3.1.1 * * @param string $css The default CSS output. * @param string $media_query The media query set in theme config. * @param string $extra The extra CSS set in theme config. */ $css = apply_filters( 'genesis_amp_menu_css', $css, $media_query, $extra ); wp_add_inline_style( genesis_get_theme_handle(), $css ); }