Merge pull request #243 from oaknational/feat/PUPIL-797/new-pupil-les…

…son-svg-backgrounds-and-colours fix: update so that pupil lesson svg backgrounds only show on large displays
oaknational · Jul 24, 2024 · 91e3b60 · 91e3b60
2 parents b2548d8 + d4835ca
commit 91e3b60
Showing 1 changed file with 12 additions and 10 deletions.
diff --git a/src/components/organisms/pupil/OakLessonLayout/OakLessonLayout.tsx b/src/components/organisms/pupil/OakLessonLayout/OakLessonLayout.tsx
@@ -42,16 +42,18 @@ const StyledLayoutBox = styled(OakBox)<{
   @media (min-width: ${getBreakpoint("small")}px) {
     padding-top: ${parseSpacing("space-between-xl")};
   }
-  ${(props) => css`
-    ${getBackgroundUrlForLesson(
-      props.sectionName,
-      props.phase,
-      props.celebrate,
-    )}
-  `}
-  background-repeat: no-repeat;
-  background-position-x: center;
-  background-size: 100%;
+  @media (min-width: ${getBreakpoint("large")}px) {
+    ${(props) => css`
+      ${getBackgroundUrlForLesson(
+        props.sectionName,
+        props.phase,
+        props.celebrate,
+      )}
+    `}
+    background-repeat: no-repeat;
+    background-position-x: center;
+    background-size: 100%;
+  }
 `;
 
 const StickyFooter = styled(OakBox)`