Adjust CSS for new version of bootstrap

static/css/quay.css

@@ -3,6 +3,10 @@
   margin: 0;
 }
 
+.btn {
+  outline: none !important;
+}
+
 @media (max-width: 410px) {
   .olrk-normal {
     display: none;
@@ -159,7 +163,7 @@ nav.navbar-default .navbar-nav>li>a.active {
 
 .notification-view-element .circle {
   position: absolute;
-  top: 14px;
+  top: 15px;
   left: 0px;
 
   width: 12px;
@@ -179,13 +183,13 @@ nav.navbar-default .navbar-nav>li>a.active {
   margin-bottom: 4px;
 }
 
-.notification-view-element .container {
+.notification-view-element .notification-content {
   padding: 10px;
   border-radius: 6px;
   margin-left: 16px;
 }
 
-.notification-view-element .container:hover {
+.notification-view-element .notification-content:hover {
   background: rgba(66, 139, 202, 0.1);
 }
 
@@ -1140,59 +1144,59 @@ i.toggle-icon:hover {
 }
 
 .visible-sm-inline {
-  display: none;
+  display: none !important;
 }
 
 .visible-md-inline {
-  display: none;
+  display: none !important;
 }
 
 .hidden-sm-inline {
-  display: inline;
+  display: inline !important;
 }
 
 .hidden-xs-inline {
-  display: inline;
+  display: inline !important;
 }
 
 @media (min-width: 991px) {
   .visible-md-inline {
-    display: inline;
+    display: inline !important;
   }
 }
 
 @media (max-width: 991px) and (min-width: 768px) {
   .visible-sm-inline {
-    display: inline;
+    display: inline !important;
   }
 
   .hidden-sm-inline {
-    display: none;
+    display: none !important;
   }
 }
 
 @media (max-width: 700px) {
   .hidden-xs-inline {
-    display: none;
+    display: none !important;
   }
 }
 
 
 .visible-xl {
-  display: none;
+  display: none !important;
 }
 
 .visible-xl-inline {
-  display: none;
+  display: none !important;
 }
 
 @media (min-width: 1200px) {
   .visible-xl {
-    display: block;
+    display: block !important;
   }
 
   .visible-xl-inline {
-    display: inline-block;
+    display: inline-block !important;
   }
 }
 
@@ -3762,7 +3766,7 @@ p.editable:hover i {
   text-align: center;
   position: relative;
   color: white;
-  left: -42px;
+  left: -38px;
   top: -9px;
   font-weight: bold;
   font-size: .4em;
@@ -3772,23 +3776,6 @@ p.editable:hover i {
   margin-bottom: 40px;
 }
 
-.landing .social-alternate {
-  color: #777;
-  font-size: 2em;
-  margin-left: 43px;
-  line-height: 1em;
-}
-
-.landing .social-alternate .inner-text {
-  text-align: center;
-  position: relative;
-  color: white;
-  left: -43px;
-  top: -9px;
-  font-weight: bold;
-  font-size: .4em;
-}
-
 .contact-options {
   margin-top: 60px;
 }

static/directives/cor-tab-panel.html

@@ -1,3 +1,3 @@
 <div class="co-main-content-panel co-tab-panel co-fx-box-shadow-heavy">
-    <div class="container co-tab-container" ng-transclude></div>
+    <div class="co-tab-container" ng-transclude></div>
 </div>

static/directives/dockerfile-build-form.html

@@ -1,8 +1,8 @@
 <div class="dockerfile-build-form-element">
-  <div class="container" ng-show="building">
+  <div ng-show="building">
     <div class="quay-spinner"></div>
   </div>
-  <div class="container" ng-show="uploading">
+  <div ng-show="uploading">
     <span class="message">Uploading file {{ upload_file }}</span>
     <div class="progress progress-striped active">
       <div class="progress-bar"  role="progressbar" aria-valuenow="{{ upload_progress }}" aria-valuemin="0" aria-valuemax="100" style="{{ 'width: ' + upload_progress + '%' }}">
@@ -10,7 +10,7 @@
     </div>
   </div>
 
-  <div class="container" ng-show="!uploading && !building">
+  <div ng-show="!uploading && !building">
     <table>
       <tr>
         <td style="vertical-align: middle;">Dockerfile or <code>.tar.gz</code> or <code>.zip</code>:</td>

static/directives/loading-status.html

@@ -1,4 +1,4 @@
-<div class="container loading-status-element">
+<div class="loading-status-element">
   <div ng-show="hasError && !loading">
     <span ng-transclude></span>
   </div>

static/directives/logs-view.html

@@ -1,6 +1,6 @@
 <div class="logs-view-element">
 
-  <div class="container header">
+  <div class="header">
     <span class="header-text">
       <span ng-show="!performer">Usage Logs</span>
       <span class="entity-reference" entity="performer" ng-show="performer"></span>
@@ -20,9 +20,7 @@
     </span>
   </div>
 
-  <div ng-show="loading">
+  <div class="cor-loader-inline" ng-show="loading"></div>
-    <div class="quay-spinner 3x"></div>
-  </div>
   <div ng-show="!loading">
     <div id="bar-chart" style="width: 800px; height: 500px;" ng-show="chartVisible">
       <svg style="width: 800px; height: 500px;"></svg>

static/directives/notification-view.html

@@ -1,5 +1,5 @@
 <div class="notification-view-element">
-  <div class="container" ng-click="showNotification();">
+  <div class="notification-content" ng-click="showNotification();">
     <div class="circle" ng-class="getClass(notification)"></div>
     <div class="message" ng-bind-html="getMessage(notification)"></div>
     <div class="orginfo" ng-if="notification.organization">

static/directives/robots-manager.html

@@ -2,7 +2,7 @@
   <div class="quay-spinner" ng-show="loading"></div>
   <div class="alert alert-info">Robot accounts allow for delegating access in multiple repositories to role-based accounts that you manage</div>
 
-  <div class="container" ng-show="!loading">
+  <div ng-show="!loading">
     <div class="side-controls">
       <span class="popup-input-button" pattern="ROBOT_PATTERN" placeholder="'Robot Account Name'"
             submitted="createRobot(value)">