@@ -7,54 +7,50 @@ const FontList = ({fonts}) => {
77 return < Flex vertical gap = { 20 } >
88 < Flex gap = { 8 } >
99 < div > 调整大小:</ div >
10- < Slider style = { { width : 100 } } max = { 60 } min = { 12 } value = { value } onChange = { setValue } />
10+ < Slider style = { { width : 100 } } max = { 60 } min = { 12 } value = { value } onChange = { setValue } />
1111 < div > { value } px</ div >
1212 </ Flex >
1313 { Object . keys ( fonts ) . map ( fontClassName => {
14- const { glyphs : list } = fonts [ fontClassName ] ;
14+ const { glyphs : list } = fonts [ fontClassName ] ;
1515 const isColorful = / - c o l o r f u l $ / . test ( fontClassName ) ;
16- return (
17- < Flex vertical gap = { 8 } key = { fontClassName } >
18- < Typography . Title level = { 4 } > { fontClassName } </ Typography . Title >
19- < Flex gap = { 12 } wrap >
20- { list . map ( ( { font_class } ) => {
21- return (
22- < Card size = "small" key = { font_class } >
23- { isColorful ? (
24- < >
25- < Flex justify = "center" >
26- < Icon colorful type = { font_class } size = { value } />
27- </ Flex >
28- < Typography . Text
29- style = { { display : 'block' , width : '120px' , wordBreak : 'break-all' } }
30- copyable = { {
31- text : '<Icon colorful type="' + font_class + '" size={' + value + '}/>'
32- } } >
33- { font_class }
34- </ Typography . Text >
35- </ >
36- ) : (
37- < >
38- < Flex justify = "center" >
39- < Icon type = { font_class } size = { value } fontClassName = { fontClassName } />
40- </ Flex >
41- < Typography . Text
42- style = { { display : 'block' , width : '120px' , wordBreak : 'break-all' } }
43- copyable = { {
44- text : '<Icon type="' + font_class + '" size={' + value + '} fontClassName={' + fontClassName + '}/>'
45- } } >
46- { font_class }
47- </ Typography . Text >
48- </ >
49- ) }
50- </ Card >
51- ) ;
52- } ) }
53- </ Flex >
16+ return ( < Flex vertical gap = { 8 } key = { fontClassName } >
17+ < Typography . Title level = { 4 } > { fontClassName } </ Typography . Title >
18+ < Flex gap = { 12 } wrap >
19+ { list . map ( ( { font_class} ) => {
20+ return ( < Card size = "small" key = { font_class } >
21+ { isColorful ? ( < >
22+ < Flex justify = "center" >
23+ < Icon colorful type = { font_class } size = { value } />
24+ </ Flex >
25+ < Flex justify = "center" >
26+ < Typography . Text
27+ style = { { display : 'block' , width : '120px' , wordBreak : 'break-all' } }
28+ copyable = { {
29+ text : '<Icon colorful type="' + font_class + '"/>'
30+ } } >
31+ { font_class }
32+ </ Typography . Text >
33+ </ Flex >
34+ </ > ) : ( < >
35+ < Flex justify = "center" >
36+ < Icon type = { font_class } size = { value } fontClassName = { fontClassName } />
37+ </ Flex >
38+ < Flex justify = "center" >
39+ < Typography . Text
40+ style = { { display : 'block' , width : '120px' , wordBreak : 'break-all' } }
41+ copyable = { {
42+ text : '<Icon type="' + font_class + '" fontClassName="' + fontClassName + '"/>'
43+ } } >
44+ { font_class }
45+ </ Typography . Text >
46+ </ Flex >
47+ </ > ) }
48+ </ Card > ) ;
49+ } ) }
5450 </ Flex >
55- ) ;
51+ </ Flex > ) ;
5652 } ) }
5753 </ Flex >
5854} ;
5955
60- export default FontList ;
56+ export default FontList ;
0 commit comments