@@ -61,53 +61,55 @@ const SnippetModal: React.FC<Props> = ({
6161 < CloseIcon />
6262 </ Button >
6363 </ div >
64- < CodePreview language = { slugify ( language ) } code = { snippet . code } />
65- < p >
66- < b > Description: </ b >
67- { snippet . description }
68- </ p >
69- < p >
70- Created by{ " " }
71- < a
72- href = { `https://github.com/${ snippet . author } }
73- target = "_blank"
74- rel = "noopener noreferrer"
75- className = "styled-link"
76- >
77- @{ snippet . author }
78- </ a >
79- </ p >
80- { ( snippet . contributors ?? [ ] ) . length > 0 && (
81- < div className = "contributors" >
82- < span > Contributors: </ span >
83- { snippet . contributors
84- ?. slice ( 0 , 3 )
85- . map ( ( contributor , index , slicedArray ) => (
86- < >
87- < a
88- key = { contributor }
89- href = { `https://github.com/${ contributor } }
90- target = "_blank"
91- rel = "noopener noreferrer"
92- className = "styled-link"
93- >
94- @{ contributor }
95- </ a >
96- { index < slicedArray . length - 1 && ", " }
97- </ >
98- ) ) }
99- { ( snippet . contributors ?. length ?? 0 ) > 3 && (
100- < span > & { snippet . contributors ! . length - 3 } more</ span >
101- ) }
102- </ div >
103- ) }
104- < ul role = "list" className = "modal__tags" >
105- { snippet . tags . map ( ( tag ) => (
106- < li key = { tag } className = "modal__tag" >
107- { tag }
108- </ li >
109- ) ) }
110- </ ul >
64+ < div className = "modal__body | flow" >
65+ < CodePreview language = { slugify ( language ) } code = { snippet . code } />
66+ < p >
67+ < b > Description: </ b >
68+ { snippet . description }
69+ </ p >
70+ < p >
71+ Created by{ " " }
72+ < a
73+ href = { `https://github.com/${ snippet . author } }
74+ target = "_blank"
75+ rel = "noopener noreferrer"
76+ className = "styled-link"
77+ >
78+ @{ snippet . author }
79+ </ a >
80+ </ p >
81+ { ( snippet . contributors ?? [ ] ) . length > 0 && (
82+ < div className = "contributors" >
83+ < span > Contributors: </ span >
84+ { snippet . contributors
85+ ?. slice ( 0 , 3 )
86+ . map ( ( contributor , index , slicedArray ) => (
87+ < >
88+ < a
89+ key = { contributor }
90+ href = { `https://github.com/${ contributor } }
91+ target = "_blank"
92+ rel = "noopener noreferrer"
93+ className = "styled-link"
94+ >
95+ @{ contributor }
96+ </ a >
97+ { index < slicedArray . length - 1 && ", " }
98+ </ >
99+ ) ) }
100+ { ( snippet . contributors ?. length ?? 0 ) > 3 && (
101+ < span > & { snippet . contributors ! . length - 3 } more</ span >
102+ ) }
103+ </ div >
104+ ) }
105+ < ul role = "list" className = "modal__tags" >
106+ { snippet . tags . map ( ( tag ) => (
107+ < li key = { tag } className = "modal__tag" >
108+ { tag }
109+ </ li >
110+ ) ) }
111+ </ ul >
112+ </ div >
111113 </ motion . div >
112114 </ motion . div > ,
113115 modalRoot
0 commit comments