Add new icon, text, and style to splash notice #1470
Conversation
| <div class="amp-welcome-notice notice notice-info is-dismissible" id="<?php echo esc_attr( $notice_id ); ?>"> | ||
| <div class="notice-dismiss"></div> | ||
| <div class="amp-welcome-icon-holder"> | ||
| <span class="amp-welcome-icon"></span> |
There was a problem hiding this comment.
It didn't work at first, I had to change the viewBox on the SVG since there was a bunch of whitespace around it. So I ended up leaving it like this.. switching to a an img now.
| <h1><?php esc_html_e( 'Welcome to AMP for WordPress', 'amp' ); ?></h1> | ||
| <h3><?php esc_html_e( 'Bring the speed and features of the open source AMP project to your site, complete with the tools to support content authoring and website development.', 'amp' ); ?></h3> | ||
| <h3><?php esc_html_e( 'From granular controls that help you create AMP content, to Core Gutenberg support, to a sanitizer that only shows visitors error-free pages, to a full error workflow for developers, this release enables rich, performant experiences for your WordPress site.', 'amp' ); ?></h3> | ||
| <a href="https://www.ampproject.org/docs/getting_started/" target="_blank" class="button button-primary">Learn More</a> |
There was a problem hiding this comment.
“Learn More” needs to be translatable.
|
|
||
| wp_enqueue_style( | ||
| 'amp-settings', | ||
| amp_get_asset_url( 'css/amp-settings.css' ), |
There was a problem hiding this comment.
Since all of this is only for the welcome notice, I think you might as well just put this into a style element right with the div.amp-welcome-notice element. Once the welcome notice is dismissed, there will not be any need to have this CSS anymore. Having a separate CSS file enqueued for this page seems a bit overkill.
There was a problem hiding this comment.
That's how I had it at first but I changed it before creating the PR thinking that maybe later on we might want to add more styles to the settings page in general. Right now you are right, it doesn't make sense to add another enqueue method and file.
| <div class="amp-welcome-notice notice notice-info is-dismissible" id="<?php echo esc_attr( $notice_id ); ?>"> | ||
| <div class="notice-dismiss"></div> | ||
| <div class="amp-welcome-icon-holder"> | ||
| <img class="amp-welcome-icon" src="<?php echo esc_url( amp_get_asset_url( 'images/amp-welcome-icon.svg' ) ); ?>" srcset="<?php echo esc_url( amp_get_asset_url( 'images/amp-welcome-icon.svg' ) ); ?>" /> |
There was a problem hiding this comment.
Leftover from a thought I had about adding a .png fallback. Thanks for catching this!
No description provided.