Rename AngledContainer to Panel

MartijnHols · Dec 11, 2024 · 18c1e9a · 18c1e9a
1 parent b239c57
commit 18c1e9a
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 9 deletions.
diff --git a/components/CodeSnippet.tsx b/components/CodeSnippet.tsx
@@ -1,8 +1,8 @@
 import { css, useTheme } from '@emotion/react'
 import styled from '@emotion/styled'
 import { Highlight, themes } from 'prism-react-renderer'
-import AngledContainer from './AngledContainer'
 import CopyPasteOnly from './CopyPasteOnly'
+import Panel from './Panel'
 // Alternative: https://github.com/react-simple-code-editor/react-simple-code-editor
 
 const Code = styled.code`
@@ -61,7 +61,7 @@ const CodeSnippet = ({
         <br />
       </CopyPasteOnly>
       <Code translate="no" {...others}>
-        <AngledContainer variant={variant}>
+        <Panel variant={variant}>
           <Highlight
             theme={highlightTheme}
             code={children.trim()}
@@ -79,7 +79,7 @@ const CodeSnippet = ({
               </PreformattedContainer>
             )}
           </Highlight>
-        </AngledContainer>
+        </Panel>
       </Code>
       <CopyPasteOnly>
         ```

diff --git a/components/GistCard.tsx b/components/GistCard.tsx
@@ -1,8 +1,8 @@
 import { css } from '@emotion/react'
 import styled from '@emotion/styled'
-import AngledContainer from './AngledContainer'
 import { GistTag, SerializableGistMeta } from './GistMeta'
 import Link from './Link'
+import Panel from './Panel'
 import PublicationDate from './PublicationDate'
 import Tag from './Tag'
 
@@ -65,7 +65,7 @@ const ArticleLink = styled(Link, {
       max-width: 90%;
     `,
 ])
-const Article = styled(AngledContainer, {
+const Article = styled(Panel, {
   shouldForwardProp: (prop) => prop !== 'howTo',
 })<{ howTo?: boolean }>(({ theme, howTo }) => [
   css`

diff --git a/components/AngledContainer.tsx → components/Panel.tsx b/components/AngledContainer.tsx → components/Panel.tsx
@@ -117,7 +117,7 @@ interface Props {
   className?: string
 }
 
-const AngledContainer = ({
+const Panel = ({
   children,
   variant = 'md',
   boxShadow = true,
@@ -135,4 +135,4 @@ const AngledContainer = ({
   </Container>
 )
 
-export default AngledContainer
+export default Panel
diff --git a/components/ProjectBrief.tsx b/components/ProjectBrief.tsx
@@ -4,12 +4,12 @@ import Image from 'next/image'
 import { Fragment, ReactNode } from 'react'
 import { ImageInfo } from '../utils/convertPrismicImage'
 import { usePrismicConfig } from '../utils/prismicConfig'
-import AngledContainer from './AngledContainer'
 import CopyPasteOnly from './CopyPasteOnly'
 import Link from './Link'
+import Panel from './Panel'
 import Tag from './Tag'
 
-const Container = styled(AngledContainer, {
+const Container = styled(Panel, {
   shouldForwardProp: (prop) =>
     prop !== 'highlighted' && prop !== 'isPlaceholder',
 })<{