From 2f0b9ec4a54f2981ecc478f60a9773e32ee799ab Mon Sep 17 00:00:00 2001
From: Patrick Franz <clymbing@gmail.com>
Date: Wed, 10 Mar 2021 10:36:29 -0800
Subject: [PATCH] Fix: Code blocks overflowing parents Fix: Allow quiz response
 code block to overflow-y to a scroll

---
 client/src/components/layouts/global.css       | 1 +
 client/src/components/layouts/prism.css        | 4 ++++
 client/src/templates/Challenges/video/show.css | 1 +
 3 files changed, 6 insertions(+)

diff --git a/client/src/components/layouts/global.css b/client/src/components/layouts/global.css
index 011a6c4fdcd..2712ff56792 100644
--- a/client/src/components/layouts/global.css
+++ b/client/src/components/layouts/global.css
@@ -388,6 +388,7 @@ code {
   color: var(--tertiary-color);
   border-radius: 0px;
   font-family: 'Roboto Mono', monospace;
+  overflow-wrap: anywhere;
 }
 
 .panel {
diff --git a/client/src/components/layouts/prism.css b/client/src/components/layouts/prism.css
index 91590f678f5..289e3069a57 100644
--- a/client/src/components/layouts/prism.css
+++ b/client/src/components/layouts/prism.css
@@ -7,6 +7,10 @@ pre[class*='language-'] {
   background: var(--primary-background);
 }
 
+pre[class*='language'] code[class*='language-'] {
+  white-space: nowrap;
+}
+
 * {
   text-shadow: none !important;
 }
diff --git a/client/src/templates/Challenges/video/show.css b/client/src/templates/Challenges/video/show.css
index 3c1cabbec4d..a0d88e75661 100644
--- a/client/src/templates/Challenges/video/show.css
+++ b/client/src/templates/Challenges/video/show.css
@@ -37,6 +37,7 @@
 .video-quiz-options > label {
   margin: 0;
   align-items: center;
+  overflow-x: scroll;
 }
 
 .video-quiz-option-label {