common SemLogo.tsx

100% Statements 4/4

0% Branches 0/2

100% Functions 1/1

100% Lines 4/4

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56  
1x
 
 
 
 
 
 
1x
 
 
 
2x
 
2x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import React from 'react';
import Svg, { G, Path, Text as SvgText } from 'react-native-svg';
 
interface SemLogoProps {
  height?: number;
  color?: string;
}
 
export default function SemLogo({
  height = 32,
  color = '#111827',
}: SemLogoProps) {
  const width = Math.round(height * (470 / 200));
 
  return (
    <Svg
      width={width}
      height={height}
      viewBox="88 0 470 200"
      testID="sem-logo"
      accessibilityLabel="SEM – Social Event Mapper"
    >
      <G transform="translate(140, 100) scale(0.48) translate(-55, -80)">
        <Path
          d="
            M55,0
            C24.6,0 0,24.6 0,55
            C0,85.4 55,164 55,164
            C55,164 110,85.4 110,55
            C110,24.6 85.4,0 55,0 Z
 
            M55,57
            m-30,0
            a30,30 0 1,0 60,0
            a30,30 0 1,0 -60,0
          "
          fill={color}
          fillRule="evenodd"
        />
      </G>
 
      <SvgText
        x="180"
        y="145"
        fontSize="110"
        fontWeight="900"
        fontStyle="italic"
        fill={color}
        letterSpacing="-3"
      >
        SEM
      </SvgText>
    </Svg>
  );
}