insight-ui-zcash/public/views/transaction/tx.html

  <div class="line-bot">
    <a href="/#!/tx/{{tx.txid}}">{{tx.txid}}</a> <a href="#" class="btn-copy" clip-copy="tx.txid"><span class="glyphicon glyphicon-paperclip"></span></a>
    <a class="pull-right" style="margin-left:10px" data-ng-click="itemsExpanded = !itemsExpanded">
      <span class="glyphicon" data-ng-class="{'glyphicon-minus-sign': itemsExpanded, 'glyphicon-plus-sign': !itemsExpanded}" tooltip="Show/Hide items details" tooltip-placement="left"></span>
    </a>
    <span class="pull-right">{{tx.time * 1000 | date:'medium'}}</span>
  </div>

  <div class="row">
    <div class="col-md-5">
      <div class="ellipsis row" data-ng-show="tx.isCoinBase" data-ng-repeat="vin in tx.vin">
        <div class="col-md-10">
          <p class="ellipsis">No Inputs (Newly Generated Coins)</p>
        </div>
        <p class="text-muted pull-right"> <small>{{vin.reward}} BTC</small></p>
      </div>

      <div data-ng-show="!tx.isCoinBase">
        <ul class="list-unstyled" data-ng-repeat="vin in tx.vinSimple" data-ng-show="!itemsExpanded">
          <li class="row">
            <div class="col-md-8">
              <div class="ellipsis">
                <span data-ng-show="vin.notAddr">{{vin.addr}}</span>
                <a data-ng-show="!vin.notAddr" href="/#!/address/{{vin.addr}}">{{vin.addr}}</a>
              </div>
            </div>
            <p class="text-right text-muted"><small>{{vin.value}} BTC</small></p>
        </ul>

        <ul class="list-unstyled" data-ng-repeat="vin in tx.vin" data-ng-show="itemsExpanded">
          <li class="row expanded-tx">
            <a class="col-md-1 glyphicon glyphicon-arrow-right" href="/#!/tx/{{vin.txid}}" alt="Outpoint: {{vin.txid}},{{vin.vout}}" tooltip="Outpoint: {{vin.txid}},{{vin.vout}}"  tooltip-placement="right" >
            </a>
            <div class="col-md-8">
              <div class="ellipsis">
                <span data-ng-show="vin.notAddr">{{vin.addr}}</span>
                <a data-ng-show="!vin.notAddr" href="/#!/address/{{vin.addr}}">{{vin.addr}}</a>
              </div>
              <div style="word-wrap:break-word">
                <small><strong>scriptSig</strong> {{vin.scriptSig.asm}}</small>
              </div>
            </div>
            <p class="text-right text-muted"><small>{{vin.value}} BTC</small></p>
        </ul>
      </div>
    </div>

    <div class="col-md-1 text-center">
      <span class="glyphicon glyphicon-arrow-right lead">&nbsp;</span>
    </div>

    <div class="col-md-6">
      <div class="row">
        <div data-ng-repeat="vout in tx.voutSimple" data-ng-show="!itemsExpanded">
          <div class="col-md-9">
            <div class="ellipsis">
              <span data-ng-show="vout.notAddr">{{vout.addr}}</span>
              <a href="/#!/address/{{address}}"  data-ng-show="!vout.notAddr" data-ng-repeat="address in vout.addr.split(',')">{{address}}</a>
            </div>
          </div>
          <div class="col-md-3">
            <p class="text-right text-muted"> <small>{{vout.value}} BTC</small></p>
          </div>
        </div>
        <div data-ng-repeat="vout in tx.vout" data-ng-show="itemsExpanded">
          <div class="col-md-9 expanded-tx">
            <div class="ellipsis">
              <a href="/#!/address/{{address}}" data-ng-repeat="address in vout.scriptPubKey.addresses">{{address}}</a>
            </div>
            <small><strong>type</strong> {{vout.scriptPubKey.type}}</small>
            <div>
              <small><strong>scriptPubKey</strong> {{vout.scriptPubKey.asm}}</small>
            </div>
          </div>
          <div class="col-md-3">
            <p class="text-right text-muted"> <small>{{vout.value}} BTC</small></p>
          </div>
        </div>

      </div>
    </div>
  </div>

  <div class="line-top">
    <div class="m5v">
      <div class="pull-right">
        <button data-ng-show="tx.confirmations" type="button" class="btn btn-success">
          {{tx.confirmations}} Confirmations
        </button>
        <button data-ng-show="!tx.confirmations"  type="button" class="btn btn-danger">
          Unconfirmed Transaction!
        </button>
        <button type="button" class="btn btn-primary">{{tx.valueOut}} BTC</button>
      </div>
      <small data-ng-show="!tx.isCoinBase" class="text-muted">Fees: {{tx.fees}}</small>
    </div>
  </div>