Bug 1380738 - Fix the size of the avatar to avoid reflow. r?eoger draft
authorLuciano Italiani <lyretandrpg@gmail.com>
Tue, 25 Jul 2017 13:53:08 -0300
changeset 615469 6c2fa907e096
parent 615176 32d9d1e81cc6
child 639190 b260bc4b467b
push id70373
push userbmo:lyretandrpg@gmail.com
push dateWed, 26 Jul 2017 01:38:47 +0000
reviewerseoger
bugs1380738
milestone56.0a1
Bug 1380738 - Fix the size of the avatar to avoid reflow. r?eoger MozReview-Commit-ID: 5MWoxolsiJd
browser/themes/shared/incontentprefs-old/preferences.inc.css
browser/themes/shared/incontentprefs/preferences.inc.css
--- a/browser/themes/shared/incontentprefs-old/preferences.inc.css
+++ b/browser/themes/shared/incontentprefs-old/preferences.inc.css
@@ -377,26 +377,28 @@ description > html|a {
   min-width: 30ch;
 }
 
 /**
  * Sync
  */
 
 #fxaProfileImage {
-  max-width: 60px;
+  width: 60px;
+  height: 60px;
   border-radius: 50%;
   list-style-image: url(chrome://browser/skin/fxa/default-avatar.svg);
   margin-inline-end: 15px;
   image-rendering: auto;
   border: 1px solid transparent;
 }
 
 #fxaLoginStatus[hasName] #fxaProfileImage {
-  max-width: 80px;
+  width: 80px;
+  height: 80px;
 }
 
 #fxaProfileImage.actionable {
   cursor: pointer;
 }
 
 #fxaProfileImage.actionable:hover {
   border-color: #0095DD;
@@ -513,17 +515,18 @@ description > html|a {
 #fxaEmailAddress1,
 #fxaEmailAddress2,
 #fxaEmailAddress3 {
   word-break: break-all;
 }
 
 .fxaFirefoxLogo {
   list-style-image: url(chrome://browser/skin/fxa/logo.png);
-  max-width: 64px;
+  width: 64px;
+  height: 64px;
   margin-inline-end: 14px;
 }
 
 .fxaMobilePromo {
   margin-bottom: 20px;
   margin-top: 25px;
 }
 
--- a/browser/themes/shared/incontentprefs/preferences.inc.css
+++ b/browser/themes/shared/incontentprefs/preferences.inc.css
@@ -397,26 +397,28 @@ groupbox {
   min-width: 30ch;
 }
 
 /**
  * Sync
  */
 
 #fxaProfileImage {
-  max-width: 60px;
+  width: 60px;
+  height: 60px;
   border-radius: 50%;
   list-style-image: url(chrome://browser/skin/fxa/default-avatar.svg);
   margin-inline-end: 15px;
   image-rendering: auto;
   border: 1px solid transparent;
 }
 
 #fxaLoginStatus[hasName] #fxaProfileImage {
-  max-width: 80px;
+  width: 80px;
+  height: 80px;
 }
 
 #fxaProfileImage.actionable {
   cursor: pointer;
 }
 
 #fxaProfileImage.actionable:hover {
   border-color: #0095DD;
@@ -533,17 +535,18 @@ groupbox {
 #fxaEmailAddress1,
 #fxaEmailAddress2,
 #fxaEmailAddress3 {
   word-break: break-all;
 }
 
 .fxaFirefoxLogo {
   list-style-image: url(chrome://browser/skin/fxa/logo.png);
-  max-width: 64px;
+  width: 64px;
+  height: 64px;
   margin-inline-end: 14px;
 }
 
 .fxaMobilePromo {
   margin-bottom: 20px;
   margin-top: 25px;
 }