From 3f1e55b78797ddcabd0cf7701bb074872c899323 Mon Sep 17 00:00:00 2001
From: Audric Ackermann <audric@loki.network>
Date: Mon, 4 Oct 2021 10:57:15 +1100
Subject: [PATCH] add basic code markup

---
 stylesheets/_session.scss                  | 7 ++++++-
 stylesheets/_session_conversation.scss     | 2 +-
 ts/components/conversation/MessageBody.tsx | 5 +++++
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/stylesheets/_session.scss b/stylesheets/_session.scss
index a594052e0..9ad875cac 100644
--- a/stylesheets/_session.scss
+++ b/stylesheets/_session.scss
@@ -320,13 +320,18 @@ textarea {
   margin-inline-start: 10px;
 }
 
+pre {
+  backdrop-filter: brightness(0.8);
+  padding: $session-margin-xs;
+}
+
 .module-message__container {
   position: relative;
   display: inline-block;
   overflow: hidden;
   min-width: 30px;
   // To limit messages with things forcing them wider, like long attachment names
-  max-width: 300px;
+  max-width: calc(100vw - 380px - 100px);
   align-items: center;
 }
 label {
diff --git a/stylesheets/_session_conversation.scss b/stylesheets/_session_conversation.scss
index 4f529209a..141fc5b95 100644
--- a/stylesheets/_session_conversation.scss
+++ b/stylesheets/_session_conversation.scss
@@ -195,7 +195,7 @@
     align-items: center;
     flex-grow: 1;
     min-height: $composition-container-height;
-    padding: $session-margin-md 0;
+    padding: $session-margin-xs 0;
 
     ul {
       max-height: 70vh;
diff --git a/ts/components/conversation/MessageBody.tsx b/ts/components/conversation/MessageBody.tsx
index 81892f53e..2210abe1e 100644
--- a/ts/components/conversation/MessageBody.tsx
+++ b/ts/components/conversation/MessageBody.tsx
@@ -110,6 +110,11 @@ export class MessageBody extends React.Component<Props> {
       );
     }
 
+    if (text && text.startsWith('```') && text.endsWith('```')) {
+      const length = text.length;
+      return <pre className="text-selectable">{text.substring(4, length - 3)}</pre>;
+    }
+
     return this.renderJsxSelectable(
       <Linkify
         text={text}