SONAR-6028 Fix formatting of issue comments

diff --git a/server/sonar-web/src/main/less/components/issues.less b/server/sonar-web/src/main/less/components/issues.less
index a0b8ae54b8b6aed42bd055c36d6c6941f1c569ff..c28351bdd773a91999b9df89f7388de3009d4642 100644 (file)
--- a/server/sonar-web/src/main/less/components/issues.less
+++ b/server/sonar-web/src/main/less/components/issues.less
@@ -1,6 +1,7 @@
 @import (reference) "../variables";
 @import (reference) "../mixins";
 @import (reference) "../ui";
+@import (reference) "../components/typography";
 
 @leftPadding: 10px;
 @rightPadding: 10px;
@@ -163,6 +164,7 @@
   padding-left: 5px;
   padding-right: 5px;
   line-height: 18px;
+  .formatted;
 }
 
 .issue-comment-actions {

diff --git a/server/sonar-web/src/main/less/components/typography.less b/server/sonar-web/src/main/less/components/typography.less
new file mode 100644 (file)
index 0000000..24d960f
--- /dev/null
+++ b/server/sonar-web/src/main/less/components/typography.less
@@ -0,0 +1,80 @@
+@import (reference) "../variables";
+@import (reference) "../mixins";
+@import (reference) "../ui";
+
+.formatted() {
+  max-width: 1020px;
+  line-height: 1.5;
+
+  p, ul, ol, pre, blockquote, table, h2, h3, h4, h5, h6 {
+    margin: 1em 0;
+  }
+
+  h2 {
+    font-size: @bigFontSize;
+    font-weight: 400;
+  }
+
+  h3, h4, h5, h6 {
+    font-size: @baseFontSize;
+    font-weight: 500;
+  }
+
+  pre, code {
+    font-family: @monoFontFamily;
+    font-size: @smallFontSize;
+  }
+
+  pre {
+    max-width: 1020px;
+    padding: 10px;
+    border-top: 1px solid @barBorderColor;
+    border-bottom: 1px solid @barBorderColor;
+    line-height: 18px;
+    overflow: auto;
+  }
+
+  code {
+    font-weight: 600;
+  }
+
+  blockquote {
+    line-height: 1.5;
+    padding-left: 15px;
+    padding-right: 15px;
+  }
+
+  ul {
+    padding-left: 40px;
+    list-style: disc;
+  }
+
+  li > ul {
+    margin: 0.3em 0;
+  }
+
+  ol {
+    padding-left: 40px;
+    list-style: decimal;
+  }
+
+  table {
+    min-width: 50%;
+    border-collapse: collapse;
+    border: 1px solid @barBorderColor;
+  }
+
+  th {
+    padding: 5px 10px;
+    border: 1px solid @barBorderColor;
+    background-color: @barBackgroundColor;
+    font-weight: 500;
+    text-align: center;
+  }
+
+  td {
+    padding: 5px 10px;
+    border: 1px solid @barBorderColor;
+  }
+
+}