fix: design issues and removing overlay from modal overview

openedx · Sep 11, 2024 · 395e6f6 · 395e6f6
1 parent 990815c
commit 395e6f6
Show file tree

Hide file tree

Showing 3 changed files with 2 additions and 8 deletions.
diff --git a/src/library-authoring/LibraryBlock/LibraryBlock.tsx b/src/library-authoring/LibraryBlock/LibraryBlock.tsx
@@ -17,7 +17,7 @@ interface LibraryBlockProps {
  */
 const LibraryBlock = ({ onBlockNotification, usageKey }: LibraryBlockProps) => {
   const iframeRef = useRef<HTMLIFrameElement>(null);
-  const [iFrameHeight, setIFrameHeight] = useState(400);
+  const [iFrameHeight, setIFrameHeight] = useState(600);
   const lmsBaseUrl = getConfig().LMS_BASE_URL;
 
   /**
@@ -70,7 +70,6 @@ const LibraryBlock = ({ onBlockNotification, usageKey }: LibraryBlockProps) => {
       position: 'relative',
       overflow: 'hidden',
       minHeight: '200px',
-      border: '1px solid #ccc',
     }}
     >
       <iframe
@@ -79,14 +78,10 @@ const LibraryBlock = ({ onBlockNotification, usageKey }: LibraryBlockProps) => {
         src={`${lmsBaseUrl}/xblocks/v2/${usageKey}/embed/student_view/`}
         data-testid="block-preview"
         style={{
-          position: 'absolute',
-          left: 0,
-          top: 0,
           width: '100%',
           height: '100%',
           minHeight: '200px',
           border: '0 none',
-          backgroundColor: 'white',
         }}
         // allowing 'autoplay' is required to allow the video XBlock to control the YouTube iframe it has.
         allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"

diff --git a/src/library-authoring/component-info/ComponentPreview.scss b/src/library-authoring/component-info/ComponentPreview.scss
@@ -1,3 +1,3 @@
 .component-preview-modal {
-  min-width: map-get($grid-breakpoints, "lg");
+  min-width: map-get($grid-breakpoints, "md");
 }
diff --git a/src/library-authoring/component-info/ComponentPreview.tsx b/src/library-authoring/component-info/ComponentPreview.tsx
@@ -34,7 +34,6 @@ const ModalComponentPreview = ({ isOpen, close, usageKey }: ModalComponentPrevie
       )}
       className="component-preview-modal"
     >
-      <PreviewOverlay />
       <LibraryBlock usageKey={usageKey} />
     </StandardModal>
   );