Changeset 33073

Timestamp:

07/03/2015 08:53:18 PM (10 years ago)

Author:

obenland

Message:

Synchronize star ratings of themes and plugins.

Makes themes ratings look like plugins ratings already do.

Props helen.
Fixes #32782.

Location:

trunk/src/wp-admin

Files:

• css/themes.css (modified) (3 diffs)
• theme-install.php (modified) (1 diff)

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

@@ -1174 +1174 @@
 }
 
-.rating {
+.theme-details .star-rating {
     margin: 15px 0 0;
 }
-.rating span:before {
-    color: #e6b800;
+
+.theme-details .star-rating span:before {
+    color: #ffb900;
     content: "\f154";
     display: inline-block;
@@ -1185 +1186 @@
     vertical-align: top;
 }
+
 /* Half stars */
-.rating-10 span.one:before,
-.rating-30 span.two:before,
-.rating-50 span.three:before,
-.rating-70 span.four:before,
-.rating-90 span.five:before {
+.star-rating.rating-10 span.one:before,
+.star-rating.rating-30 span.two:before,
+.star-rating.rating-50 span.three:before,
+.star-rating.rating-70 span.four:before,
+.star-rating.rating-90 span.five:before {
     content: "\f459";
 }
+
 /* Full stars */
-.rating-20 span.one:before {
+.star-rating.rating-20 span.one:before,
+.star-rating.rating-30 span.one:before,
+.star-rating.rating-40 span.one:before,
+.star-rating.rating-40 span.two:before,
+.star-rating.rating-50 span.one:before,
+.star-rating.rating-50 span.two:before,
+.star-rating.rating-60 span.one:before,
+.star-rating.rating-60 span.two:before,
+.star-rating.rating-60 span.three:before,
+.star-rating.rating-70 span.one:before,
+.star-rating.rating-70 span.two:before,
+.star-rating.rating-70 span.three:before,
+.star-rating.rating-80 span.one:before,
+.star-rating.rating-80 span.two:before,
+.star-rating.rating-80 span.three:before,
+.star-rating.rating-80 span.four:before,
+.star-rating.rating-90 span.one:before,
+.star-rating.rating-90 span.two:before,
+.star-rating.rating-90 span.three:before,
+.star-rating.rating-90 span.four:before,
+.star-rating.rating-100 > span:before {
     content: "\f155";
 }
-.rating-30 span.one:before,
-.rating-40 span.one:before,
-.rating-40 span.two:before {
-    content: "\f155";
-}
-.rating-50 span.one:before,
-.rating-50 span.two:before,
-.rating-60 span.one:before,
-.rating-60 span.two:before,
-.rating-60 span.three:before {
-    content: "\f155";
-}
-.rating-70 span.one:before,
-.rating-70 span.two:before,
-.rating-70 span.three:before,
-.rating-80 span.one:before,
-.rating-80 span.two:before,
-.rating-80 span.three:before,
-.rating-80 span.four:before {
-    content: "\f155";
-}
-.rating-90 span.one:before,
-.rating-90 span.two:before,
-.rating-90 span.three:before,
-.rating-90 span.four:before,
-.rating-100 span.one:before,
-.rating-100 span.two:before,
-.rating-100 span.three:before,
-.rating-100 span.four:before,
-.rating-100 span.five:before {
-    content: "\f155";
-}
-.rating .ratings {
+
+.theme-details .star-rating .ratings {
     display: block;
     line-height: 20px;
@@ -1676 +1668 @@
 }
 
-.theme-details .star-rating {
-    margin: 7px 0;
-    float: right;
-}
-
 .theme-details .theme-description {
     float: left;

trunk/src/wp-admin/theme-install.php

@@ -238 +238 @@
                 <div class="theme-details">
                     <# if ( data.rating ) { #>
-                        <div class="rating rating-{{ Math.round( data.rating / 10 ) * 10 }}">
-                            <span class="one"></span>
-                            <span class="two"></span>
-                            <span class="three"></span>
-                            <span class="four"></span>
-                            <span class="five"></span>
+                        <div class="star-rating rating-{{ Math.round( data.rating / 10 ) * 10 }}">
+                            <span class="one"></span><span class="two"></span><span class="three"></span><span class="four"></span><span class="five"></span>
                             <small class="ratings">{{ data.num_ratings }}</small>
                         </div>
                     <# } else { #>
-                        <div class="rating">
+                        <div class="star-rating">
                             <small class="ratings"><?php _e( 'This theme has not been rated yet.' ); ?></small>
                         </div>