WordPress.org

Make WordPress Core

Changeset 26229


Ignore:
Timestamp:
11/15/2013 09:46:14 PM (7 years ago)
Author:
iammattthomas
Message:

Move media uploader responsive styles from wp-admin.css to media-views.css; clean up duplicated media queries. See #25977.

Location:
trunk/src
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-admin/css/wp-admin.css

    r26223 r26229  
    1189611896    }
    1189711897
    11898     .media-frame-menu {
    11899         width: auto;
    11900         bottom: auto;
    11901         right: 0;
    11902         height: 60px;
    11903     }
    11904 
    11905     .media-menu {
    11906         border-right: none;
    11907         position: relative;
    11908         border-bottom: 1px solid #dddddd;
    11909         overflow: hidden;
    11910         padding: 10px 0 10px 10px;
    11911     }
    11912 
    11913     .media-menu a {
    11914         float: left;
    11915         width: 42%;
    11916         white-space: nowrap;
    11917         text-overflow: ellipsis;
    11918         overflow: hidden;
    11919     }
    11920    
    11921     /* Shorten right-side links so they don't overlap the close button */
    11922     .media-menu a:nth-child(2),
    11923     .media-menu a:last-child {
    11924         width: 40%;
    11925     }
    11926 
    11927     .media-menu .separator {
    11928         display: none;
    11929     }
    11930 
    11931     .media-frame-title {
    11932         top: 72px;
    11933         left: auto;
    11934         height: auto;
    11935     }
    11936 
    11937     .media-frame-title h1 {
    11938         line-height: 3;
    11939         font-size: 18px;
    11940     }
    11941 
    11942     .media-frame-router {
    11943         top: 84px;
    11944         left: 0;
    11945     }
    11946    
    11947     .media-frame-content {
    11948         left: 0;
    11949         top: 118px;
    11950     }
    11951 
    11952     .media-frame .attachments-browser {
    11953         padding-bottom: 300px;
    11954     }
    11955    
    11956     .media-sidebar {
    11957         border-bottom: 1px solid #dddddd;
    11958     }
    11959    
    11960     .media-modal {
    11961         width: auto;
    11962     }
    11963 
    11964     .media-toolbar-primary, .media-toolbar-secondary {
    11965         height: auto;
    11966     }
    11967 
    11968     .uploader-inline h3 {
    11969         margin: 0 0 .8em 0;
    11970     }
    11971 
    11972     .uploader-inline-content {
    11973         top: auto;
    11974     }
    11975 
    11976     .uploader-inline-content .upload-ui {
    11977         margin: 0;
    11978     }
    11979 
    11980     .attachments-browser .attachments, .attachments-browser .uploader-inline {
    11981         position: relative;
    11982         margin-right: 180px;
    11983     }
    11984 
    1198511898    /* Links */
    1198611899    .link-manager-php #posts-filter {
     
    1240812321    }
    1240912322
     12323    /* Align Add Media + Visual + Text tabs */
     12324    #wp-content-media-buttons a {
     12325        font-size: 14px;
     12326        padding: 0 10px 0 10px;
     12327    }
    1241012328}
    1241112329
     
    1245212370}
    1245312371
    12454 /* Tiny screens [ = smaller than 500 wide] */
    12455 @media screen and (max-width: 500px) {
    12456     /* Align Add Media + Visual + Text tabs */
    12457     #wp-content-media-buttons a {
    12458         font-size: 14px;
    12459         padding: 0 10px 0 10px;
    12460     }
    12461 
    12462     .media-modal {
    12463         position: fixed;
    12464         top: 0;
    12465         left: 0;
    12466         right: 0;
    12467         bottom: 0;
    12468     }
    12469 
    12470     .media-modal-backdrop {
    12471         position: fixed;
    12472     }
    12473 
    12474     .attachments-browser .attachment,
    12475     .attachments-browser .attachment-preview {
    12476         max-width: 100%;
    12477     }
    12478 
    12479     .attachments-browser .media-toolbar-primary input.search {
    12480         max-width: 150px;
    12481     }
    12482 
    12483     .uploader-inline-content {
    12484         position: relative;
    12485     }
    12486 
    12487     .media-sidebar .setting input[type="checkbox"],
    12488     .media-sidebar .field input[type="checkbox"] {
    12489         width: 25px;
    12490     }
    12491 
    12492     /* Don't bother with title for phone-size */
    12493     .media-frame-title {
    12494         display: none;
    12495     }
    12496    
    12497     .media-frame-toolbar {
    12498         position: absolute;
    12499         bottom: 0px;
    12500         left: 0;
    12501         right: 0;
    12502         background: #FFF;
    12503         border-top: 1px solid #DEDEDE;
    12504     }
    12505 
    12506     .media-toolbar {
    12507         position: relative;
    12508     }
    12509 
    12510     .media-frame {
    12511         overflow: hidden;
    12512     }
    12513 
    12514     .attachments-browser .attachments {
    12515         top: 42px;
    12516     }
    12517 
    12518     .attachment-details h3 {
    12519         margin-top: 45px;
    12520     }
    12521 
    12522     /* Image From Link */
    12523     .embed-link-settings,
    12524     .embed-image-settings {
    12525         padding-bottom: 52px;
    12526     }
    12527 
    12528     /* Gallery */
    12529     .media-frame.hide-router .media-frame-content {
    12530         top: 73px;
    12531         border-top: none;
    12532     }
    12533 
    12534     .gallery-settings h3 {
    12535         margin-top: 45px;
    12536     }
    12537 }
    12538 
    1253912372/* Smartphone */
    1254012373@media screen and (max-width: 480px) {
  • trunk/src/wp-includes/css/media-views.css

    r26219 r26229  
    16261626}
    16271627
    1628 @media only screen and (max-width: 800px) {
     1628@media only screen and (max-width: 782px) {
    16291629    .media-frame-content .media-toolbar .instructions {
    16301630        display: none;
     1631    }
     1632
     1633    .media-frame-menu {
     1634        width: auto;
     1635        bottom: auto;
     1636        right: 0;
     1637        height: 60px;
     1638    }
     1639
     1640    .media-menu {
     1641        border-right: none;
     1642        position: relative;
     1643        border-bottom: 1px solid #dddddd;
     1644        overflow: hidden;
     1645        padding: 10px 0 10px 10px;
     1646    }
     1647
     1648    .media-menu a {
     1649        float: left;
     1650        width: 42%;
     1651        white-space: nowrap;
     1652        text-overflow: ellipsis;
     1653        overflow: hidden;
     1654    }
     1655   
     1656    /* Shorten right-side links so they don't overlap the close button */
     1657    .media-menu a:nth-child(2),
     1658    .media-menu a:last-child {
     1659        width: 40%;
     1660    }
     1661
     1662    .media-menu .separator {
     1663        display: none;
     1664    }
     1665
     1666    .media-frame-title {
     1667        top: 72px;
     1668        left: auto;
     1669        height: auto;
     1670    }
     1671
     1672    .media-frame-title h1 {
     1673        line-height: 3;
     1674        font-size: 18px;
     1675    }
     1676
     1677    .media-frame-router {
     1678        top: 84px;
     1679        left: 0;
     1680    }
     1681   
     1682    .media-frame-content {
     1683        left: 0;
     1684        top: 118px;
     1685    }
     1686
     1687    .media-frame .attachments-browser {
     1688        padding-bottom: 300px;
     1689    }
     1690   
     1691    .media-sidebar {
     1692        border-bottom: 1px solid #dddddd;
     1693    }
     1694   
     1695    .media-modal {
     1696        width: auto;
     1697    }
     1698
     1699    .media-toolbar-primary, .media-toolbar-secondary {
     1700        height: auto;
     1701    }
     1702
     1703    .uploader-inline h3 {
     1704        margin: 0 0 .8em 0;
     1705    }
     1706
     1707    .uploader-inline-content {
     1708        top: auto;
     1709    }
     1710
     1711    .uploader-inline-content .upload-ui {
     1712        margin: 0;
     1713    }
     1714
     1715    .attachments-browser .attachments, .attachments-browser .uploader-inline {
     1716        position: relative;
     1717        margin-right: 180px;
    16311718    }
    16321719}
     
    16391726}
    16401727
    1641 /* Use the same min-width as in the admin */
    1642 @media only screen and (max-width: 600px) {
     1728/* Tiny screens [ = smaller than 500 wide] */
     1729@media screen and (max-width: 500px) {
    16431730    .media-modal {
    1644         width: 540px;
     1731        position: fixed;
     1732        top: 0;
     1733        left: 0;
     1734        right: 0;
     1735        bottom: 0;
     1736    }
     1737
     1738    .media-modal-backdrop {
     1739        position: fixed;
     1740    }
     1741
     1742    .attachments-browser .attachment,
     1743    .attachments-browser .attachment-preview {
     1744        max-width: 100%;
     1745    }
     1746
     1747    .attachments-browser .media-toolbar-primary input.search {
     1748        max-width: 150px;
     1749    }
     1750
     1751    .uploader-inline-content {
     1752        position: relative;
     1753    }
     1754
     1755    .media-sidebar .setting input[type="checkbox"],
     1756    .media-sidebar .field input[type="checkbox"] {
     1757        width: 25px;
     1758    }
     1759
     1760    /* Don't bother with title for phone-size */
     1761    .media-frame-title {
     1762        display: none;
     1763    }
     1764   
     1765    .media-frame-toolbar {
    16451766        position: absolute;
    1646     }
    1647 
    1648     .media-modal-backdrop {
    1649         width: 600px;
    1650         position: absolute;
     1767        bottom: 0px;
     1768        left: 0;
     1769        right: 0;
     1770        background: #FFF;
     1771        border-top: 1px solid #DEDEDE;
     1772    }
     1773
     1774    .media-toolbar {
     1775        position: relative;
     1776    }
     1777
     1778    .media-frame {
     1779        overflow: hidden;
     1780    }
     1781
     1782    .attachments-browser .attachments {
     1783        top: 42px;
     1784    }
     1785
     1786    .attachment-details h3 {
     1787        margin-top: 45px;
     1788    }
     1789
     1790    /* Image From Link */
     1791    .embed-link-settings,
     1792    .embed-image-settings {
     1793        padding-bottom: 52px;
     1794    }
     1795
     1796    /* Gallery */
     1797    .media-frame.hide-router .media-frame-content {
     1798        top: 73px;
     1799        border-top: none;
     1800    }
     1801
     1802    .gallery-settings h3 {
     1803        margin-top: 45px;
    16511804    }
    16521805}
Note: See TracChangeset for help on using the changeset viewer.