Fix bootstrap CSS issues in Safari and Chrome

app/assets/javascripts/editor/editor.js.erb

@@ -84,7 +84,7 @@ configureEditors: function () {
     if (result.stderr && !result.score) {
       return 'card bg-danger text-white';
     } else if (result.score < 1) {
-      return 'card bg-warning';
+      return 'card bg-warning text-white';
     } else {
       return 'card bg-success text-white';
     }

app/assets/stylesheets/base.css.scss

@@ -15,15 +15,24 @@ i.fa {
 pre {
   background-color: #FAFAFA;
   margin: 0;
-  padding: 0;
+  padding: .25rem!important;
+  border: 1px solid #CCCCCC;
 }
 
 span.caret {
   margin-left: 0.5em;
 }
 
+btn {
+  -webkit-font-smoothing: antialiased;
+  font-weight: 500;
+}
+
 .progress {
   margin: 0;
+  border: 1px solid #CCCCCC;
+  padding: 0.125rem !important;
+  height: 1.25rem !important;
 
   .progress-bar {
     line-height: initial;
@@ -32,6 +41,11 @@ span.caret {
   }
 }
 
+.nav-link {
+  -webkit-font-smoothing: antialiased;
+  font-weight: 500;
+}
+
 .attribute-row + .attribute-row {
   margin-top: 0.5em;
 }

app/assets/stylesheets/editor.css.scss

@@ -45,10 +45,6 @@ button i.fa-spin {
   width: 100%;
   display: flex;
 
-  button {
-    font-size: 80%;
-  }
-
   button, .btn-group {
     flex-grow: 1;
   }

app/views/exercises/_editor_button.html.slim

@@ -1,4 +1,4 @@
-button.btn class=local_assigns.fetch(:classes, 'btn-primary btn-lg') *local_assigns.fetch(:data, {}) disabled=local_assigns.fetch(:disabled, false) id=id title=local_assigns[:title] type='button'
+button.btn class=local_assigns.fetch(:classes, 'btn-primary') *local_assigns.fetch(:data, {}) disabled=local_assigns.fetch(:disabled, false) id=id title=local_assigns[:title] type='button'
   i.fa.fa-circle-o-notch.fa-spin
   i class=(label.present? ? icon : "#{icon} m-0")
   = label

app/views/exercises/_editor_output.html.slim

@@ -40,7 +40,7 @@ div.h-100 id='output_sidebar_uncollapsed' class='d-none col-sm-12 enforce-bottom
           canvas#turtlecanvas.d-none width=400 height=400
       div.enforce-big-top-margin
         #hint
-          .card.bg-warning
+          .card.bg-warning.text-white
             .card-header = t('exercises.implement.hint')
             .card-body
       div.enforce-big-top-margin

app/views/exercises/implement.html.slim

@@ -2,7 +2,7 @@
   #editor-column.col-md-12
     .exercise.clearfix
       div
-        span.badge.badge-pill.float-right.score
+        span.badge.badge-pill.badge-primary.float-right.score
 
         h1 id="exercise-headline"
           i class="fa fa-chevron-down" id="description-symbol"

app/views/user_exercise_feedbacks/_form.html.slim

@@ -1,6 +1,6 @@
 = form_for(@uef) do |f|
   div
-    span.badge.badge-pill.float-right.score
+    span.badge.badge-pill.badge-primary.float-right.score
 
     h1 id="exercise-headline"
       = t('activerecord.models.user_exercise_feedback.one') + " "