Merge pull request #585 from matematikk-mooc/marius/DIT-239

DIT-239: Reveal.
matematikk-mooc · Dec 11, 2024 · b4500cc · b4500cc
2 parents 7cbadbc + 637f220
commit b4500cc
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 16 deletions.
diff --git a/src/js/3party/vimeo.js b/src/js/3party/vimeo.js
@@ -334,9 +334,8 @@ export default (function() {
 					var buttonImg = button.getElementsByTagName('img')[0];
 					buttonImg.src = buttonImg.src.includes('expand_more') ? expandLess : expandMore;
 					var transcriptSelect = document.getElementById(transcript.getTranscriptSelectId());
-					transcriptSelect.style.display = transcriptSelect.style.display === 'none' ? 'block' : 'none';
+					$(transcriptSelect).fadeToggle(250);
 					transcriptSelect.style.marginTop = '1rem';
-
 					var body = document.getElementById(transcriptContentId);
 					var iframe = document.getElementById(iframeId);
 					var bodyDisplayStyle = getComputedStyle(body).display;
@@ -346,19 +345,15 @@ export default (function() {
 					} else {
 						slideDownAndAdjustIframe(400, body, iframe);
 					}
-
-
 					event.preventDefault();
 				});
 
 				function slideUpAndAdjustIframe(duration, element, iframe) {
-					element.style.display = 'none';
-					element.classList.remove('uob-box');
+					$(element).slideToggle(250);
 				}
 
 				function slideDownAndAdjustIframe(duration, element, iframe) {
-					element.style.display = 'block';
-					element.classList.add('uob-box');
+					$(element).slideToggle(250);
 				}
 
 				return { transcriptArea: p, transcriptContentArea: e };

diff --git a/src/js/modules/reveal.js b/src/js/modules/reveal.js
@@ -88,14 +88,14 @@ export default (function() {
                             var options;
 
                             if (document.querySelector(body).style.display !== 'none') {
-                                document.querySelector(body).style.display = 'none';
+                                $(body).slideToggle(250);
                                 var hideLink = document.querySelector(body + ' .hide_youtube_embed_link');
                                 if (hideLink) {
                                     hideLink.click();
                                 }
                                 options = { icons: { secondary: 'ui-icon-triangle-1-e' } };
                             } else {
-                                document.querySelector(body).style.display = 'flex';
+                                $(body).slideToggle(250);
                                 document.getElementsByClassName("custom-reveal-wrapper")[0].style.width = 'unset';
                                 options = { icons: { secondary: 'ui-icon-triangle-1-s' } };
                             }

diff --git a/src/vue/design/override-mobile.scss b/src/vue/design/override-mobile.scss
@@ -276,6 +276,12 @@
       font-weight: 600;
     }
   }
+  .uob-box {
+    flex-direction: column !important;
+    p {
+      display: block !important;
+    }
+  }
 
   // Modal
   .backdrop {
@@ -332,15 +338,13 @@
     }
   }
   .custom-reveal-wrapper {
-    p {
-      display: flex;
+    td {
+      width: unset !important;
     }
     a {
-      width: 100%;
-      justify-content: space-evenly;
+      justify-content: space-between;
     }
     .custom-reveal-content {
-      display: flex !important;
       width: 80vw;
       overflow-wrap: anywhere;
   }
@@ -350,4 +354,4 @@
       gap: 16px !important;
     }
   }
-}
+}