1
- import React from 'react' ;
2
- import * as gtag from '../lib/gtag'
1
+ import React , { FC } from 'react' ;
2
+ import * as gtag from '../lib/gtag' ;
3
3
4
- export const HatenaIcon = ( {
5
- hatena_href,
6
- hatena_title
7
- } : any ) => {
4
+ interface Props {
5
+ hatena_href : string ;
6
+ hatena_title : string ;
7
+ }
8
8
9
+ export const HatenaIcon : FC < Props > = ( { hatena_href, hatena_title } ) => {
9
10
const handleClick = ( ) => {
10
11
gtag . event ( {
11
12
action : 'Click' ,
12
13
category : 'Share' ,
13
14
label : 'Hatena' ,
14
15
value : '0' ,
15
- } )
16
- }
16
+ } ) ;
17
+ } ;
17
18
18
19
return (
19
- < a href = { hatena_href } target = "_blank" data-hatena-bookmark-title = { hatena_title } data-tip = "このページをはてなブックマークに追加する" onClick = { handleClick } >
20
- < svg className = "hatena-svg w-7 h-7 text-gray-500" fill = "#6B7280" x = "0px" y = "0px"
21
- width = "1024px" height = "1024px" viewBox = "0 0 1024 1024" >
22
- < path d = "M450.95,472.227c9.849-5.964,14.944-15.621,14.944-30.576s-4.57-25.491-13.882-31.648c-9.259-6.094-27.422-9.14-54.5-9.14
23
- h-23.376v80.161h21.628C422.647,481.023,441.111,478.213,450.95,472.227z" />
24
- < path d = "M468.179,562.581c-9.666-6.674-27.947-10.02-54.317-10.02h-39.726v87.006h38.149c25.662,0,43.944-3.153,54.661-9.678
25
- l-0.171,0.193c10.899-6.501,16.166-15.471,16.166-32.335C482.94,580.862,477.845,569.252,468.179,562.581z" />
26
- < path d = "M902.656,121.856C870.57,89.088,831.658,72.704,785.92,72.704H238.08c-45.739,0.683-84.651,17.066-116.736,49.152
20
+ < a
21
+ href = { hatena_href }
22
+ target = "_blank"
23
+ data-hatena-bookmark-title = { hatena_title }
24
+ data-tip = "このページをはてなブックマークに追加する"
25
+ onClick = { handleClick }
26
+ rel = "noreferrer" >
27
+ < svg
28
+ className = "hatena-svg w-7 h-7 text-gray-500"
29
+ fill = "#6B7280"
30
+ x = "0px"
31
+ y = "0px"
32
+ width = "1024px"
33
+ height = "1024px"
34
+ viewBox = "0 0 1024 1024" >
35
+ < path
36
+ d = "M450.95,472.227c9.849-5.964,14.944-15.621,14.944-30.576s-4.57-25.491-13.882-31.648c-9.259-6.094-27.422-9.14-54.5-9.14
37
+ h-23.376v80.161h21.628C422.647,481.023,441.111,478.213,450.95,472.227z"
38
+ />
39
+ < path
40
+ d = "M468.179,562.581c-9.666-6.674-27.947-10.02-54.317-10.02h-39.726v87.006h38.149c25.662,0,43.944-3.153,54.661-9.678
41
+ l-0.171,0.193c10.899-6.501,16.166-15.471,16.166-32.335C482.94,580.862,477.845,569.252,468.179,562.581z"
42
+ />
43
+ < path
44
+ d = "M902.656,121.856C870.57,89.088,831.658,72.704,785.92,72.704H238.08c-45.739,0.683-84.651,17.066-116.736,49.152
27
45
c-32.085,32.085-48.128,70.656-48.128,115.712v548.864c0,44.374,16.043,82.944,48.128,115.712
28
46
c32.085,32.77,70.998,49.152,116.736,49.152h547.84c45.738-0.683,84.65-17.065,116.736-49.152
29
47
c32.085-32.085,48.128-70.654,48.128-115.712V237.568C950.784,193.195,934.741,154.624,902.656,121.856z M657.824,312.461h87.887
@@ -33,7 +51,8 @@ export const HatenaIcon = ({
33
51
c0,22.68-5.621,40.424-17.208,53.964c-11.607,13.517-29.889,23.559-55.196,30.404c28.354,2.103,50.52,12.08,66.439,29.889
34
52
c16.007,17.745,23.904,41.476,23.904,71.193C586.116,619.013,581.566,637.829,572.598,653.986z M701.768,711.983
35
53
c-27.938,0-50.597-22.658-50.597-50.616c0-27.957,22.659-50.617,50.597-50.617c27.979,0,50.638,22.66,50.638,50.617
36
- C752.405,689.325,729.746,711.983,701.768,711.983z" />
54
+ C752.405,689.325,729.746,711.983,701.768,711.983z"
55
+ />
37
56
</ svg >
38
57
</ a >
39
58
) ;
0 commit comments