Make WordPress Core

Ticket #27423: 27423.4.patch

File 27423.4.patch, 3.6 KB (added by iseulde, 11 years ago)
  • src/wp-includes/css/media-views.css

     
    683683 */
    684684.attachments {
    685685        margin: 0;
    686         padding-right: 16px;
     686        padding: 8px;
    687687        -webkit-overflow-scrolling: touch;
    688688}
    689689
     
    705705}
    706706
    707707.attachment:focus {
     708        outline: none;
     709}
     710
     711.attachment:focus .attachment-preview {
    708712        -webkit-box-shadow:
    709713                0 0 0 1px #5b9dd9,
    710714                0 0 2px 2px #5b9dd9;
    711715        box-shadow:
    712716                0 0 0 1px #5b9dd9,
    713717                0 0 2px 2px #5b9dd9;
    714         outline: none;
    715718}
    716719
    717 .selected.attachment {
     720.selected.attachment .attachment-preview {
    718721        -webkit-box-shadow:
    719722                0 0 0 1px #fff,
    720723                0 0 0 3px #ccc;
     
    725728
    726729.attachment-preview {
    727730        position: relative;
    728         width: 199px;
    729         height: 199px;
    730731        -webkit-box-shadow:
    731732                inset 0 0 15px rgba( 0, 0, 0, 0.1 ),
    732733                inset 0 0 0 1px rgba( 0, 0, 0, 0.05 );
     
    904905        display: block;
    905906}
    906907
    907 .attachment.details,
     908.attachment.details .attachment-preview,
    908909.media-grid-view .selected.attachment {
    909910        -webkit-box-shadow: 0 0 0 1px #fff,
    910911                                0 0 0 5px #1e8cbe;
     
    14561457.media-selection .attachments {
    14571458        display: inline-block;
    14581459        height: 48px;
    1459         margin-top: 5px;
    14601460        overflow: hidden;
    14611461        vertical-align: top;
    14621462}
     
    28792879        }
    28802880}
    28812881
     2882/**/
     2883
     2884.attachments-browser .attachment {
     2885        position: relative;
     2886        width: 20%;
     2887        margin: 0;
     2888}
     2889
     2890.attachments-browser .attachment:before {
     2891        content: '';
     2892        display: block;
     2893        padding-top: 100%;
     2894}
     2895
     2896.attachments-browser .attachment .attachment-preview {
     2897        position: absolute;
     2898        top: 8px;
     2899        right: 8px;
     2900        bottom: 8px;
     2901        left: 8px;
     2902}
     2903
     2904.attachments-browser .portrait img {
     2905        max-width: 100%;
     2906}
     2907
     2908.attachments-browser .landscape img {
     2909        max-height: 100%;
     2910}
     2911
     2912/**/
     2913
     2914.media-selection .attachments {
     2915        padding: 5px;
     2916}
     2917
     2918.media-selection .attachment {
     2919        margin: 5px;
     2920        width: 40px;
     2921}
     2922
     2923.media-selection .attachment-preview,
     2924.media-selection .attachment-preview .thumbnail {
     2925        width: 40px;
     2926        height: 40px;
     2927}
     2928
     2929.media-selection .portrait .thumbnail img {
     2930        max-width: 40px;
     2931        height: auto;
     2932}
     2933
     2934.media-selection .landscape .thumbnail img {
     2935        width: auto;
     2936        max-height: 40px;
     2937}
     2938
     2939/* 2 per row for small screens. But we should hide the sidebar, so we can display more. I think 3/4 would be a good number. */
     2940@media only screen and ( max-width: 640px ) {
     2941        .attachments-browser .attachment {
     2942                width: 50%;
     2943        }
     2944}
     2945
     2946@media only screen and ( min-width: 640px ) and ( max-width: 960px ) {
     2947        .attachments-browser .attachment {
     2948                width: 33.3%%;
     2949        }
     2950}
     2951
     2952@media only screen and ( min-width: 960px ) and ( max-width: 1200px ) {
     2953        .attachments-browser .attachment {
     2954                width: 25%;
     2955        }
     2956}
     2957
     2958@media only screen and ( min-width: 1200px ) {
     2959        .attachments-browser .attachment {
     2960                width: 20%;
     2961        }
     2962}
     2963
     2964/* etc. etc. At a certain width we can stop, images will just get bigger... */
  • src/wp-includes/js/media-views.js

     
    51495149
    51505150                        this.initSortable();
    51515151
    5152                         _.bindAll( this, 'css' );
     5152                        /*_.bindAll( this, 'css' );
    51535153                        this.model.on( 'change:edge change:gutter', this.css, this );
    51545154                        this._resizeCss = _.debounce( _.bind( this.css, this ), this.refreshSensitivity );
    51555155                        if ( this.options.resize ) {
     
    51585158
    51595159                        // Call this.css() after this view has been rendered in the DOM so
    51605160                        // attachments get proper width applied.
    5161                         _.defer( this.css, this );
     5161                        _.defer( this.css, this );*/
    51625162                },
    51635163
    51645164                dispose: function() {