<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[24926] trunk/wp-admin: Add screenshots and video to about page.</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://core.trac.wordpress.org/changeset/24926">24926</a></dd>
<dt>Author</dt> <dd>nacin</dd>
<dt>Date</dt> <dd>2013-07-31 17:56:24 +0000 (Wed, 31 Jul 2013)</dd>
</dl>
<h3>Log Message</h3>
<pre>Add screenshots and video to about page. props markjaquith. fixes <a href="http://core.trac.wordpress.org/ticket/24832">#24832</a>. for trunk.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkwpadminaboutphp">trunk/wp-admin/about.php</a></li>
<li><a href="#trunkwpadmincsswpadminrtlcss">trunk/wp-admin/css/wp-admin-rtl.css</a></li>
<li><a href="#trunkwpadmincsswpadmincss">trunk/wp-admin/css/wp-admin.css</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkwpadminaboutphp"></a>
<div class="modfile"><h4>Modified: trunk/wp-admin/about.php (24925 => 24926)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/wp-admin/about.php 2013-07-31 17:55:42 UTC (rev 24925)
+++ trunk/wp-admin/about.php 2013-07-31 17:56:24 UTC (rev 24926)
</span><span class="lines">@@ -37,7 +37,7 @@
</span><span class="cx"> <h3><?php _e( 'Colorful New Theme' ); ?></h3>
</span><span class="cx">
</span><span class="cx"> <div class="feature-section images-stagger-right">
</span><del>- <img alt="" src="<?php echo esc_url( admin_url( 'images/screenshots/about-twenty-twelve.png' ) ); ?>" class="image-66" />
</del><ins>+ <img alt="" src="<?php echo is_ssl() ? 'https://' : '//s.'; ?>wordpress.org/images/core/3.6/theme.png" class="image-66" />
</ins><span class="cx"> <h4><?php _e( 'Introducing Twenty Thirteen' ); ?></h4>
</span><span class="cx"> <p><?php printf( __( "The new default theme puts focus on your content with a colorful, single-column design made for media-rich blogging." ) ); ?></p>
</span><span class="cx"> <p><?php _e( 'Inspired by modern art, Twenty Thirteen features quirky details, beautiful typography, and bold, high-contrast colors — all with a flexible layout that looks great on any device, big or small.' ); ?></p>
</span><span class="lines">@@ -48,7 +48,7 @@
</span><span class="cx"> <h3><?php _e( 'Write with Confidence' ); ?></h3>
</span><span class="cx">
</span><span class="cx"> <div class="feature-section images-stagger-right">
</span><del>- <img alt="" src="<?php echo esc_url( admin_url( 'images/screenshots/about-retina.png' ) ); ?>" class="image-66" />
</del><ins>+ <img alt="" src="<?php echo is_ssl() ? 'https://' : '//s.'; ?>wordpress.org/images/core/3.6/revisions.png" class="image-66" />
</ins><span class="cx"> <h4><?php _e( 'Explore Revisions' ); ?></h4>
</span><span class="cx"> <p></p>
</span><span class="cx"> <p><?php _e( 'From the first word you write, WordPress saves every change. Each revision is always at your fingertips. Text is highlighted as you scroll through revisions at lightning speed, so you can see what changes have been made along the way.' ); ?></p>
</span><span class="lines">@@ -75,7 +75,14 @@
</span><span class="cx"> <h3><?php _e( 'Support for Audio and Video' ); ?></h3>
</span><span class="cx">
</span><span class="cx"> <div class="feature-section images-stagger-right">
</span><del>- <img alt="" src="<?php echo esc_url( admin_url( 'images/screenshots/about-color-picker.png' ) ); ?>" class="image-30" />
</del><ins>+ <div class="video image-66"><?php echo wp_video_shortcode(
+ array(
+ 'm4v' => (is_ssl() ? 'https://' : 'http://s.' ) . 'wordpress.org/images/core/3.6/video.m4v',
+ 'ogv' => (is_ssl() ? 'https://' : 'http://s.' ) . 'wordpress.org/images/core/3.6/video.ogv',
+ 'width' => 625,
+ 'height' => 360,
+ )
+ ); ?></div>
</ins><span class="cx"> <h4><?php _e( 'New Media Player' ); ?></h4>
</span><span class="cx"> <p><?php _e( 'Share your audio and video with the new built-in HTML5 media player. Upload files using the media manager and embed them in your posts.' ); ?></p>
</span><span class="cx">
</span></span></pre></div>
<a id="trunkwpadmincsswpadminrtlcss"></a>
<div class="modfile"><h4>Modified: trunk/wp-admin/css/wp-admin-rtl.css (24925 => 24926)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/wp-admin/css/wp-admin-rtl.css 2013-07-31 17:55:42 UTC (rev 24925)
+++ trunk/wp-admin/css/wp-admin-rtl.css 2013-07-31 17:56:24 UTC (rev 24926)
</span><span class="lines">@@ -1729,7 +1729,8 @@
</span><span class="cx"> margin: 0 0 10px 0.7%;
</span><span class="cx"> }
</span><span class="cx">
</span><del>-.about-wrap .feature-section.images-stagger-right img {
</del><ins>+.about-wrap .feature-section.images-stagger-right img,
+.about-wrap .feature-section.images-stagger-right .video {
</ins><span class="cx"> float: left;
</span><span class="cx"> margin: 0 2em 12px 5px;
</span><span class="cx"> }
</span><span class="lines">@@ -1746,16 +1747,22 @@
</span><span class="cx"> margin-left: 10px;
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+@media only screen and (max-width: 900px) {
+ .about-wrap .feature-section.images-stagger-right .video.image-66 {
+ margin-right: 3px;
+ }
+}
+
</ins><span class="cx"> @media only screen and (max-width: 768px) {
</span><del>- .about-wrap .feature-section img.image-66 {
</del><ins>+ .about-wrap .feature-section .image-66 {
</ins><span class="cx"> float: none;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- .about-wrap .feature-section.images-stagger-right img.image-66 {
</del><ins>+ .about-wrap .feature-section.images-stagger-right .image-66 {
</ins><span class="cx"> margin-right: 3px;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- .about-wrap .feature-section.images-stagger-left img.image-66 {
</del><ins>+ .about-wrap .feature-section.images-stagger-left .image-66 {
</ins><span class="cx"> margin-left: 3px;
</span><span class="cx"> }
</span><span class="cx"> }
</span></span></pre></div>
<a id="trunkwpadmincsswpadmincss"></a>
<div class="modfile"><h4>Modified: trunk/wp-admin/css/wp-admin.css (24925 => 24926)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/wp-admin/css/wp-admin.css 2013-07-31 17:55:42 UTC (rev 24925)
+++ trunk/wp-admin/css/wp-admin.css 2013-07-31 17:56:24 UTC (rev 24926)
</span><span class="lines">@@ -5871,7 +5871,8 @@
</span><span class="cx">
</span><span class="cx"> /* Changelog / Update screen */
</span><span class="cx">
</span><del>-.about-wrap .feature-section img {
</del><ins>+.about-wrap .feature-section img,
+.about-wrap .feature-section .video {
</ins><span class="cx"> border: none;
</span><span class="cx"> margin: 0 1.94% 10px 0;
</span><span class="cx"> -webkit-border-radius: 3px;
</span><span class="lines">@@ -5888,7 +5889,8 @@
</span><span class="cx"> margin-left: 0;
</span><span class="cx"> }
</span><span class="cx">
</span><del>-.about-wrap .feature-section.images-stagger-right img {
</del><ins>+.about-wrap .feature-section.images-stagger-right img,
+.about-wrap .feature-section.images-stagger-right .video {
</ins><span class="cx"> float: right;
</span><span class="cx"> margin: 0 5px 12px 2em;
</span><span class="cx"> }
</span><span class="lines">@@ -5898,16 +5900,20 @@
</span><span class="cx"> margin: 0 2em 12px 5px;
</span><span class="cx"> }
</span><span class="cx">
</span><del>-.about-wrap .feature-section img.image-100 {
</del><ins>+.about-wrap .feature-section .image-100 {
</ins><span class="cx"> margin: 0 0 2em 0;
</span><span class="cx"> width: 100%;
</span><span class="cx"> }
</span><span class="cx">
</span><del>-.about-wrap .feature-section img.image-66 {
</del><ins>+.about-wrap .feature-section .image-66 {
</ins><span class="cx"> width: 65%;
</span><span class="cx"> }
</span><span class="cx">
</span><del>-.about-wrap .feature-section img.image-50 {
</del><ins>+.about-wrap .feature-section .image-66.video {
+ max-width: 600px;
+}
+
+.about-wrap .feature-section .image-50 {
</ins><span class="cx"> max-width: 50%;
</span><span class="cx"> }
</span><span class="cx">
</span><span class="lines">@@ -5975,23 +5981,34 @@
</span><span class="cx">
</span><span class="cx"> @media only screen and (max-width: 900px) {
</span><span class="cx"> .about-wrap .feature-section.images-stagger-left img,
</span><del>- .about-wrap .feature-section.images-stagger-right img {
</del><ins>+ .about-wrap .feature-section.images-stagger-right img,
+ .about-wrap .feature-section.images-stagger-right .video {
</ins><span class="cx"> clear: both;
</span><span class="cx"> }
</span><ins>+
+ .about-wrap .feature-section .video.image-66 {
+ float: none;
+ width: 98%;
+ max-width: 98%;
+ }
+
+ .about-wrap .feature-section.images-stagger-right .video.image-66 {
+ margin-left: 3px;
+ }
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> @media only screen and (max-width: 768px) {
</span><del>- .about-wrap .feature-section img.image-66 {
</del><ins>+ .about-wrap .feature-section .image-66 {
</ins><span class="cx"> float: none;
</span><span class="cx"> width: 98%;
</span><span class="cx"> max-width: 98%;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- .about-wrap .feature-section.images-stagger-right img.image-66 {
</del><ins>+ .about-wrap .feature-section.images-stagger-right .image-66 {
</ins><span class="cx"> margin-left: 3px;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- .about-wrap .feature-section.images-stagger-left img.image-66 {
</del><ins>+ .about-wrap .feature-section.images-stagger-left .image-66 {
</ins><span class="cx"> margin-right: 3px;
</span><span class="cx"> }
</span><span class="cx"> }
</span></span></pre>
</div>
</div>
</body>
</html>