Fixes the Terms Page

app/assets/stylesheets/framework/terms.scss

@@ -11,15 +11,15 @@
     padding-top: $gl-padding;
   }
 
-  .panel {
-    .panel-heading {
+  .card {
+    .card-header {
       display: -webkit-flex;
       display: flex;
       align-items: center;
       justify-content: space-between;
       line-height: $line-height-base;
 
-      .title {
+      .card-title {
         display: flex;
         align-items: center;
 
@@ -34,6 +34,8 @@
 
       .navbar-collapse {
         padding-right: 0;
+        flex-grow: 0;
+        flex-basis: auto;
 
         .navbar-nav {
           margin: 0;

app/views/layouts/terms.html.haml

@@ -14,9 +14,9 @@
 
         %div{ class: "#{container_class} limit-container-width" }
           .content{ id: "content-body" }
-            .panel.panel-default
-              .panel-heading
-                .title
+            .card
+              .card-header
+                .card-title
                   = brand_header_logo
                   - logo_text = brand_header_logo_type
                   - if logo_text.present?

app/views/users/terms/index.html.haml

@@ -1,8 +1,8 @@
 - redirect_params = { redirect: @redirect } if @redirect
 
-.panel-content.rendered-terms
+.card-body.rendered-terms
   = markdown_field(@term, :terms)
-.row-content-block.footer-block.clearfix
+.card-footer.footer-block.clearfix
   - if can?(current_user, :accept_terms, @term)
     .float-right
       = button_to accept_term_path(@term, redirect_params), class: 'btn btn-success prepend-left-8' do