refactor: Extract style tag contents to CSS files

preactjs · Jun 18, 2024 · 9850f20 · 9850f20
1 parent f124238
commit 9850f20
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 20 deletions.
diff --git a/src/components/controllers/repl/index.jsx b/src/components/controllers/repl/index.jsx
@@ -306,15 +306,6 @@ export class Repl extends Component {
 const ReplWrapper = ({ loading, children }) => (
 	<div class={style.repl}>
 		<loading-bar showing={!!loading} />
-		<style>{`
-			main {
-				height: 100% !important;
-				overflow: hidden !important;
-			}
-			footer {
-				display: none !important;
-			}
-		`}</style>
 		{children}
 	</div>
 );
diff --git a/src/components/controllers/repl/style.module.css b/src/components/controllers/repl/style.module.css
@@ -151,3 +151,8 @@
 	width: 100%;
 	height: 100%;
 }
+
+:global(main) {
+	height: 100% !important;
+	overflow: hidden !important;
+}
diff --git a/src/components/controllers/tutorial/index.jsx b/src/components/controllers/tutorial/index.jsx
@@ -309,16 +309,6 @@ function TutorialView({
 	);
 }
 
-const REPL_CSS = `
-	main {
-		height: 100% !important;
-		overflow: hidden !important;
-	}
-	footer {
-		display: none !important;
-	}
-`;
-
 function ReplWrapper({
 	tutorialLoading,
 	solvable,
@@ -330,7 +320,6 @@ function ReplWrapper({
 	return (
 		<div class={style.tutorial}>
 			<loading-bar showing={!!tutorialLoading} />
-			<style>{REPL_CSS}</style>
 			<div
 				class={cx(
 					style.tutorialWrapper,

diff --git a/src/components/controllers/tutorial/style.module.css b/src/components/controllers/tutorial/style.module.css
@@ -397,3 +397,9 @@
 .output {
 	height: 100%;
 }
+
+/* For REPL */
+:global(main) {
+	height: 100% !important;
+	overflow: hidden !important;
+}