Layout the NTP footer with flexboxes.

chrome/browser/resources/ntp4/other_sessions.js

 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @fileoverview The menu that shows tabs from sessions on other devices.
  */
 
 cr.define('ntp', function() {
   'use strict';
@@ skipping 227 matching lines @@
       this.sessions_ = sessionList;
       this.resetMenuContents_();
       if (sessionList.length > 0) {
         // Rebuild the menu with the new data.
         for (var i = 0; i < sessionList.length; i++) {
           this.addSession_(sessionList[i]);
         }
       }
 
       // 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');
     },
 
     /**
      * Called when this element is initialized, and from the new tab page when
      * the user's signed in state changes,
      * @param {boolean} signedIn Is the user currently signed in?
      */
     updateSignInState: function(signedIn) {
       if (signedIn)
         chrome.send('getForeignSessions');
       else
-        this.hidden = true;
+        this.classList.add('invisible');
     },
   };
 
   /**
    * Controller for the context menu for device names in the list of sessions.
    * This class is designed to be used as a singleton.
    *
    * @constructor
    */
   function DeviceContextMenuController() {
@@ skipping 79 matching lines @@
     updateMenuItems_: function() {
       this.collapseItem_.hidden = this.session_.collapsed;
       this.expandItem_.hidden = !this.session_.collapsed;
     }
   };
 
   return {
     OtherSessionsMenuButton: OtherSessionsMenuButton,
   };
 });