Code highlighter fix (#9176)

* flare tag line height

* .

* dropdown fix + actions bar fix

* actions bar on mob

* .

* typo

* .

app/assets/stylesheets/syntax.scss

@@ -20,7 +20,7 @@ div.highlight {
   border-radius: var(--radius);
   margin: 0;
   white-space: pre;
-  overflow-x: scroll;
+  overflow-x: auto;
   -webkit-overflow-scrolling: touch;
 
   code {
@@ -34,7 +34,7 @@ div.highlight {
 }
 
 code {
-  background: var(--base-a10);
+  background: rgba(0, 0, 0, 0.15);
   color: var(--color-body-color);
   border-radius: var(--radius);
   max-width: 100%;

app/javascript/article-form/components/Help.jsx

@@ -168,7 +168,7 @@ export class Help extends Component {
                     </td>
                   </tr>
                   <tr>
-                    <td className="ff-accent">[Link][https://...]</td>
+                    <td className="ff-accent">[Link](https://...)</td>
                     <td>
                       <a href="https://forem.com">Link</a>
                     </td>
@@ -219,7 +219,7 @@ export class Help extends Component {
                       <span class="fs-xs">```</span>
                     </td>
                     <td>
-                      <div class="highlight p-2">
+                      <div class="highlight p-2 overflow-hidden">
                         <code>code block</code>
                       </div>
                     </td>