Layout the NTP footer with flexboxes.

chrome/browser/resources/ntp4/other_sessions.js

Index: chrome/browser/resources/ntp4/other_sessions.js
diff --git a/chrome/browser/resources/ntp4/other_sessions.js b/chrome/browser/resources/ntp4/other_sessions.js
index e536e6ef3d51b6cbbba29352abb6f416cd9e652f..8386bb80e00dad145194c582971e61758284c93b 100644
--- a/chrome/browser/resources/ntp4/other_sessions.js
+++ b/chrome/browser/resources/ntp4/other_sessions.js
@@ -245,7 +245,10 @@ cr.define('ntp', function() {
       }
 
       // The menu button is shown iff tab sync is enabled.
-      this.hidden = !isTabSyncEnabled;
+      if (isTabSyncEnabled)

[Dan Beam, 2013/01/31 20:22:11]

if we end up keeping .invisible

  this.classList.toggle(isTabSyncEnabled, 'invisible');

[dconnelly, 2013/02/04 16:40:45]

This doesn't work.  It coerces the first argument to a string and toggles it,
which in this case just adds "true" or "false" to the class list.

On 2013/01/31 20:22:11, Dan Beam wrote:

[Dan Beam, 2013/02/04 19:01:10]

sorry, meant:
this.classList.toggle('invisible', isTabSyncEnabled);

+        this.classList.remove('invisible');
+      else
+        this.classList.add('invisible');
     },
 
     /**
@@ -257,7 +260,7 @@ cr.define('ntp', function() {
       if (signedIn)
         chrome.send('getForeignSessions');
       else
-        this.hidden = true;
+        this.classList.add('invisible');
     },
   };