From b61f6f3a60b7d5627b2888cd7ffffb46f87f21d6 Mon Sep 17 00:00:00 2001 From: Sergey Biryukov Date: Tue, 13 Jan 2015 07:15:24 +0000 Subject: [PATCH] Scope attachment selectors in media views to avoid interfering with attachment pages on front-end. props valendesigns. fixes #30878. git-svn-id: https://develop.svn.wordpress.org/trunk@31174 602fd350-edb4-49c9-b593-d223f7449a82 --- src/wp-includes/css/media-views.css | 76 ++++++++++++++--------------- 1 file changed, 38 insertions(+), 38 deletions(-) diff --git a/src/wp-includes/css/media-views.css b/src/wp-includes/css/media-views.css index 23ba132f54..c7a5ce4228 100644 --- a/src/wp-includes/css/media-views.css +++ b/src/wp-includes/css/media-views.css @@ -761,7 +761,7 @@ /** * Attachments */ -.attachments { +.wp-core-ui .attachments { margin: 0; -webkit-overflow-scrolling: touch; } @@ -769,7 +769,7 @@ /** * Attachment */ -.attachment { +.wp-core-ui .attachment { position: relative; float: left; padding: 8px; @@ -788,9 +788,9 @@ box-sizing: border-box; } -.attachment:focus, -.selected.attachment:focus, -.attachment.details:focus { +.wp-core-ui .attachment:focus, +.wp-core-ui .selected.attachment:focus, +.wp-core-ui .attachment.details:focus { -webkit-box-shadow: inset 0 0 2px 3px #fff, inset 0 0 0 7px #5b9dd9; @@ -800,7 +800,7 @@ outline: none; } -.selected.attachment { +.wp-core-ui .selected.attachment { -webkit-box-shadow: inset 0 0 0 5px #fff, inset 0 0 0 7px #ccc; @@ -809,7 +809,7 @@ inset 0 0 0 7px #ccc; } -.attachment.details { +.wp-core-ui .attachment.details { -webkit-box-shadow: inset 0 0 0 3px #fff, inset 0 0 0 7px #1e8cbe; @@ -818,7 +818,7 @@ inset 0 0 0 7px #1e8cbe; } -.attachment-preview { +.wp-core-ui .attachment-preview { position: relative; -webkit-box-shadow: inset 0 0 15px rgba( 0, 0, 0, 0.1 ), @@ -830,18 +830,18 @@ cursor: pointer; } -.attachment-preview:before { +.wp-core-ui .attachment-preview:before { content: ''; display: block; padding-top: 100%; } -.attachment .icon { +.wp-core-ui .attachment .icon { margin: 0 auto; overflow: hidden; } -.attachment .thumbnail { +.wp-core-ui .attachment .thumbnail { overflow: hidden; position: absolute; top: 0; @@ -853,15 +853,15 @@ transition: opacity .1s; } -.attachment .portrait img { +.wp-core-ui .attachment .portrait img { max-width: 100%; } -.attachment .landscape img { +.wp-core-ui .attachment .landscape img { max-height: 100%; } -.attachment .thumbnail:after { +.wp-core-ui .attachment .thumbnail:after { content: ''; display: block; position: absolute; @@ -875,13 +875,13 @@ } /* @noflip */ -.attachment .thumbnail img { +.wp-core-ui .attachment .thumbnail img { top: 0; left: 0; } /* @noflip */ -.attachment .thumbnail .centered { +.wp-core-ui .attachment .thumbnail .centered { position: absolute; top: 0; left: 0; @@ -892,24 +892,24 @@ transform: translate( 50%, 50% ); } -.attachment .thumbnail .centered img { +.wp-core-ui .attachment .thumbnail .centered img { -webkit-transform: translate( -50%, -50% ); -ms-transform: translate(-50%,-50%); transform: translate( -50%, -50% ); } -.attachment .thumbnail .centered img.icon { +.wp-core-ui .attachment .thumbnail .centered img.icon { -webkit-transform: translate( -50%, -70% ); -ms-transform: translate(-50%,-70%); transform: translate( -50%, -70% ); } -.ie8 .attachment img.icon { +.ie8 .wp-core-ui .attachment img.icon { top: 20%; position: relative; } -.attachment .filename { +.wp-core-ui .attachment .filename { position: absolute; left: 0; right: 0; @@ -924,15 +924,15 @@ box-shadow: inset 0 0 0 1px rgba( 0, 0, 0, 0.15 ); } -.attachment .filename div { +.wp-core-ui .attachment .filename div { padding: 5px 10px; } -.attachment .thumbnail img { +.wp-core-ui .attachment .thumbnail img { position: absolute; } -.attachment .close { +.wp-core-ui .attachment .close { display: block; position: absolute; top: 5px; @@ -958,15 +958,15 @@ transition-property: none; } -.attachment a.close:hover, -.attachment a.close:focus { +.wp-core-ui .attachment a.close:hover, +.wp-core-ui .attachment a.close:focus { -webkit-box-shadow: 0 0 0 1px rgba( 0, 0, 0, 0.6 ); box-shadow: 0 0 0 1px rgba( 0, 0, 0, 0.6 ); background-position: -36px 4px; } -.attachment .check { +.wp-core-ui .attachment .check { display: none; height: 24px; width: 24px; @@ -980,24 +980,24 @@ box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba( 0, 0, 0, 0.15 ); } -.attachment .check div { +.wp-core-ui .attachment .check div { background-position: -1px 0; height: 15px; width: 15px; margin: 5px; } -.attachment .check:hover div { +.wp-core-ui .attachment .check:hover div { background-position: -40px 0; } -.attachment.selected .check { +.wp-core-ui .attachment.selected .check { display: block; } -.attachment.details .check, -.attachment.selected .check:focus, -.media-frame.mode-grid .attachment.selected .check { +.wp-core-ui .attachment.details .check, +.wp-core-ui .attachment.selected .check:focus, +.wp-core-ui .media-frame.mode-grid .attachment.selected .check { background-color: #1e8cbe; -webkit-box-shadow: 0 0 0 1px #fff, @@ -1007,18 +1007,18 @@ 0 0 0 2px #1e8cbe; } -.attachment.details .check div, -.media-frame.mode-grid .attachment.selected .check div { +.wp-core-ui .attachment.details .check div, +.wp-core-ui .media-frame.mode-grid .attachment.selected .check div { background-position: -21px 0; } -.attachment.details .check:hover div, -.attachment.selected .check:focus div, -.media-frame.mode-grid .attachment.selected .check:hover div { +.wp-core-ui .attachment.details .check:hover div, +.wp-core-ui .attachment.selected .check:focus div, +.wp-core-ui .media-frame.mode-grid .attachment.selected .check:hover div { background-position: -60px 0; } -.media-frame .attachment .describe { +.wp-core-ui .media-frame .attachment .describe { position: relative; display: block; width: 100%;