All files index.js

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
57
58
59
 
 
 
 
 
 
 
1x
 
 
 
 
 
 
1x
 
 
 
 
 
 
1x
 
11x
11x
 
11x
8x
 
 
11x
 
 
 
 
 
11x
 
 
 
 
11x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import React from 'react';
 
import {
  RibbonStyle,
  RibbonStyleWrapper
} from './ribbonStyle';
 
const positionMapping = {
  left: [RibbonStyle.leftStyle, RibbonStyleWrapper.leftStyle],
  right: [RibbonStyle.rightStyle, RibbonStyleWrapper.rightStyle],
  'left-bottom': [RibbonStyle.leftBottomStyle, RibbonStyleWrapper.leftBottomStyle],
  'right-bottom': [RibbonStyle.rightBottomStyle, RibbonStyleWrapper.rightBottomStyle],
};
 
const colorMapping = {
  red: RibbonStyle.redColor,
  orange: RibbonStyle.orangeColor,
  black: RibbonStyle.blackColor,
  green: RibbonStyle.greenColor,
};
 
const GitHubForkRibbon = ({position = 'right', href, target, color = 'red', children, ...other}) => {
 
  const positionStyle = positionMapping[position] || [RibbonStyle.rightStyle, RibbonStyleWrapper.rightStyle];
  const colorStyle = colorMapping[color] || RibbonStyle.redColor;
 
  if (positionStyle[0] === RibbonStyle.rightStyle) {
    position = 'right';
  }
 
  const ribbonStyle = {
    ...RibbonStyle.baseStyle,
    ...positionStyle[0],
    ...colorStyle
  };
 
  const wrapperStyle = {
    ...RibbonStyleWrapper.baseStyle,
    ...positionStyle[1],
  };
 
  return (
    <div {...other}
         className={`github-fork-ribbon-wrapper ${position}`}
         style={wrapperStyle}>
      <div className="github-fork-ribbon"
           style={ribbonStyle}>
        <a href={href}
           target={target}
           style={RibbonStyle.urlStyle}>
          {children}
        </a>
      </div>
    </div>
  );
};
 
export default global.RibbonStyle = GitHubForkRibbon;