<div class="row">
    <div class="col-sm-4">
        <div class="panel">
            <div class="panel-heading c_deepPurpleG300to500">
                <h3 class="panel-title">Block Height {{block.height}}</h3>
            </div>
            <div class="panel-body">
                Block Hash:
                <p style="font-size: 9px;">
                    {{block.hash}}
                </p>
            </div>
        </div>
    </div>
    <div class="col-sm-8">
        <div class="panel">
            <div class="panel-heading c_deepPurpleG300to500">
                <h3 class="panel-title">Block transactions flow</h3>
            </div>
            <div class="panel-body" style="height: 300px;overflow-y: hidden;">
                <div id="sankeyChart">
                    <canvas></canvas>
                    <svg></svg>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-sm-12">
        <div class="panel">
            <div class="panel-heading c_deepPurpleG300to500">
                <h3 class="panel-title">Tx in block</h3>
            </div>
            <div class="panel-body">
                <div class="col-sm-12">
                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th>Txid</th>
                                <th>Input</th>
                                <th>Output</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="tx in block.txs">
                                <td style="max-width:20px; overflow:hidden;">
                                    <a ng-href="#!/tx/{{tx.txid}}" class="list-group-item-text">
                                        {{tx.txid}}
                                    </a>
                                </td>
                                <td style="max-width:20px; overflow:hidden;">
                                    <table><tbody><tr ng-repeat="vin in tx.vin"><td>
                                        <a ng-href="#!/address/{{vin.address}}" class="list-group-item-text">
                                            {{vin.address}}
                                        </a>
                                        :{{vin.amount}}
                                    </td></tr></tbody></table>
                                </td>
                                <td style="max-width:20px; overflow:hidden;">
                                    <table><tbody><tr ng-repeat="vout in tx.vout"><td>
                                        <a ng-href="#!/address/{{vout.address}}" class="list-group-item-text">
                                            {{vout.address}}
                                        </a>
                                        :{{vout.value}}
                                    </td></tr></tbody></table>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
