Markdown renderer

Gemfile

@@ -19,6 +19,8 @@ gem 'chronic_duration'
 gem 'datey'
 gem 'nifty-attachments'
 gem 'puma'
+gem 'redcarpet'
+gem 'rouge'
 gem 'moonrope'
 gem 'florrick'
 gem 'delayed_job_active_record'

Gemfile.lock

@@ -188,6 +188,7 @@ GEM
     rb-inotify (0.9.10)
       ffi (>= 0.5.0, < 2)
     redcarpet (3.4.0)
+    rouge (3.1.1)
     sass (3.5.5)
       sass-listen (~> 4.0.0)
     sass-listen (4.0.0)
@@ -251,6 +252,7 @@ DEPENDENCIES
   rails (~> 5.1)
   rails_env_config
   redcarpet
+  rouge
   sass-rails
   uglifier
 

app/assets/stylesheets/admin/highlight.scss

@@ -0,0 +1,199 @@
+.highlight .hll {
+  background-color: #d6d6d6;
+}
+.highlight {
+  background: #ffffff;
+  color: #4d4d4c;
+}
+.highlight .c {
+  color: #8e908c;
+} /* Comment */
+.highlight .err {
+  color: #c82829;
+} /* Error */
+.highlight .k {
+  color: #8959a8;
+} /* Keyword */
+.highlight .l {
+  color: #f5871f;
+} /* Literal */
+.highlight .n {
+  color: #4d4d4c;
+} /* Name */
+.highlight .o {
+  color: #3e999f;
+} /* Operator */
+.highlight .p {
+  color: #4d4d4c;
+} /* Punctuation */
+.highlight .cm {
+  color: #8e908c;
+} /* Comment.Multiline */
+.highlight .cp {
+  color: #8e908c;
+} /* Comment.Preproc */
+.highlight .c1 {
+  color: #8e908c;
+} /* Comment.Single */
+.highlight .cs {
+  color: #8e908c;
+} /* Comment.Special */
+.highlight .gd {
+  color: #c82829;
+} /* Generic.Deleted */
+.highlight .ge {
+  font-style: italic;
+} /* Generic.Emph */
+.highlight .gh {
+  color: #4d4d4c;
+  font-weight: bold;
+} /* Generic.Heading */
+.highlight .gi {
+  color: #718c00;
+} /* Generic.Inserted */
+.highlight .gp {
+  color: #8e908c;
+  font-weight: bold;
+} /* Generic.Prompt */
+.highlight .gs {
+  font-weight: bold;
+} /* Generic.Strong */
+.highlight .gu {
+  color: #3e999f;
+  font-weight: bold;
+} /* Generic.Subheading */
+.highlight .kc {
+  color: #8959a8;
+} /* Keyword.Constant */
+.highlight .kd {
+  color: #8959a8;
+} /* Keyword.Declaration */
+.highlight .kn {
+  color: #3e999f;
+} /* Keyword.Namespace */
+.highlight .kp {
+  color: #8959a8;
+} /* Keyword.Pseudo */
+.highlight .kr {
+  color: #8959a8;
+} /* Keyword.Reserved */
+.highlight .kt {
+  color: #eab700;
+} /* Keyword.Type */
+.highlight .ld {
+  color: #718c00;
+} /* Literal.Date */
+.highlight .m {
+  color: #f5871f;
+} /* Literal.Number */
+.highlight .s {
+  color: #718c00;
+} /* Literal.String */
+.highlight .na {
+  color: #4271ae;
+} /* Name.Attribute */
+.highlight .nb {
+  color: #4d4d4c;
+} /* Name.Builtin */
+.highlight .nc {
+  color: #eab700;
+} /* Name.Class */
+.highlight .no {
+  color: #c82829;
+} /* Name.Constant */
+.highlight .nd {
+  color: #3e999f;
+} /* Name.Decorator */
+.highlight .ni {
+  color: #4d4d4c;
+} /* Name.Entity */
+.highlight .ne {
+  color: #c82829;
+} /* Name.Exception */
+.highlight .nf {
+  color: #4271ae;
+} /* Name.Function */
+.highlight .nl {
+  color: #4d4d4c;
+} /* Name.Label */
+.highlight .nn {
+  color: #eab700;
+} /* Name.Namespace */
+.highlight .nx {
+  color: #4271ae;
+} /* Name.Other */
+.highlight .py {
+  color: #4d4d4c;
+} /* Name.Property */
+.highlight .nt {
+  color: #3e999f;
+} /* Name.Tag */
+.highlight .nv {
+  color: #c82829;
+} /* Name.Variable */
+.highlight .ow {
+  color: #3e999f;
+} /* Operator.Word */
+.highlight .w {
+  color: #4d4d4c;
+} /* Text.Whitespace */
+.highlight .mf {
+  color: #f5871f;
+} /* Literal.Number.Float */
+.highlight .mh {
+  color: #f5871f;
+} /* Literal.Number.Hex */
+.highlight .mi {
+  color: #f5871f;
+} /* Literal.Number.Integer */
+.highlight .mo {
+  color: #f5871f;
+} /* Literal.Number.Oct */
+.highlight .sb {
+  color: #718c00;
+} /* Literal.String.Backtick */
+.highlight .sc {
+  color: #4d4d4c;
+} /* Literal.String.Char */
+.highlight .sd {
+  color: #8e908c;
+} /* Literal.String.Doc */
+.highlight .s2 {
+  color: #718c00;
+} /* Literal.String.Double */
+.highlight .se {
+  color: #f5871f;
+} /* Literal.String.Escape */
+.highlight .sh {
+  color: #718c00;
+} /* Literal.String.Heredoc */
+.highlight .si {
+  color: #f5871f;
+} /* Literal.String.Interpol */
+.highlight .sx {
+  color: #718c00;
+} /* Literal.String.Other */
+.highlight .sr {
+  color: #718c00;
+} /* Literal.String.Regex */
+.highlight .s1 {
+  color: #718c00;
+} /* Literal.String.Single */
+.highlight .ss {
+  color: #718c00;
+} /* Literal.String.Symbol */
+.highlight .bp {
+  color: #4d4d4c;
+} /* Name.Builtin.Pseudo */
+.highlight .vc {
+  color: #c82829;
+} /* Name.Variable.Class */
+.highlight .vg {
+  color: #c82829;
+} /* Name.Variable.Global */
+.highlight .vi {
+  color: #c82829;
+} /* Name.Variable.Instance */
+.highlight .il {
+  color: #f5871f;
+} /* Literal.Number.Integer.Long */

app/assets/stylesheets/admin/issue_updates.scss

@@ -1,3 +1,5 @@
+@import 'admin/variables';
+
 .issueUpdates {
 
 }
@@ -26,6 +28,23 @@
   margin-top:8px;
 }
 
+.issueUpdates__header {
+  margin-bottom: 10px;
+}
+
 .issueUpdates__edit {
   margin-left:8px;
 }
+
+$issueStates: (
+  "investigating": $red,
+  "identified": $orange,
+  "monitoring": $blue,
+  "resolved": #666
+);
+
+@each $status, $color in $issueStates {
+  .issueUpdates__statusColor--#{$status} {
+    color: $color;
+  }
+}