code and pre element styling

assets/css/base.pcss

@@ -4,6 +4,10 @@
   }
 
   code {
-    @apply text-base
+    @apply px-2 py-1 text-sm rounded-md text-gray-700 bg-gray-200 dark:bg-gray-800 dark:text-gray-100;
+  }
+
+  pre {
+    @apply p-4 my-8 overflow-auto rounded-md text-gray-700 bg-gray-200 dark:bg-gray-800 dark:text-gray-100;
   }
 }

assets/css/components.pcss

@@ -12,7 +12,7 @@
   }
 
   .markdown {
-    * + * {
+    > * + * {
       @apply mt-4;
     }
 
@@ -39,6 +39,14 @@
     a {
       @apply link;
     }
+
+    code {
+      @apply inline-block;
+    }
+
+    pre {
+      @apply my-8;
+    }
   }
 
   .visually-hidden {

source/_layouts/talk.html.twig

@@ -1,6 +1,7 @@
 {% extends 'base' %}
 
 {% block content_wrapper %}
+    <div class="space-y-6">
         <div class="markdown">
             {{ parent() }}
         </div>
@@ -16,6 +17,7 @@
         {% include 'talk/events' with {
             events: page.events|reverse,
         } only %}
+    </div>
 
     {% include 'about-author' %}
 {% endblock %}