set style

packages/presentation/src/components/GrowiSlides.tsx

@@ -5,8 +5,6 @@ import type { PresentationOptions } from '../consts';
 import { MARP_CONTAINER_CLASS_NAME, presentationMarpit, slideMarpit } from '../services/growi-marpit';
 import * as extractSections from '../services/renderer/extract-sections';
 
-
-import './Slides.global.scss';
 import { PresentationRichSlideSection, RichSlideSection } from './RichSlideSection';
 
 

packages/presentation/src/components/MarpSlides.tsx

@@ -1,6 +1,5 @@
 import Head from 'next/head';
 
-import './Slides.global.scss';
 import { presentationMarpit, slideMarpit } from '../services/growi-marpit';
 
 type Props = {

packages/presentation/src/components/Slides.global.scss

@@ -1,4 +0,0 @@
-div.slides.marpit > section :is(pre, marp-pre) {
-  padding: 0;
-  border: none;
-}

packages/presentation/src/components/Slides.tsx

@@ -4,7 +4,7 @@ import type { PresentationOptions } from '../consts';
 import { GrowiSlides } from './GrowiSlides';
 import { MarpSlides } from './MarpSlides';
 
-import './Slides.global.scss';
+import styles from './Slides.module.scss';
 
 type Props = {
   options: PresentationOptions,
@@ -19,8 +19,12 @@ export const Slides = (props: Props): JSX.Element => {
   } = props;
 
   return (
-    hasMarpFlag
-      ? <MarpSlides presentation={presentation}>{children}</MarpSlides>
-      : <GrowiSlides options={options} presentation={presentation}>{children}</GrowiSlides>
+    <div className={`${styles['slides-styles']}`}>
+      {
+        hasMarpFlag
+          ? <MarpSlides presentation={presentation}>{children}</MarpSlides>
+          : <GrowiSlides options={options} presentation={presentation}>{children}</GrowiSlides>
+      }
+    </div>
   );
 };