From 69a819120cb17add811d69dee818d9dd264f0dfd Mon Sep 17 00:00:00 2001
From: Stephanie Smith <stephanie.c.smith@jpl.nasa.gov>
Date: Thu, 19 Sep 2024 18:04:23 -0700
Subject: [PATCH] fixing margin on list items in student project page

---
 .../src/components/BlockText/BlockText.stories.js |  8 ++++----
 .../PageEduStudentProject.stories.js              |  1 +
 .../PageEduStudentProjectSection.vue              | 15 +++++++++------
 3 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/packages/vue/src/components/BlockText/BlockText.stories.js b/packages/vue/src/components/BlockText/BlockText.stories.js
index aa99f1f9..df314d04 100644
--- a/packages/vue/src/components/BlockText/BlockText.stories.js
+++ b/packages/vue/src/components/BlockText/BlockText.stories.js
@@ -32,16 +32,16 @@ export const RichTextMediaData = `<p data-block-key="5f55p">Description for it.<
         <a class="caption-link" href="#">Full Image Details</a>
     </div>
 </div>
-<ul><li>Item one in the list</li><li>Item two in the list</li><li>Third item in the list</li></ul>
+<ul><li>Item one in the list</li><li>Aliquam erat volutpat. Nam et lorem purus. Pellentesque placerat, lorem eget ultrices bibendum, lorem dolor finibus metus, consectetur mattis lorem sapien id felis. Cras scelerisque lacus et tristique luctus.</li><li>Third item in the list</li></ul>
 <p data-block-key="4409g">More text and something that&#x27;s <span="math-text">right-aligned</span>.</p><p data-block-key="bid36"></p><div class="richtext-image right"><img alt="Lecture Brings Galileo&amp;#x27;s Travels into Final Focus" height="350" loading="lazy" src="https://picsum.photos/640/350" width="640">
     <div class="richtext-caption">
         <div class="caption">Lecture Brings Galileo's Travels into Final Focus</div>
     </div>
 </div>
-<ol><li>Item one in the list</li><li>Item two in the list</li><li>Third item in the list</li></ol>
+<ol><li>Item one in the list</li><li>Aliquam erat volutpat. Nam et lorem purus. Pellentesque placerat, lorem eget ultrices bibendum, lorem dolor finibus metus, consectetur mattis lorem sapien id felis. Cras scelerisque lacus et tristique luctus.</li><li>Third item in the list</li></ol>
 <p data-block-key="1f4rd"> Pellentesque euismod, metus et vehicula tincidunt, magna velit viverra enim, non efficitur elit enim ut ante. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum massa est, aliquam sed volutpat quis, tempor vitae felis. Quisque suscipit in purus non rhoncus. Vestibulum commodo gravida nibh. Quisque imperdiet lacus rhoncus malesuada elementum. Mauris tempor purus quis sollicitudin ornare. Suspendisse eget gravida neque. Etiam gravida, sapien ac condimentum placerat, tellus eros volutpat elit, non viverra lectus turpis ut lectus. Praesent varius porttitor eros eu efficitur. Etiam nec neque semper, facilisis leo non, tempor enim. Etiam a sodales lacus. Aenean a nibh ipsum.</p>
-<ul><li>Item one in the list</li><li>Item two in the list</li><li>Third item in the list</li></ul>
-<ol><li>Item one in the list</li><li>Item two in the list</li><li>Third item in the list</li></ol>
+<ul><li>Item one in the list</li><li>Aliquam erat volutpat. Nam et lorem purus. Pellentesque placerat, lorem eget ultrices bibendum, lorem dolor finibus metus, consectetur mattis lorem sapien id felis. Cras scelerisque lacus et tristique luctus.</li><li>Third item in the list</li></ul>
+<ol><li>Item one in the list</li><li>Aliquam erat volutpat. Nam et lorem purus. Pellentesque placerat, lorem eget ultrices bibendum, lorem dolor finibus metus, consectetur mattis lorem sapien id felis. Cras scelerisque lacus et tristique luctus.</li><li>Third item in the list</li></ol>
 <p>Nunc molestie aliquet nunc, ut viverra risus elementum bibendum. Cras metus metus, sagittis sed ex at, rutrum dictum leo. Cras sodales, urna id aliquam scelerisque, neque sem venenatis justo, a feugiat lorem ligula molestie orci. Vestibulum in suscipit diam. Phasellus pulvinar quis diam ullamcorper sagittis. Praesent a risus leo. Etiam tempor dolor eu turpis laoreet fermentum. Sed turpis risus, interdum ut bibendum ut, ornare a augue. Donec condimentum odio non lectus efficitur sodales. Vivamus posuere ligula a eros molestie, semper porttitor augue interdum. Cras et facilisis ligula, nec malesuada velit. </p>`
 
 export const BaseStory = {
diff --git a/packages/vue/src/templates/edu/PageEduStudentProject/PageEduStudentProject.stories.js b/packages/vue/src/templates/edu/PageEduStudentProject/PageEduStudentProject.stories.js
index 270c2cac..cb4dd4dc 100644
--- a/packages/vue/src/templates/edu/PageEduStudentProject/PageEduStudentProject.stories.js
+++ b/packages/vue/src/templates/edu/PageEduStudentProject/PageEduStudentProject.stories.js
@@ -144,6 +144,7 @@ export const BaseStory = {
           content: [
             BlockImageData,
             ...BlockStreamfieldMinimalData.body,
+            BlockRichTableData,
             BlockInlineImageData.block,
             {
               blockType: 'RichTextBlock',
diff --git a/packages/vue/src/templates/edu/PageEduStudentProject/PageEduStudentProjectSection.vue b/packages/vue/src/templates/edu/PageEduStudentProject/PageEduStudentProjectSection.vue
index 30fc90fa..3eb24b47 100644
--- a/packages/vue/src/templates/edu/PageEduStudentProject/PageEduStudentProjectSection.vue
+++ b/packages/vue/src/templates/edu/PageEduStudentProject/PageEduStudentProjectSection.vue
@@ -199,12 +199,15 @@ const { heading, blocks, image, steps, stepsNumbering, text } = reactive(props)
     }
   }
   .PageEduStudentProjectStep__fullWidth {
-    .LayoutHelper > div > .BlockText:not(.BlockRichTable.BlockText) p {
-      @screen lg {
-        @apply mr-[10rem];
-      }
-      @screen xl {
-        @apply mr-[14rem];
+    .LayoutHelper > div > .BlockText {
+      p,
+      li {
+        @screen lg {
+          @apply mr-[10rem];
+        }
+        @screen xl {
+          @apply mr-[14rem];
+        }
       }
     }
   }