Bug 1329941 - [compact layout] Increase tile title background opacity to improve legibility. r=gijs a=jcristau
authorDão Gottwald <dao@mozilla.com>
Tue, 10 Jan 2017 11:39:15 +0100
changeset 357148 6e945963ef7b6b04b33ae6763cde3bde23949809
parent 357147 95d20a617288dde9faff91e847d414bb3403c157
child 357151 6dd3d485a0598df6175e0d0551237b427ba3bf04
push id6762
push userdgottwald@mozilla.com
push dateWed, 11 Jan 2017 14:41:05 +0000
treeherdermozilla-beta@6e945963ef7b [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersgijs, jcristau
bugs1329941
milestone51.0
Bug 1329941 - [compact layout] Increase tile title background opacity to improve legibility. r=gijs a=jcristau
browser/themes/shared/newtab/newTab.inc.css
--- a/browser/themes/shared/newtab/newTab.inc.css
+++ b/browser/themes/shared/newtab/newTab.inc.css
@@ -201,53 +201,50 @@ body:not(.compact) .newtab-site[type=spo
   background-color: #F2F2F2;
   font-size: 13px;
   line-height: 30px;
   border: 1px solid #fff;
   border-radius: 0 0 var(--cell-corner-radius) var(--cell-corner-radius);
 }
 
 body.compact .newtab-title {
-  background-color: hsla(0,0%,100%,.8);
+  background-color: hsla(0,0%,100%,.85);
   font-size: 12px;
   line-height: 21px;
+  border: 1px solid hsla(0,0%,80%,.8);
+  border-top-color: hsla(0,0%,0%,.1);
+  background-clip: padding-box;
 }
 
 .newtab-title,
 .newtab-suggested {
   color: #5c5c5c;
 }
 
 body.compact .newtab-title,
 body.compact .newtab-suggested {
   color: black;
 }
 
-body.compact .newtab-title {
-  border: 1px solid hsla(0,0%,80%,.8);
-  border-top-color: hsla(0,0%,0%,.1);
-  background-clip: padding-box;
-}
-
 .newtab-suggested[active] {
   background-color: rgba(51, 51, 51, 0.95);
   border: 0;
   color: white;
 }
 
 body:not(.compact) .newtab-site:hover .newtab-title {
   color: white;
   background-color: #333;
   border-color: #333;
   border-top-color: white;
 }
 
 body.compact .newtab-site:hover .newtab-title {
   color: white;
-  background-color: hsla(0,0%,20%,.8);
+  background-color: hsla(0,0%,20%,.85);
   border-color: hsla(0,0%,0%,.8);
   border-top-color: white;
 }
 
 .newtab-site[pinned] .newtab-title {
   padding-inline-start: 24px;
 }