WordPress.org

Make WordPress Core

Ticket #18742: 18742.3.layout-copy-refine.patch

File 18742.3.layout-copy-refine.patch, 15.7 KB (added by chexee, 2 years ago)

Refines layout and copy. Sets explicit width.

  • wp-admin/css/wp-admin.dev.css

     
    749749        font-style: italic; 
    750750} 
    751751 
     752.no-break { 
     753        white-space: nowrap; 
     754} 
    752755 
    753756/*------------------------------------------------------------------------------ 
    754757  2.0 - Forms 
     
    48144817 
    48154818.about-wrap { 
    48164819        position: relative; 
    4817         margin: 44px 40px 0 20px; 
     4820        margin: 0 40px 0 0; 
    48184821        font-size: 16px; 
     4822        width: 930px; 
    48194823} 
    48204824.about-wrap div.updated, 
    48214825.about-wrap div.error { 
    48224826    display: none !important;  
    48234827} 
     4828 
     4829/* Typography */ 
     4830 
    48244831.about-wrap p { 
    48254832        line-height: 1.6em; 
    48264833} 
    48274834.about-wrap h1 { 
    4828         margin: 0.6em 200px 0 0; 
     4835        margin: 0.2em 200px 0 0; 
    48294836        line-height: 1.2em; 
    48304837        font-size: 2.8em; 
    48314838        font-weight: 200; 
     
    48464853        min-height: 60px; 
    48474854        font-size: 24px; 
    48484855} 
    4849 .about-wrap h2.nav-tab-wrapper { 
    4850         padding-left: 6px; 
     4856.about-wrap h3 { 
     4857        font-size: 24px; 
     4858        margin-bottom: 1em; 
     4859        padding-top: 20px; 
    48514860} 
     4861 
     4862.about-wrap .changelog { 
     4863        font-size: 15px; 
     4864        padding-bottom: 10px; 
     4865        overflow: hidden; 
     4866} 
     4867.about-wrap .changelog li { 
     4868        list-style-type: disc; 
     4869        margin-left: 3em; 
     4870} 
     4871.about-wrap .feature-section h4 { 
     4872        margin-bottom: 0.6em; 
     4873} 
     4874.about-wrap .feature-section p { 
     4875        margin-top: 0.6em; 
     4876} 
     4877.about-wrap code { 
     4878        font-size: 14px; 
     4879} 
     4880 
     4881/* WordPress Version Badge */ 
     4882 
    48524883.wp-badge { 
    48534884        padding-top: 142px; 
    48544885        height: 50px; 
     
    48684899        right: 0; 
    48694900} 
    48704901 
     4902/* Tabs */ 
     4903 
     4904.about-wrap h2.nav-tab-wrapper { 
     4905        padding-left: 6px; 
     4906} 
    48714907.about-wrap h2 .nav-tab { 
    48724908        padding: 4px 10px 6px; 
    48734909        margin: 0 3px -1px 0; 
     
    48784914        padding-top: 3px; 
    48794915} 
    48804916 
    4881 .about-wrap h3 { 
    4882         font-size: 24px; 
    4883         margin-bottom: 1em; 
    4884         padding-top: 20px; 
    4885 } 
     4917/* Changelog / Update screen */ 
    48864918 
    4887 .about-wrap .changelog { 
    4888         font-size: 15px; 
    4889         padding-bottom: 10px; 
    4890         overflow: hidden; 
    4891 } 
    4892 .about-wrap .changelog li { 
    4893         list-style-type: disc; 
    4894         margin-left: 3em; 
    4895 } 
    4896  
    48974919.about-wrap .feature-section .left-feature, 
    48984920.about-wrap .feature-section img, 
    48994921.about-wrap .feature-section .right-feature { 
     
    49054927        overflow: hidden; 
    49064928        clear: both; 
    49074929} 
    4908 .about-wrap .feature-section.angled-left img { 
    4909         margin-top: 1em; 
     4930.about-wrap .feature-section img { 
     4931        margin: 5px auto; 
     4932         
     4933        border: none; 
     4934                 
     4935        -webkit-border-radius: 3px; 
     4936        border-radius: 3px; 
    49104937} 
    49114938 
    49124939.about-wrap .feature-section.angled-right { 
    4913         margin-top: -35px; 
    4914         padding-top: 15px; 
     4940        margin-top: -7.5em; 
    49154941} 
    4916 .about-wrap .feature-section.angled-right img { 
    4917         margin-top: 0.5em; 
    4918 } 
    4919  
    49204942.about-wrap .feature-section.angled-right .left-feature { 
    4921         margin-top: 15px; 
     4943        padding-top: 7em; 
    49224944} 
    4923  
    4924 .about-wrap .feature-section .image-mask { 
    4925         overflow: hidden; 
    4926         display: block; 
    4927         text-align: center; 
    4928         -webkit-border-radius: 3px; 
    4929         border-radius: 3px; 
     4945.about-wrap .feature-section.angled-right img, 
     4946.about-wrap .feature-section.angled-left img { 
     4947        margin-top: 1.5em; 
    49304948} 
    4931 .about-wrap .feature-section .image-mask img { 
    4932         width: auto; 
    4933         height: auto; 
    4934         margin: 0 auto; 
    4935         float: none; 
    4936          
    4937         border: none; 
    4938          
    4939         box-shadow: none; 
    4940         -webkit-box-shadow: none; 
    4941 } 
    49424949 
    4943 .about-wrap .feature-section h4 { 
    4944         margin-bottom: 0.6em; 
    4945 } 
    4946 .about-wrap .feature-section p { 
    4947         margin-top: 0.6em; 
    4948 } 
    4949 .about-wrap .feature-section code { 
    4950         font-size: 14px; 
    4951 } 
    4952  
    4953 .about-wrap .feature-section img { 
    4954         margin-top: 15px; 
    4955  
    4956         -webkit-border-radius: 3px; 
    4957         border-radius: 3px; 
    4958 } 
    4959  
    4960  
    49614950.about-wrap .feature-section.angled-left .left-feature, 
    49624951.about-wrap .feature-section.angled-right .left-feature { 
    4963         margin-right: 5%; 
    4964         width: 40%; 
     4952        margin-right: 4%; 
    49654953} 
    49664954.about-wrap .feature-section.angled-left .right-feature, 
    49674955.about-wrap .feature-section.angled-right .right-feature { 
    4968         margin-left: 5%; 
     4956        margin-left: 4%; 
    49694957} 
    4970 .about-wrap .feature-section.angled-left .image-mask, 
    4971 .about-wrap .feature-section.angled-right .image-mask { 
    4972         width: 20%; 
    4973         height: 150px; 
    4974          
    4975         margin-top: 5px; 
    4976         margin-bottom: 5px; 
    4977          
    4978         float: left; 
    4979 } 
    49804958.about-wrap .feature-section .left-feature { 
    49814959        margin-right: 10%; 
    49824960} 
     
    49864964} 
    49874965.about-wrap .feature-section.angled-left .left-feature, 
    49884966.about-wrap .feature-section.angled-right .right-feature { 
    4989         width: 30%; 
     4967        width: 27%; 
    49904968} 
    49914969.about-wrap .feature-section.angled-left .right-feature, 
    49924970.about-wrap .feature-section.angled-right .left-feature { 
    4993         width: 40%; 
     4971        width: 35%; 
    49944972} 
    49954973 
    49964974.about-wrap .feature-section.three-col { 
     
    50004978.about-wrap .feature-section.three-col div { 
    50014979        width: 30%; 
    50024980        margin-right: 4.999999999%; 
     4981         
    50034982        float: left; 
    50044983} 
    50054984.about-wrap .feature-section.three-col h4 { 
    50064985        margin:  0 0 0.6em 0; 
    50074986} 
    5008 .about-wrap .feature-section.three-col div p { 
    5009         margin: 0; 
     4987.about-wrap .feature-section.three-col img { 
     4988        margin: 0.5em 3px 1em 0; 
    50104989} 
    50114990.about-wrap .feature-section.three-col .last-feature { 
    50124991        margin-right: 0; 
     
    50154994.about-wrap .feature-section .feature-images { 
    50164995        width: 300px; 
    50174996        position: absolute; 
     4997        margin-top: 0.5em; 
    50184998} 
     4999.about-wrap .feature-section .feature-images img { 
     5000        width: 250px; 
     5001        height: 150px; 
     5002        margin-right: 5px; 
     5003} 
    50195004.about-wrap .feature-section.images-stagger-left, 
    50205005.about-wrap .feature-section.images-stagger-right { 
    5021         min-height: 330px; 
     5006        min-height: 265px; 
    50225007} 
    50235008.about-wrap .feature-section.images-stagger-right .angled-right, 
    50245009.about-wrap .feature-section.images-stagger-left .angled-left { 
    5025         margin-bottom: -50px; 
     5010        margin-bottom: -30px; 
    50265011} 
    5027 .about-wrap .feature-section.images-stagger-right .left-feature, 
    5028 .about-wrap .feature-section.images-stagger-left .right-feature { 
    5029         width: auto;     
     5012.about-wrap .feature-section.images-stagger-left .angled-left { 
     5013        margin-left: 5px; 
    50305014} 
    5031 .about-wrap .feature-section .feature-images img { 
    5032         width: 250px; 
    5033         height: 150px; 
    5034         margin-right: 5px; 
    5035 } 
    50365015.about-wrap .feature-section .angled-right { 
    50375016        float: right; 
    50385017} 
    50395018.about-wrap .feature-section.images-stagger-right .feature-images { 
    50405019        right: 0; 
     5020} 
     5021.about-wrap .feature-section.images-stagger-left .feature-images { 
     5022        left: 0; 
    50415023}  
    50425024.about-wrap .feature-section.images-stagger-right .left-feature { 
    50435025        margin-right: 350px;     
    50445026} 
    5045 .about-wrap .feature-section.images-stagger-left .feature-images { 
    5046         float: left; 
    5047 } 
    50485027.about-wrap .feature-section.images-stagger-left .right-feature { 
    50495028        margin-left: 350px; 
    5050         float: left; 
    50515029} 
    5052 .about-wrap .feature-section.images-stagger-left .angled-left { 
    5053         margin-left: 5px; 
    5054 } 
    50555030 
     5031/* Return to Dashboard Home link */ 
     5032 
    50565033.about-wrap .return-to-dashboard { 
    5057         margin: 16px 0; 
     5034        margin: 30px 0 0 -5px; 
    50585035        font-size: 14px; 
    50595036        font-weight: bold; 
    50605037} 
    50615038.about-wrap .return-to-dashboard a { 
    50625039        text-decoration: none; 
     5040        padding: 0 5px; 
    50635041} 
    50645042 
     5043/* Credits */ 
     5044 
    50655045.about-wrap h4.wp-people-group { 
    50665046        margin-top: 2.6em; 
    50675047        font-size: 16px; 
     
    51135093        white-space: nowrap; 
    51145094} 
    51155095 
     5096/* Freedoms */ 
     5097 
    51165098.freedoms-php .about-wrap ol { 
    51175099        margin: 40px 60px; 
    51185100} 
  • wp-admin/about.php

     
    3636<div class="changelog"> 
    3737        <h3><?php _e( 'Easier Uploading' ); ?></h3> 
    3838         
    39         <div class="feature-section images-stagger-left"> 
     39        <div class="feature-section images-stagger-right"> 
    4040                <div class="feature-images"> 
     41                        <img src="images/screenshots/media-icon.png" width="200" class="angled-right" /> 
    4142                        <img src="images/screenshots/drag-and-drop.png" width="200" class="angled-left" /> 
    42                         <img src="images/screenshots/media-icon.png" width="200" class="angled-right" /> 
    4343                </div> 
    44                 <div class="right-feature"> 
     44                <div class="left-feature"> 
     45                        <h4><?php _e( 'File Type Detection' ); ?></h4> 
     46                        <p><?php _e( 'We&#039;ve streamlined things! Instead of needing to click on a specific upload icon based on your file type, now there&#039;s just one. Once your file is uploaded, the appropriate fields will be displayed for entering information based on the file type.' ); ?></p> 
     47 
    4548                        <h4><?php _e( 'Drag-and-Drop Media Uploader' ); ?></h4> 
    4649                        <p><?php _e( 'Adding photos or other files to posts and pages just got easier. Drag files from your desktop and drop them into the uploader. Add one file at a time, or many at once.' ); ?></p> 
    4750 
    48                         <h4><?php _e( 'File Type Detection' ); ?></h4> 
    49                         <p><?php _e( 'We&#039;ve streamlined things! Instead of needing to click on a specific upload icon based on your file type, now there&#039;s just one. Once your file is uploaded, the appropriate fields will be displayed for entering information based on the file type.' ); ?></p> 
    50  
    5151                        <h4><?php _e( 'More File Formats' ); ?></h4> 
    5252                        <p><?php _e( 'We&#039;ve added the rar and 7z file formats to the list of allowed file types in the uploader.' ); ?></p> 
    5353                </div> 
     
    6060        <div class="feature-section angled-left"> 
    6161                <div class="left-feature"> 
    6262                        <h4><?php _e( 'Flyout Menus' ); ?></h4> 
    63                         <p><?php _e( 'Speed up navigating the dashboard and reduce repetitive clicking with our new flyout submenus. As you hover over each main menu item in your dashboard navigation, the submenus will magically appear, providing single-click access to any dashboard screen from any other.' ); ?></p> 
     63                        <p><?php _e( 'Speed up navigating the dashboard and reduce repetitive clicking with our new flyout submenus. As you hover over each main menu item in your dashboard navigation, the submenus will magically appear, providing single-click access to any dashboard screen.' ); ?></p> 
    6464                </div> 
    65                 <span class="image-mask"><img src="images/screenshots/admin-flyouts.png" /></span> 
     65                <img src="images/screenshots/admin-flyouts.png" /> 
    6666                <div class="right-feature"> 
    67                         <h4><?php _e( 'Header + Admin Bar = Toolbar' ); ?></h4> 
    68                         <p><?php _e( 'To save space and increase efficiency, we&#039;ve combined the admin bar and the old Dashboard header into one persistent toolbar. Hovering over the toolbar items will reveal submenus when available for quick access. ' ); ?></p> 
     67                        <h4><?php _e( 'Responsive Design' ); ?></h4> 
     68                        <p><?php _e( 'Certain dashboard screens have been updated to look better at various sizes, including improved iPad/tablet support.' ); ?></p> 
    6969                </div> 
    70  
    7170        </div> 
     71         
    7272        <div class="feature-section angled-right"> 
    73  
    7473                <div class="left-feature"> 
    75                         <h4><?php _e( 'Responsive Design' ); ?></h4> 
    76                         <p><?php _e( 'Certain dashboard screens have been updated to look better at various sizes, including improved iPad/tablet support.' ); ?></p> 
     74                        <h4><?php _e( 'Header + Admin Bar = Toolbar' ); ?></h4> 
     75                        <p><?php _e( 'To save space and increase efficiency, we&#039;ve combined the admin bar and the old Dashboard header into one persistent toolbar. Hovering over the toolbar items will reveal submenus when available for quick access. ' ); ?></p> 
    7776                </div> 
    78                 <span class="image-mask"><img src="images/screenshots/help-screen.png" width="250" height="170" /></span> 
     77                <img src="images/screenshots/help-screen.png" /> 
    7978                <div class="right-feature"> 
    8079                        <h4><?php _e( 'Help Tabs' ); ?></h4> 
    81                         <p><?php _e( 'The Help tabs located in the upper corner of the dashboard screens below your name have gotten a facelift. Help content is broken in smaller sections for easier access, with links to relevant documentation and the support forums always visible.' ); ?></p> 
     80                        <p><?php _e( 'The Help tabs located in the upper corner of the dashboard screens below your name have gotten a facelift. Help content is broken into smaller sections for easier access, with links to relevant documentation and the support forums always visible.' ); ?></p> 
    8281                </div> 
    8382        </div> 
    84  
    8583</div> 
    8684 
    8785<div class="changelog"> 
     
    8987 
    9088        <div class="feature-section images-stagger-right"> 
    9189                <div class="feature-images"> 
    92                         <img src="images/screenshots/welcome-screen.png" class="angled-right" /> 
    93                         <img src="images/screenshots/new-feature-pointer.png" class="angled-left" /> 
     90                        <img src="images/screenshots/new-feature-pointer.png" class="angled-right" /> 
     91                        <img src="images/screenshots/welcome-screen.png" class="angled-left" /> 
    9492                </div> 
    9593                <div class="left-feature"> 
    9694                        <h4><?php _e( 'New Feature Pointers' ); ?></h4> 
     
    111109 
    112110        <div class="feature-section three-col"> 
    113111                <div> 
    114                         <h4><?php _e( 'Widget Improvements' ); ?></h4> 
    115                         <p><?php _e( 'Changing themes often requires widget re-configuration based on the number and position of sidebars. Now if you change back to a previous theme within a week, the widgets will automatically go back to how you had them arranged in that theme. <em>Note: if you&#039;ve added new widgets since the switch, you&#039;ll need to rescue them from the Inactive Widgets area.</em>' ); ?></p> 
     112                        <h4><?php _e( 'Better Co-Editing' ); ?></h4> 
     113                        <img src="images/screenshots/coediting.png" /> 
     114                        <p><?php _e( 'Have you ever gone to edit a post after someone else has finished with it, only to get an alert that tells you the other person is still editing the post? From now on, you&#039;ll only get that alert if another person is still on the editing screen &mdash; no more time lag.' ); ?></p> 
    116115                </div> 
    117116                <div> 
    118117                        <h4><?php _e( 'Tumblr Importer' ); ?></h4> 
    119                         <p><?php _e( 'Want to import content from Tumblr to WordPress? No problem! Go to Tools &rarr; Import to get the new Tumblr Importer.' ); ?></p> 
     118                        <p><?php _e( 'Want to import content from Tumblr to WordPress? No problem! Go to <span class="no-break">Tools &rarr; Import</span> to get the new Tumblr Importer, which maps your Tumblog posts to the matching WordPress post formats. Tip: Choose a theme designed to display post formats to get the greatest benefit from the importer.' ); ?></p> 
    120119                </div> 
    121120                <div class="last-feature"> 
    122                         <h4><?php _e( 'Better Co-Editing' ); ?></h4> 
    123                         <p><?php _e( 'Have you ever gone to edit a post after someone else has finished with it, only to get an alert that tells you the other person is still editing the post? From now on, you&#039;ll only get that alert if another person is still on the editing screen &mdash; no more time lag.' ); ?></p> 
     121                        <h4><?php _e( 'Widget Improvements' ); ?></h4> 
     122                        <p><?php _e( 'Changing themes often requires widget re-configuration based on the number and position of sidebars. Now if you change back to a previous theme within a week, the widgets will automatically go back to how you had them arranged in that theme. <em>Note: if you&#039;ve added new widgets since the switch, you&#039;ll need to rescue them from the Inactive Widgets area.</em>' ); ?></p> 
    124123                </div> 
    125124        </div> 
    126125         
     
    135134                        <p><?php _e( 'You have more freedom when choosing a post permalink structure. Skip the date information or add a category slug without a performance penalty.' ); ?></p> 
    136135                </div> 
    137136                <div> 
    138                         <h4><?php _e( 'WP_Screen API' ); ?></h4> 
    139                         <p><?php _e( 'WordPress admin screens have a nice new API. Create rich screens with help documentation, settings, and more.' ); ?></p> 
     137                        <h4><?php _e( 'Post Slugs: Less Funky' ); ?></h4> 
     138                        <p><?php _e( 'Funky characters in post titles (e.g. curly quotes from a word processor) will no longer result in garbled post slugs.' ); ?></p> 
    140139                </div> 
    141140                <div class="last-feature"> 
    142141                        <h4><?php _e( 'jQuery and jQuery UI' ); ?></h4> 
     
    150149                        <p><?php _e( 'This handy method will tell you if a <code>WP_Query</code> object is the main WordPress query or a secondary query.' ); ?></p> 
    151150                </div> 
    152151                <div> 
    153                         <h4><?php _e( 'Post Slugs: Less Funky' ); ?></h4> 
    154                         <p><?php _e( 'Funky characters in post titles (e.g. curly quotes from a word processor) will no longer result in garbled post slugs.' ); ?></p> 
     152                        <h4><?php _e( 'WP_Screen API' ); ?></h4> 
     153                        <p><?php _e( 'WordPress admin screens have a nice new API. Create rich screens with help documentation, settings, and more.' ); ?></p> 
    155154                </div> 
    156155                <div class="last-feature"> 
    157156                        <h4><?php _e( 'Editor API Overhaul' ); ?></h4> 
     
    162161</div> 
    163162 
    164163<div class="return-to-dashboard"> 
    165         <a href="<?php echo admin_url(); ?>"><?php _e( 'Go to the Dashboard' ); ?></a> 
     164        <a href="<?php echo admin_url('update-core'); ?>"><?php _e( 'Return to Dashboard &rarr; Updates' ); ?></a> | 
     165        <a href="<?php echo admin_url(); ?>"><?php _e( 'Go to Dashboard &rarr; Home' ); ?></a> 
    166166</div> 
    167167 
    168168</div>