Changeset 26929

Timestamp:

01/09/2014 04:35:22 PM (11 years ago)

Author:

helen

Message:

Move media modal colors out of colors.css and into media-views.css, as the modal can be triggered on the front end. props avryl, props collinsinternet for the initial patch. see #26677 for trunk.

Location:

trunk/src

Files:

• wp-admin/css/colors.css (modified) (1 diff)
• wp-includes/css/media-views.css (modified) (11 diffs)

trunk/src/wp-admin/css/colors.css

@@ -1843 +1843 @@
 
 /* End Press This and Image editing icons */
-
-/* Media Manager */
-
-.media-modal-content {
-    background: #fcfcfc;
-    box-shadow: 0 5px 15px rgba(0,0,0,0.7);
-}
-
-.media-menu {
-    background: #f3f3f3;
-    border-right-color: #ccc;
-}
-
-.media-menu > a {
-    color: #0074a2;
-}
-
-.media-menu .active,
-.media-menu .active:hover {
-    color: #222;
-}
-
-.media-frame-content {
-    background: #fff;
-    border-top-color: #ddd;
-    border-bottom-color: #ddd;
-}
-
-.media-menu .separator {
-    border-top-color: #ddd;
-    border-bottom: none;
-}
-
-.media-sidebar {
-    background: #f3f3f3;
-    border-color: #ddd;
-}
-
-.media-router .active,
-.media-router > a.active:last-child {
-    background: #fff;
-    border: 1px solid #ddd;
-    border-bottom: none;
-}
-
-.details.attachment {
-    box-shadow: 0 0 0 1px #fff, 0 0 0 5px #1e8cbe;
-}
-
-.attachment .check {
-    background: #eee;
-    box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba( 0, 0, 0, 0.4 );
-}
-
-.attachment.details .check {
-    background-color: #1e8cbe;
-    box-shadow: 0 0 0 1px #fff, 0 0 0 2px #1e8cbe;
-}
 
 /* TinyMCE modal */

trunk/src/wp-includes/css/media-views.css

@@ -2 +2 @@
  * Base Styles
  */
+.media-modal * {
+    -webkit-box-sizing: content-box;
+    -moz-box-sizing:    content-box;
+    box-sizing:         content-box;
+}
+
 .media-modal,
 .media-frame {
@@ -174 +180 @@
     overflow: auto;
     min-height: 300px;
-    background: #fff;
-    -webkit-font-smoothing: subpixel-antialiased; 
+    box-shadow: 0 5px 15px rgba(0,0,0,0.7);
+    background: #fcfcfc;
+    -webkit-font-smoothing: subpixel-antialiased;
 }
 
@@ -233 +240 @@
     padding: 0 16px 24px;
     z-index: 75;
-    background: #f5f5f5;
-    border-left: 1px solid #dfdfdf;
+    background: #f3f3f3;
+    border-left: 1px solid #ddd;
     overflow: auto;
     -webkit-overflow-scrolling: touch;
@@ -390 +397 @@
     margin: 0;
     padding: 16px 0;
+    background: #f3f3f3;
     border-right-width: 1px;
     border-right-style: solid;
+    border-right-color: #ccc;
     -webkit-user-select: none;
     -moz-user-select: none;
@@ -405 +414 @@
     line-height: 18px;
     font-size: 14px;
-    color: #21759B;
+    color: #0074a2;
     text-decoration: none;
 }
@@ -420 +429 @@
 .media-menu .active,
 .media-menu .active:hover {
-    color: #333;
+    color: #222;
     font-weight: bold;
 }
@@ -428 +437 @@
     margin: 12px 20px;
     padding: 0;
-    border-top: 1px solid #dfdfdf;
-    border-bottom: 1px solid #fff;
+    border-top: 1px solid #ddd;
 }
 
@@ -474 +482 @@
 .media-router > a.active:last-child {
     margin: -1px -1px 0;
+    background: #fff;
+    border: 1px solid #ddd;
+    border-bottom: none;
 }
 
@@ -529 +540 @@
     margin: 0;
     overflow: auto;
-    border-top-width: 1px;
-    border-top-style: solid;
-    border-bottom-width: 1px;
-    border-bottom-style: solid;
+    background: #fff;
+    border-top: 1px solid #ddd;
+    border-bottom: 1px solid #ddd;
 }
 
@@ -793 +803 @@
     right: -6px;
     outline: none;
+    background: #eee;
+    box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba( 0, 0, 0, 0.4 );
 }
 
@@ -808 +820 @@
 .attachment.selected .check {
     display: block;
+}
+
+.attachment.details {
+    box-shadow: 0 0 0 1px #fff,
+                0 0 0 5px #1e8cbe;
+}
+
+.attachment.details .check {
+    background-color: #1e8cbe;
+    box-shadow: 0 0 0 1px #fff,
+                0 0 0 2px #1e8cbe;
 }