Changeset 37169
- Timestamp:
- 04/09/2016 06:22:18 AM (9 years ago)
- Location:
- trunk/src/wp-admin
- Files:
-
- 2 edited
Legend:
- Unmodified
- Added
- Removed
-
trunk/src/wp-admin/about.php
r36964 r37169 22 22 } 23 23 24 if ( current_user_can( 'customize' ) ) { 25 wp_enqueue_script( 'customize-loader' ); 26 } 27 24 28 $video_url = 'https://videopress.com/embed/J44FHXvg?hd=true'; 25 29 $locale = str_replace( '_', '-', get_locale() ); … … 40 44 <h1><?php printf( __( 'Welcome to WordPress %s' ), $display_version ); ?></h1> 41 45 42 <div class="about-text"><?php printf( __( 'Thank you for updating! WordPress %s makes your site more connected and responsive.' ), $display_version ); ?></div>46 <div class="about-text"><?php printf( __( 'Thank you for updating! WordPress %s streamlines your workflow, whether you’re writing or building your site.' ), $display_version ); ?></div> 43 47 <div class="wp-badge"><?php printf( __( 'Version %s' ), $display_version ); ?></div> 44 48 … … 49 53 </h2> 50 54 51 <div class="headline-feature feature-video"> 52 <iframe width="1050" height="591" src="<?php echo esc_url( $video_url ); ?>" frameborder="0" allowfullscreen></iframe> 53 <script src="https://videopress.com/videopress-iframe.js"></script> 55 <div class="headline-feature feature-video" style="background-color:#191E23;"> 56 <p>Video Here</p> 54 57 </div> 55 58 56 59 <hr> 57 60 58 <div class="headline-feature feature-section one-col"> 59 <h2><?php _e( 'Twenty Sixteen' ); ?></h2> 60 <div class="media-container"> 61 <img src="https://s.w.org/images/core/4.4/twenty-sixteen-white-fullsize-2x.png" alt="" srcset="https://s.w.org/images/core/4.4/twenty-sixteen-white-smartphone-1x.png 268w, https://s.w.org/images/core/4.4/twenty-sixteen-white-smartphone-2x.png 536w, https://s.w.org/images/core/4.4/twenty-sixteen-white-tablet-1x.png 558w, https://s.w.org/images/core/4.4/twenty-sixteen-white-desktop-1x.png 840w, https://s.w.org/images/core/4.4/twenty-sixteen-white-fullsize-1x.png 1086w, https://s.w.org/images/core/4.4/twenty-sixteen-white-tablet-2x.png 1116w, https://s.w.org/images/core/4.4/twenty-sixteen-white-desktop-2x.png 1680w, https://s.w.org/images/core/4.4/twenty-sixteen-white-fullsize-2x.png 2172w" sizes="(max-width: 500px) calc((100vw - 40px) * .8), (max-width: 782px) calc((100vw - 70px) * .8), (max-width: 960px) calc((100vw - 116px) * .8), (max-width: 1290px) calc((100vw - 240px) * .8), 840px" /> 61 <div class="feature-section two-col"> 62 <h2><?php _e( 'Editing Improvements' ); ?></h2> 63 <div class="col"> 64 <img src="https://cldup.com/klO9vWGiT3.png" /> 65 <h3><?php _e( 'Inline Linking' ); ?></h3> 66 <p><?php _e( 'Stay focused on your writing with a less distracting interface that keeps you in place and allows you to easily link to your content.' ); ?></p> 62 67 </div> 63 <div class="two-col"> 64 <div class="col"> 65 <h3><?php _e( 'Introducing Twenty Sixteen' ); ?></h3> 66 <p><?php _e( 'Our newest default theme, Twenty Sixteen, is a modern take on a classic blog design.' ); ?></p> 67 <p><?php _e( 'Twenty Sixteen was built to look great on any device. A fluid grid design, flexible header, fun color schemes, and more, will make your content shine.' ); ?></p> 68 <div class="horizontal-image"> 69 <div class="content"> 70 <img class="feature-image horizontal-screen" src="https://s.w.org/images/core/4.4/twenty-sixteen-dark-fullsize-2x.png" alt="" srcset="https://s.w.org/images/core/4.4/twenty-sixteen-dark-smartphone-1x.png 268w, https://s.w.org/images/core/4.4/twenty-sixteen-dark-smartphone-2x.png 535w, https://s.w.org/images/core/4.4/twenty-sixteen-dark-desktop-1x.png 558w, https://s.w.org/images/core/4.4/twenty-sixteen-dark-fullsize-1x.png 783w, https://s.w.org/images/core/4.4/twenty-sixteen-dark-desktop-2x.png 1116w, https://s.w.org/images/core/4.4/twenty-sixteen-dark-fullsize-2x.png 1566w" sizes="(max-width: 500px) calc((100vw - 40px) * .8), (max-width: 782px) calc((100vw - 70px) * .8), (max-width: 960px) calc((100vw - 116px) * .5216), (max-width: 1290px) calc((100vw - 240px) * .5216), 548px" /> 71 </div> 72 </div> 73 </div> 74 <div class="col feature-image"> 75 <img class="vertical-screen" src="https://s.w.org/images/core/4.4/twenty-sixteen-red-fullsize-2x.png" alt="" srcset="https://s.w.org/images/core/4.4/twenty-sixteen-red-smartphone-1x.png 107w, https://s.w.org/images/core/4.4/twenty-sixteen-red-smartphone-2x.png 214w, https://s.w.org/images/core/4.4/twenty-sixteen-red-desktop-1x.png 252w, https://s.w.org/images/core/4.4/twenty-sixteen-red-fullsize-1x.png 410w, https://s.w.org/images/core/4.4/twenty-sixteen-red-desktop-2x.png 504w, https://s.w.org/images/core/4.4/twenty-sixteen-red-fullsize-2x.png 820w" sizes="(max-width: 500px) calc((100vw - 40px) * .32), (max-width: 782px) calc((100vw - 70px) * .32), (max-width: 960px) calc((100vw - 116px) * .24), (max-width: 1290px) calc((100vw - 240px) * .24), 252px" /> 76 </div> 68 <div class="col"> 69 <img src="https://cldup.com/TE-OBMWHkX.png" /> 70 <h3><?php _e( 'Formatting Shortcuts' ); ?></h3> 71 <p><?php _e( 'Do you enjoy using formatting shortcuts for lists and headings? Now they’re even more useful, with horizontal lines and <code><code></code>.' ); ?></p> 77 72 </div> 78 73 </div> … … 81 76 82 77 <div class="feature-section two-col"> 78 <h2><?php _e( 'Customization Improvements' ); ?></h2> 83 79 <div class="col"> 84 <div class="media-container"> 85 <img src="https://s.w.org/images/core/4.4/responsive-devices-fullsize-2x.png" alt="" srcset="https://s.w.org/images/core/4.4/responsive-devices-smartphone-1x.png 335w, https://s.w.org/images/core/4.4/responsive-devices-desktop-1x.png 500w, https://s.w.org/images/core/4.4/responsive-devices-smartphone-2x.png 670w, https://s.w.org/images/core/4.4/responsive-devices-tablet-1x.png 698w, https://s.w.org/images/core/4.4/responsive-devices-desktop-2x.png 1000w, https://s.w.org/images/core/4.4/responsive-devices-fullsize-1x.png 1200w, https://s.w.org/images/core/4.4/responsive-devices-tablet-2x.png 1396w, https://s.w.org/images/core/4.4/responsive-devices-fullsize-2x.png 2400w" sizes="(max-width: 500px) calc(100vw - 40px), (max-width: 782px) calc(100vw - 70px), (max-width: 960px) calc((100vw - 116px) * .476), (max-width: 1290px) calc((100vw - 240px) * .476), 500px" /> 86 </div> 80 <img src="https://cldup.com/0iRJNVbt4G.png" /> 81 <h3><?php _e( 'Live Responsive Previews' ); ?></h3> 82 <?php 83 if ( current_user_can( 'customize' ) ) { 84 $customize_url = esc_url( admin_url( 'customize.php' ) ); 85 $customizer_link = sprintf( __( '<a href="%1$s" class="load-customize">%2$s</a>' ), $customize_url, __( 'customizer' ) ); 86 } else { 87 $customizer_link = __( 'customizer' ); 88 } 89 ?> 90 <p><?php printf( __( 'Make sure your site looks great on all screens! Preview mobile, tablet, and desktop views directly in the %s.' ), $customizer_link ); ?></p> 87 91 </div> 88 92 <div class="col"> 89 <h3><?php _e( 'Responsive images' ); ?></h3> 90 <p><?php _e( 'WordPress now takes a smarter approach to displaying appropriate image sizes on any device, ensuring a perfect fit every time. You don’t need to do anything to your theme, it just works.' ); ?></p> 91 </div> 92 </div> 93 94 <hr /> 95 96 <div class="feature-section two-col"> 97 <div class="col"> 98 <div class="embed-container"> 99 <blockquote data-secret="OcUe7B6Edh" class="wp-embedded-content"><a href="https://wordpress.org/news/2015/12/clifford/">WordPress 4.4 “Clifford”</a></blockquote><iframe class="wp-embedded-content" sandbox="allow-scripts" security="restricted" style="display:none;" src="https://wordpress.org/news/2015/12/clifford/embed/#?secret=OcUe7B6Edh" data-secret="OcUe7B6Edh" width="600" height="338" title="<?php esc_attr_e( 'Embedded WordPress Post' ); ?>" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe> 100 </div> 101 </div> 102 <div class="col"> 103 <h3><?php _e( 'Embed your WordPress content' ); ?></h3> 104 <p><?php _e( 'Now you can embed your posts on other sites, even other WordPress sites. Simply drop a post URL into the editor and see an instant embed preview, complete with the title, excerpt, and featured image if you’ve set one. We’ll even include your site icon and links for comments and sharing.' ); ?></p> 105 </div> 106 </div> 107 108 <hr /> 109 110 <div class="feature-section two-col"> 111 <div class="col"> 112 <div class="embed-container embed-reverbnation"> 113 <iframe width="640" height="150" scrolling="no" frameborder="no" src="https://www.reverbnation.com/widget_code/html_widget/artist_607?widget_id=55&pwc[song_ids]=3731874&pwc[size]=small"></iframe> 114 </div> 115 </div> 116 <div class="col"> 117 <h3><?php _e( 'Even more embed providers' ); ?></h3> 118 <p><?php _e( 'In addition to post embeds, WordPress 4.4 also adds support for five new oEmbed providers: Cloudup, Reddit Comments, ReverbNation, Speaker Deck, and VideoPress.' ); ?></p> 93 <img src="https://cldup.com/HWDA8xR_8G.png" /> 94 <h3><?php _e( 'Custom Logos' ); ?></h3> 95 <p><?php _e( 'Themes can now support logos for your business or brand.' ); ?> 96 <?php 97 if ( current_theme_supports( 'custom-logo' ) && current_user_can( 'customize' ) ) { 98 printf( __( 'Your theme supports custom logos! Try it out right now in the <a href="%s" class="load-customize">Site Identity</a> section of the customizer.' ), add_query_arg( 'autofocus[section]', 'title_tagline', $customize_url ) ); 99 } else { 100 _e( 'The Twenty Fifteen and Twenty Sixteen themes have been updated to support custom logos, which can be found in the Site Identity section of the Customizer.' ); 101 } 102 ?></p> 119 103 </div> 120 104 </div> … … 125 109 <h3><?php _e( 'Under the Hood' ); ?></h3> 126 110 127 <div class=" feature-section under-the-hood one-col">111 <div class="under-the-hood three-col"> 128 112 <div class="col"> 129 <h4><?php _e( 'REST API infrastructure' ); ?></h4> 130 <div class="two-col-text"> 131 <p><?php _e( 'Infrastructure for the REST API has been integrated into core, marking a new era in developing with WordPress. The REST API serves to provide developers with a path forward for building and extending RESTful APIs on top of WordPress.' ); ?></p> 132 <p><?php 133 if ( current_user_can( 'install_plugins' ) ) { 134 $url_args = array( 135 'tab' => 'plugin-information', 136 'plugin' => 'rest-api', 137 'TB_iframe' => true, 138 'width' => 600, 139 'height' => 550 140 ); 141 142 $plugin_link = '<a href="' . esc_url( add_query_arg( $url_args, network_admin_url( 'plugin-install.php' ) ) ) . '" class="thickbox open-plugin-details-modal">WordPress REST API</a>'; 143 } else { 144 $plugin_link = '<a href="https://wordpress.org/plugins/rest-api">WordPress REST API</a>'; 113 <h4><?php _e( 'Smart Image Resizing' ); ?></h4> 114 <p><?php printf( __( 'Generated images now load up to 50% faster with no noticeable quality loss. <a href="%s">It’s really cool</a>.' ), 'https://make.wordpress.org/core/2016/03/12/performance-improvements-for-images-in-wordpress-4-5/' ); ?></p> 115 </div> 116 <div class="col"> 117 <h4><?php _e( 'Selective Refresh' ); ?></h4> 118 <p><?php 119 printf( __( 'The customizer now supports a <a href="%s">comprehensive framework</a> for rendering parts of the preview without rewriting your PHP code in JavaScript.' ), 'https://make.wordpress.org/core/2016/02/16/selective-refresh-in-the-customizer/' ); 120 if ( current_user_can( 'customize' ) && current_user_can( 'edit_theme_options' ) ) { 121 if ( current_theme_supports( 'menus' ) && ! current_theme_supports( 'customize-selective-refresh-widgets' ) ) { 122 printf( ' ' . __( 'See it in action with <a href="%1$s" class="load-customize">Menus</a>.' ), add_query_arg( 'autofocus[panel]', 'nav_menus', $customize_url ) ); 123 } elseif ( current_theme_supports( 'customize-selective-refresh-widgets' ) ) { // If widgets are supported, menus are also because of the menus widget. 124 printf( ' ' . __( 'See it in action with <a href="%1$s" class="load-customize">Menus</a> or <a href="%2$s" class="load-customize">Widgets</a>.' ), add_query_arg( 'autofocus[panel]', 'nav_menus', $customize_url ), add_query_arg( 'autofocus[panel]', 'widgets', $customize_url ) ); 145 125 } 146 147 /* translators: WordPress REST API plugin link */ 148 printf( __( 'Infrastructure is the first part of a multi-stage rollout for the REST API. Inclusion of core endpoints is targeted for an upcoming release. To get a sneak peek of the core endpoints, and for more information on extending the REST API, check out the official %s plugin.' ), $plugin_link ); 149 ?></p> 150 </div> 126 } 127 ?></p> 128 </div> 129 <div class="col"> 130 <h4><?php _e( 'JavaScript Library Updates' ); ?></h4> 131 <p><?php _e( 'jQuery 1.12.3, jQuery Migrate 1.4.0, Backbone 1.2.3, and Underscore 1.8.3 are bundled.' ); ?></p> 151 132 </div> 152 133 </div> 153 134 154 <div class=" feature-section under-the-hood three-col">135 <div class="under-the-hood two-col"> 155 136 <div class="col"> 156 <h4><?php _e( 'Term meta' ); ?></h4> 157 <p><?php 158 /* translators: 1: add_term_meta() docs link, 2: get_term_meta() docs link, 3: update_term_meta() docs link */ 159 printf( __( 'Terms now support metadata, just like posts. See %1$s, %2$s, and %3$s for more information.' ), 160 '<a href="https://developer.wordpress.org/reference/functions/add_term_meta"><code>add_term_meta()</code></a>', 161 '<a href="https://developer.wordpress.org/reference/functions/get_term_meta"><code>get_term_meta()</code></a>', 162 '<a href="https://developer.wordpress.org/reference/functions/update_term_meta"><code>update_term_meta()</code></a>' 163 ); 164 ?></p> 137 <h4><?php _e( 'Script Loader Improvements' ); ?></h4> 138 <p><?php printf( __( 'Better support has been added for script header/footer dependencies. New <code><a href="%s">wp_add_inline_script()</a></code> enables adding extra code to registered scripts.' ), 'https://make.wordpress.org/core/2016/03/08/enhanced-script-loader-in-wordpress-4-5/' ); ?></p> 165 139 </div> 166 140 <div class="col"> 167 <h4><?php _e( 'Comment query improvements' ); ?></h4> 168 <p><?php 169 /* translators: WP_Comment_Query class name */ 170 printf( __( 'Comment queries now have cache handling to improve performance. New arguments in %s make crafting robust comment queries simpler.' ), '<code>WP_Comment_Query</code>' ); 171 ?></p> 172 </div> 173 <div class="col"> 174 <h4><?php _e( 'Term, comment, and network objects' ); ?></h4> 175 <p><?php 176 /* translators: 1: WP_Term class name, WP_Comment class name, WP_Network class name */ 177 printf( __( 'New %1$s, %2$s, and %3$s objects make interacting with terms, comments, and networks more predictable and intuitive in code.' ), 178 '<code>WP_Term</code>', 179 '<code>WP_Comment</code>', 180 '<code>WP_Network</code>' 181 ); 182 ?></p> 141 <h4><?php _e( 'Better Embed Templates' ); ?></h4> 142 <p><?php printf( __( 'Embed templates have been split into parts and can be <a href="%s">directly overridden by themes</a> via the template hierarchy.' ), 'https://make.wordpress.org/core/2016/03/11/embeds-changes-in-wordpress-4-5/' ); ?></p> 183 143 </div> 184 144 </div> -
trunk/src/wp-admin/css/about.css
r36910 r37169 102 102 } 103 103 104 .about-wrap h2 { 105 margin: 50px 0 1em; 106 font-size: 1.8em; 107 line-height: 1.3; 108 font-weight: 300; 109 text-align: center; 110 } 111 104 112 .about-wrap h3 { 105 113 margin: 1.25em 0 .6em; 106 114 font-size: 1.25em; 107 115 line-height: 1.5em; 116 } 117 118 .about-wrap .changelog h3 { 119 margin-top: 40px; 108 120 } 109 121 … … 138 150 position: relative; 139 151 } 152 140 153 .about-wrap .two-col .col { 141 154 margin-right: 4.799999999%; 142 155 width: 47.6%; 143 156 } 157 158 .about-wrap .two-col img { 159 margin-bottom: 1.5em; 160 } 161 144 162 .about-wrap .feature-section.two-col .col { 145 163 display: inline-block; 146 164 float: none; 165 margin-top: 1em; 147 166 margin-right: 4.799999999%; 148 167 width: -webkit-calc( 47.6% - 4px ); 149 168 width: calc( 47.6% - 4px ); 150 vertical-align: middle;169 vertical-align: top; 151 170 } 152 171 … … 159 178 .about-wrap .three-col .col:nth-of-type(3n) { 160 179 margin-right: 0; 180 } 181 182 .about-wrap .under-the-hood { 183 clear: both; 184 overflow: hidden; 185 } 186 187 .about-wrap .under-the-hood:nth-of-type(2n) { 188 margin-top: 3em; 161 189 } 162 190 … … 197 225 .about-wrap .feature-section.two-col h3 { 198 226 margin-top: 0; 199 }200 201 .about-wrap .feature-list h2 {202 margin: 30px 0 15px;203 text-align: center;204 227 } 205 228 … … 264 287 } 265 288 266 .about-wrap .headline-feature .col {267 width: 65.2%;268 }269 270 .about-wrap .headline-feature .col.feature-image {271 width: 30%;272 }273 274 .about-wrap .headline-feature .vertical-screen {275 float: right;276 margin-left: 40px;277 max-width: 100%;278 }279 280 .about-wrap .headline-feature .horizontal-screen {281 margin-top: 20px;282 max-width: 100%;283 }284 285 289 .about-wrap .embed-container { 286 290 text-align: center; … … 295 299 } 296 300 297 .about-wrap .feature-section :not(.under-the-hood).col {301 .about-wrap .feature-section .col { 298 302 margin-top: 40px; 299 303 } … … 318 322 text-decoration: none; 319 323 padding: 0 5px; 320 }321 322 .about-wrap .feature-list.finer-points h4,323 .about-wrap .feature-list.finer-points p {324 margin-left: 115px;325 324 } 326 325 … … 417 416 418 417 @media screen and ( max-width: 782px ) { 419 .about-wrap .feature-section {420 padding: 0;421 border-bottom: none;422 }423 424 .about-wrap [class$=col] .col {425 float: none;426 width: 100%;427 margin: 40px 0 0;428 padding: 0 0 40px;429 }430 431 .about-wrap .headline-feature {432 position: relative;433 }434 435 .about-wrap .headline-feature .col.feature-image {436 position: absolute;437 bottom: 0;438 right: 0;439 width: 40%;440 }441 442 .about-wrap .headline-feature .horizontal-image {443 position: relative;444 }445 446 .about-wrap .headline-feature .horizontal-image:before {447 display: block;448 content: "";449 width: 100%;450 padding-top: 80%;451 }452 453 .about-wrap .headline-feature .horizontal-image > .content {454 position: absolute;455 top: 0;456 left: 0;457 right: 0;458 bottom: 0;459 }460 461 .about-wrap .headline-feature .horizontal-image img {462 position: absolute;463 bottom: 0;464 }465 466 418 .about-wrap .two-col-text { 467 419 -webkit-column-count: 1; … … 474 426 margin: 0 auto; 475 427 } 476 477 .about-wrap .feature-list .col {478 margin: 0;479 padding: 0;480 border-bottom: none;481 }482 483 .about-wrap .headline-feature .feature-section {484 max-width: 100%;485 }486 487 .about-wrap .feature-list .feature-section {488 padding: 0 0 40px;489 }490 428 } 491 429 … … 511 449 } 512 450 513 .about-wrap .feature-section.two-col .col, 514 .about-wrap .three-col .col, 515 .about-wrap .headline-feature .feature-section .col { 451 .about-wrap .two-col .col, 452 .about-wrap .three-col .col { 516 453 width: 100% !important; 517 454 float: none !important; 518 455 } 519 456 520 .about-wrap .feature-section.two-col .col:last-of-type { 457 .about-wrap .under-the-hood.three-col .col, 458 .about-wrap .under-the-hood.two-col .col, 459 .about-wrap .under-the-hood.one-col .col { 460 margin-bottom: 2em; 461 padding-bottom: 0; 462 } 463 464 .about-wrap .under-the-hood:nth-of-type(2n) { 521 465 margin-top: 0; 522 466 } 523 467 524 .feature-section.under-the-hood.three-col .col, 525 .feature-section.under-the-hood.one-col .col { 526 padding-bottom: 0; 527 } 528 } 529 530 @media only screen and (max-width: 400px) { 531 .about-wrap .feature-list svg { 532 margin-top: 15px; 533 height: 65px; 534 width: 65px; 535 } 536 .about-wrap .feature-list.finer-points h4, 537 .about-wrap .feature-list.finer-points p { 538 margin-left: 80px; 539 } 540 } 468 .about-wrap .under-the-hood:nth-of-type(2n) h4 { 469 margin-top: 0; 470 } 471 }
Note: See TracChangeset
for help on using the changeset viewer.