fix: fix table overflow for smaller devices

2 files changed, 7 insertions, 8 deletions

diff --git a/spec/frontend/default/components/__snapshots__/table_of_contents_spec.js.snap b/spec/frontend/default/components/__snapshots__/table_of_contents_spec.js.snap
index 06567e10..4763abef 100644
--- a/spec/frontend/default/components/__snapshots__/table_of_contents_spec.js.snap
+++ b/spec/frontend/default/components/__snapshots__/table_of_contents_spec.js.snap
@@ -8,18 +8,17 @@ exports[`frontend/default/components/table_of_contents matches snapshot 1`] = `
     class="table-of-contents"
   >
     <h4
-      class="border-0 toc-sm d-lg-none"
+      class="border-0 toc-sm d-xl-none"
     >
       <a
         aria-controls="markdown-toc"
-        aria-expanded="true"
         class="d-flex text-decoration-none border-bottom-0"
         data-testid="collapse"
         href="#"
         role="button"
       >
         <i
-          class="fa d-flex align-items-center justify-content-center mr-1 gl-w-3 fa-angle-down"
+          class="fa d-flex align-items-center justify-content-center mr-1 gl-w-3 fa-angle-right"
           role="presentation"
         />
         
@@ -35,7 +34,7 @@ exports[`frontend/default/components/table_of_contents matches snapshot 1`] = `
     </h4>
      
     <div
-      class=""
+      class="sm-collapsed"
       data-testid="container"
     >
       <ul
diff --git a/spec/frontend/default/components/table_of_contents_spec.js b/spec/frontend/default/components/table_of_contents_spec.js
index dcde66b9..86f14d1b 100644
--- a/spec/frontend/default/components/table_of_contents_spec.js
+++ b/spec/frontend/default/components/table_of_contents_spec.js
@@ -83,8 +83,8 @@ describe('frontend/default/components/table_of_contents', () => {
       expect(findMainListItems()).toEqual(flattenItems(TEST_ITEMS));
     });
 
-    it('is initially uncollapsed', () => {
-      expectCollapsed(false);
+    it('is initially collapsed', () => {
+      expectCollapsed(true);
     });
 
     describe('when collapse button is pressed', () => {
@@ -97,7 +97,7 @@ describe('frontend/default/components/table_of_contents', () => {
       });
 
       it('immediately updates collapse status', () => {
-        expectCollapsed(true);
+        expectCollapsed(false);
       });
 
       it('when button pressed again, nothing happens because in the middle of collapsing', () => {
@@ -105,7 +105,7 @@ describe('frontend/default/components/table_of_contents', () => {
 
         return wrapper.vm.$nextTick(() => {
           expect(findCollapsibleContainer().classes('sm-collapsing')).toBe(true);
-          expectCollapsed(true);
+          expectCollapsed(false);
         });
       });
     });