Update commit description styles to monospace font and overflow-x

1 files changed, 16 insertions, 14 deletions

diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss
index ebbac00460c..48e799ffaf9 100644
--- a/app/assets/stylesheets/pages/commits.scss
+++ b/app/assets/stylesheets/pages/commits.scss
@@ -1,9 +1,17 @@
-.commit-description {
-  background: none;
+%commit-description-base {
+  padding: 0 0 0 $gl-padding-8;
+  margin-top: $gl-padding-8;
   border: 0;
-  padding: 0;
+  border-radius: unset;
+  background: none;
   word-break: normal;
-  white-space: pre-wrap;
+  overflow-x: auto;
+  border-left: 2px solid $theme-gray-300;
+  color: $gl-text-color-secondary;
+}
+
+.commit-description {
+  @extend %commit-description-base;
 }
 
 .js-details-expand {
@@ -175,6 +183,7 @@
   justify-content: space-between;
   align-items: start;
   flex-grow: 1;
+  min-width: 0;
 
   .project_namespace {
     color: $gl-text-color-secondary;
@@ -184,6 +193,7 @@
 .commit-content {
   padding-right: 10px;
   white-space: normal;
+  overflow: hidden;
 
   .commit-title {
     display: flex;
@@ -274,17 +284,9 @@
   }
 
   .commit-row-description {
-    font-size: 14px;
-    padding: 0 0 0 $gl-padding-8;
-    border: 0;
+    @extend %commit-description-base;
     display: none;
-    white-space: pre-wrap;
-    word-break: normal;
-    color: $gl-text-color-secondary;
-    background: none;
-    font-family: inherit;
-    border-left: 2px solid $theme-gray-300;
-    border-radius: unset;
+    flex: 1;
 
     a {
       color: $gl-text-color;