Offset connector line and too short match boxes

[RooRoo6080]

The image in the readme looks great, but when I run it I see something like this:

To compare, what's on the demo looks like this:

How do I make the spacing and alignment look that good, and could those aesthetics be brought back into the current version?

[Shenato]

I think you might be using incorrect data and that's why it looks the way it does. can you share the data you're feeding the component?

[RooRoo6080]

The same problem occurs when using the sample data. I ended up fixing it by editing some values in bundle.js when installed from npm. I believe it was somewhere between line 61 and 85. In general, these are nice values to edit to change the looks. This is what I use now:

      width: 125,
      boxHeight: 125,
      canvasPadding: 50,
      spaceBetweenColumns: 15,
      spaceBetweenRows: -60,
      connectorColor: "#415a77",
      connectorColorHighlight: "#DDD",
      roundHeader: {
        isShown: !0,
        height: 10,
        marginBottom: 0,
        fontSize: 12,
        fontColor: "white",
        backgroundColor: "rgb(47, 54, 72)",
        fontFamily: '"Montserrat", "Arial", "Helvetica", "sans-serif"',
        roundTextGenerator: void 0
      },
      roundSeparatorWidth: 0,
      lineInfo: {
        separation: -13,
        homeVisitorSpread: 0.5
      },
      horizontalOffset: 8,
      wonBywalkOverText: "WO",
      lostByNoShowText: "NS"

[Shenato]

Could you open a PR with a fix on the project's new repository since this repository has no maintainers with access to it anymore more details here https://github.com/g-loot/react-tournament-brackets/issues/78