feat: [docs][base][Popper] Move styles to the bottom of demos code

Co-authored-by: seunexplicit <[email protected]>
mui · Mar 20, 2023 · 04a3455 · 04a3455
1 parent 7dd200f
commit 04a3455
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 20 deletions.
diff --git a/docs/data/base/components/popper/SimplePopper.js b/docs/data/base/components/popper/SimplePopper.js
@@ -2,16 +2,6 @@ import * as React from 'react';
 import PopperUnstyled from '@mui/base/PopperUnstyled';
 import { styled } from '@mui/system';
 
-const StyledPopperDiv = styled('div')(
-  ({ theme }) => `
-  padding: 0.5rem;
-  border: 1px solid;
-  background-color: ${theme.palette.mode === 'dark' ? '#121212' : '#fff'};
-  opacity: 1;
-  margin: 0.25rem 0px;
-`,
-);
-
 export default function SimplePopper() {
   const [anchorEl, setAnchorEl] = React.useState(null);
 
@@ -33,3 +23,13 @@ export default function SimplePopper() {
     </div>
   );
 }
+
+const StyledPopperDiv = styled('div')(
+  ({ theme }) => `
+  padding: 0.5rem;
+  border: 1px solid;
+  background-color: ${theme.palette.mode === 'dark' ? '#121212' : '#fff'};
+  opacity: 1;
+  margin: 0.25rem 0px;
+`,
+);
diff --git a/docs/data/base/components/popper/SimplePopper.tsx b/docs/data/base/components/popper/SimplePopper.tsx
@@ -2,16 +2,6 @@ import * as React from 'react';
 import PopperUnstyled from '@mui/base/PopperUnstyled';
 import { styled, Theme } from '@mui/system';
 
-const StyledPopperDiv = styled('div')(
-  ({ theme }: { theme: Theme }) => `
-  padding: 0.5rem;
-  border: 1px solid;
-  background-color: ${theme.palette.mode === 'dark' ? '#121212' : '#fff'};
-  opacity: 1;
-  margin: 0.25rem 0px;
-`,
-);
-
 export default function SimplePopper() {
   const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
 
@@ -33,3 +23,13 @@ export default function SimplePopper() {
     </div>
   );
 }
+
+const StyledPopperDiv = styled('div')(
+  ({ theme }: { theme: Theme }) => `
+  padding: 0.5rem;
+  border: 1px solid;
+  background-color: ${theme.palette.mode === 'dark' ? '#121212' : '#fff'};
+  opacity: 1;
+  margin: 0.25rem 0px;
+`,
+);