move login widget style to css

IPython/html/static/auth/js/loginwidget.js

@@ -1,47 +1,45 b''
 // Copyright (c) IPython Development Team.
 // Distributed under the terms of the Modified BSD License.
 
 define([
     'base/js/namespace',
     'base/js/utils',
     'jquery',
 ], function(IPython, utils, $){
     "use strict";
 
     var LoginWidget = function (selector, options) {
         options = options || {};
         this.base_url = options.base_url || utils.get_body_data("baseUrl");
         this.selector = selector;
         if (this.selector !== undefined) {
             this.element = $(selector);
             this.style();
             this.bind_events();
         }
     };
 
-    LoginWidget.prototype.style = function () {
-        this.element.find("button").addClass("btn btn-default btn-sm");
-    };
+    LoginWidget.prototype.style = function () {};
 
 
     LoginWidget.prototype.bind_events = function () {
         var that = this;
         this.element.find("button#logout").click(function () {
             window.location = utils.url_join_encode(
                 that.base_url,
                 "logout"
             );
         });
         this.element.find("button#login").click(function () {
             window.location = utils.url_join_encode(
                 that.base_url,
                 "login"
             );
         });
     };
 
     // Set module variables
     IPython.LoginWidget = LoginWidget;
 
     return {'LoginWidget': LoginWidget};
-});
  No newline at end of file
+});

IPython/html/static/base/less/page.less

@@ -1,102 +1,108 b''
 /**
  * Primary styles
  *
  * Author: IPython Development Team
  */
 
 
 body {
     background-color: white;
     /* This makes sure that the body covers the entire window and needs to
        be in a different element than the display: box in wrapper below */
     position: absolute;
     left: 0px;
     right: 0px;
     top: 0px;
     bottom: 0px;
     overflow: visible;
 }
 
 div#header {
     /* Initially hidden to prevent FLOUC */
     display: none;
     margin-bottom: 0px;
     padding-left: 30px;
     padding-bottom: 5px;
     border-bottom: 1px solid @navbar-default-border;
     .border-box-sizing();
 }
 
 #ipython_notebook {
     padding-left: 0px;
 }
 
 #noscript {
      width: auto;
      padding-top: 16px;
      padding-bottom: 16px;
      text-align: center;
      font-size: 22px;
      color: red;
      font-weight: bold;
 }
 
 #ipython_notebook img {
     font-family: Verdana, "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
     height: 24px;
     text-decoration:none;
     color: black;
 }
 
 #site {
     width: 100%;
     display: none;
     .border-box-sizing();
 }
 
 /* Smaller buttons */
 .ui-button .ui-button-text {
     padding: 0.2em 0.8em;
     font-size: 77%;
 }
 
 input.ui-button {
     padding: 0.3em 0.9em;
 }
 .navbar span {
   margin-top: 3px;
 }
 
 span#login_widget {
     float: right;
 }
 
+span#login_widget > .button {
+    .btn();
+    .btn-default();
+    .btn-sm();
+}
+
 .nav-header {
     text-transform: none;
 }
 
 #header > span {
   margin-top: 10px;
 }
 
 // class for stretching dialogs to fill the screen
 .modal_stretch .modal-dialog {
     .vbox();
     min-height: 80%;
     .modal-body {
         max-height: none;
         flex: 1;
     }
 }
 
 @media (min-width: 768px) {
     .modal .modal-dialog {
         width: 700px;
     }
 }
 
 // less mixin to be sure to add the right class to get icons with font awesome.
 .icon(@ico){
     .fa();
     content: @ico;
 }