Add background to inline code blocks in headings (#10445)

Author: Luca Forstner

app/globals.css

@@ -140,6 +140,13 @@
     Courier, monospace;
 
   --fade-in-animation: fadeIn;
+
+  /* https://storybook.sentry.dev/?path=/story/core-colors--page */
+  --gray-500: #2B2233;
+  --gray-400: #3E3446;
+  --gray-300: #80708F;
+  --gray-200: #DBD6E1;
+  --gray-100: #EBE6EF;
 }
 
 body {

src/components/docPage/type.scss

@@ -24,7 +24,11 @@
 
     code {
       color: var(--darkPurple);
-      font-weight: 600;
+      font-weight: 400;
+      background-color: var(--gray-100);
+      padding: 3px 6px;
+      border-radius: 4px;
+      white-space: nowrap;
     }
 
     scroll-margin-top: calc(var(--header-height) + 1.5rem);