5 files changed, 73 insertions, 21 deletions
diff --git a/app/assets/stylesheets/framework/job_log.scss b/app/assets/stylesheets/framework/job_log.scss
new file mode 100644
index 00000000000..5c2491c8233
--- /dev/null
+++ b/app/assets/stylesheets/framework/job_log.scss
@@ -0,0 +1,49 @@
+.job-log {
+  font-family: $monospace-font;
+  padding: $gl-padding-8 $input-horizontal-padding;
+  margin: 0 0 $gl-padding-8;
+  font-size: 13px;
+  word-break: break-all;
+  word-wrap: break-word;
+  color: $gl-text-color-inverted;
+  border-radius: $border-radius-small;
+  min-height: 42px;
+  background-color: $builds-trace-bg;
+}
+
+.line {
+  padding: 1px $gl-padding 1px $job-log-line-padding;
+}
+
+.line-number {
+  color: $gl-text-color-inverted;
+  padding: 0 $gl-padding-8;
+  min-width: $job-line-number-width;
+  margin-left: -$job-line-number-width;
+  padding-right: 1em;
+
+  &:hover,
+  &:active,
+  &:visited {
+    text-decoration: underline;
+    color: $gl-text-color-inverted;
+  }
+}
+
+.collapsible-line {
+  &:hover {
+    background-color: rgba($white-light, 0.2);
+  }
+
+  .arrow {
+    margin-left: -$job-arrow-margin;
+  }
+}
+
+.duration {
+  background: $gl-gray-400;
+}
+
+.loader-animation {
+  @include build-loader-animation;
+}
diff --git a/app/assets/stylesheets/framework/sortable.scss b/app/assets/stylesheets/framework/sortable.scss
index 8c070200135..25868061d04 100644
--- a/app/assets/stylesheets/framework/sortable.scss
+++ b/app/assets/stylesheets/framework/sortable.scss
@@ -90,3 +90,21 @@
     padding: 0;
   }
 }
+
+.is-dragging {
+  // Important because plugin sets inline CSS
+  opacity: 1 !important;
+
+  * {
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    // !important to make sure no style can override this when dragging
+    cursor: grabbing !important;
+  }
+
+  &.no-drop * {
+    cursor: no-drop !important;
+  }
+}
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index faa0a9909d5..e77527ac130 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -606,6 +606,9 @@ $blame-blue: #254e77;
 */
 $builds-trace-bg: #111;
 $job-log-highlight-height: 18px;
+$job-log-line-padding: 62px;
+$job-line-number-width: 40px;
+$job-arrow-margin: 50px;
 
 /*
 * Commit Page
diff --git a/app/assets/stylesheets/pages/boards.scss b/app/assets/stylesheets/pages/boards.scss
index e77a2d1e333..4bf0abccd00 100644
--- a/app/assets/stylesheets/pages/boards.scss
+++ b/app/assets/stylesheets/pages/boards.scss
@@ -2,20 +2,6 @@
   cursor: grab;
 }
 
-.is-dragging {
-  // Important because plugin sets inline CSS
-  opacity: 1 !important;
-
-  * {
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-    // !important to make sure no style can override this when dragging
-    cursor: grabbing !important;
-  }
-}
-
 .is-ghost {
   opacity: 0.3;
   pointer-events: none;
diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss
index c80beceae52..801e9e7204c 100644
--- a/app/assets/stylesheets/pages/projects.scss
+++ b/app/assets/stylesheets/pages/projects.scss
@@ -889,11 +889,7 @@ pre.light-well {
     @include basic-list-stats;
     display: flex;
     align-items: center;
-    padding: $gl-padding 0;
-
-    @include media-breakpoint-up(lg) {
-      padding: $gl-padding 0;
-    }
+    padding: $gl-padding-12 0;
 
     &.no-description {
       @include media-breakpoint-up(sm) {
@@ -909,7 +905,7 @@ pre.light-well {
   }
 
   h2 {
-    font-size: $gl-font-size-large;
+    font-size: $gl-font-size;
     font-weight: $gl-font-weight-bold;
     margin-bottom: 0;
 
@@ -951,6 +947,7 @@ pre.light-well {
 
     .description {
       line-height: 1.5;
+      color: $gl-text-color-secondary;
     }
 
     @include media-breakpoint-down(md) {
@@ -1096,7 +1093,6 @@ pre.light-well {
     &:not(.explore) {
       .forks {
         display: none;
-
       }
     }