<template>
  <div class="coin-info">
    <div class="info-name pf500 fs16 fc2C3131">
      <img src="../../../assets/icon/coin/bnb.svg" alt="" />BTC/USDT
    </div>
    <div class="info-rank">
      <div class="pf400 fs14 fc666666">排名</div>
      <div class="pf500 fs14 fcDF384C">NO.1</div>
    </div>
    <div class="info-first margin-top15">
      <div class="pf400 fs14 fc666666">市值</div>
      <div class="first-right">
        <div class="pf500 fs12 fc666666">＄2.16兆</div>
        <div class="about pf400 fs10 fcA8A8A8">≈15.8 兆</div>
      </div>
    </div>
    <div class="info-first margin-top8">
      <div class="pf400 fs14 fc666666">完全释稀市值</div>
      <div class="first-right">
        <div class="pf500 fs12 fc666666">＄2.27兆</div>
        <div class="about pf400 fs10 fcA8A8A8">≈16.2 兆</div>
      </div>
    </div>
    <div class="info-second margin-top3">
      <div class="pf400 fs14 fc666666">市场占有率</div>
      <div class="pf500 fs12 fc666666">59.0507%</div>
    </div>
    <div class="info-first margin-top3">
      <div class="pf400 fs14 fc666666">成交量</div>
      <div class="first-right">
        <div class="pf500 fs12 fc666666">＄1036.15亿</div>
        <div class="about pf400 fs10 fcA8A8A8">≈7382.51 亿</div>
      </div>
    </div>
    <div class="info-second margin-top3">
      <div class="pf400 fs14 fc666666">成交量/市值</div>
      <div class="pf500 fs12 fc666666">4.80%</div>
    </div>
    <div class="info-second margin-top8">
      <div class="pf400 fs14 fc666666">流通数量</div>
      <div class="pf500 fs12 fc666666">1993.80万 BTC</div>
    </div>
    <div class="info-second margin-top8">
      <div class="pf400 fs14 fc666666">最大供给量</div>
      <div class="pf500 fs12 fc666666">2100万 BTC</div>
    </div>
    <div class="info-second margin-top8">
      <div class="pf400 fs14 fc666666">总量</div>
      <div class="pf500 fs12 fc666666">1993.80万 BTC</div>
    </div>
    <div class="info-second margin-top8">
      <div class="pf400 fs14 fc666666">场内持仓集中度</div>
      <div class="pf500 fs12 fc666666">0.55</div>
    </div>
    <div class="info-second margin-top8">
      <div class="pf400 fs14 fc666666">发行日期</div>
      <div class="pf500 fs12 fc666666">2009-01-03</div>
    </div>
    <div class="info-third margin-top8">
      <div class="pf400 fs14 fc666666">历史最高价</div>
      <div class="first-right">
        <div class="pf500 fs12 fc666666">＄1251850.0696</div>
        <div class="about pf400 fs10 fc666666">≈899786.3216</div>
        <div class="about pf400 fs10 fcA8A8A8">2025-10-07</div>
      </div>
    </div>
    <div class="info-third margin-top8">
      <div class="pf400 fs14 fc666666">历史最低价</div>
      <div class="first-right">
        <div class="pf500 fs12 fc666666">＄1251850.0696</div>
        <div class="about pf400 fs10 fc666666">≈899786.3216</div>
        <div class="about pf400 fs10 fcA8A8A8">2025-10-07</div>
      </div>
    </div>
    <div class="link-text margin-top8 pf600 fs14 fc121212">链接</div>
    <div class="info-second margin-top8">
      <div class="pf400 fs14 fc666666">官方网站</div>
      <div class="pf500 fs12 fc666666">Official Website</div>
    </div>
    <div class="info-second margin-top8">
      <div class="pf400 fs14 fc666666">区块浏览器</div>
      <div class="pf500 fs12 fc666666">blockchain.info</div>
    </div>
    <div class="book-text margin-top3 pf600 fs12 fc666666">白皮书</div>
    <div class="link-text margin-top8 pf600 fs14 fc121212">介绍</div>
    <div class="coin-desc pf400 fs12 fc666666">
      比特币(BTC)是一种点对点加密货币，旨在充当独立于任何中央机构的一种交易手段。BTC可以安全，可验证和不变的方式进行电子现金转移。BTC于2009年推出，是通过在交易信息广播到比特币网络中的所有节点之前加盖交易时间戳的"第一种解决双重支出问题的虚拟数字货币”。比特币协议通过blockchain网络结构为拜占庭容错问题提供了解决方案，该概念最初由Stuart
      Haber和W.Scott Stornetta创建1991年...
    </div>
    <div class="buy-sell pf500 fs16 fcFFFFFF">
      <div class="buy-btn">买入(做多)</div>
      <div class="sell-btn">卖出(做空)</div>
    </div>
  </div>
</template>
<script setup></script>
<style lang="less" scoped>
  .coin-info {
    width: 349px;

    .margin-top15 {
      margin-top: 15px;
    }

    .margin-top8 {
      margin-top: 8px;
    }

    .margin-top3 {
      margin-top: 3px;
    }

    .info-name {
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      align-items: center;
      margin-top: 14px;
      width: 100%;
      height: 35px;

      img {
        margin-right: 7px;
        width: 35px;
        height: 35px;
      }
    }

    .info-rank {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      margin-top: 16px;
      width: 100%;
      height: 20px;
    }

    .info-first {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      width: 349px;
      height: 37px;

      .first-right {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: flex-end;

        .about {
          margin-top: 3px;
        }
      }
    }

    .info-second {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      width: 100%;
      height: 20px;
    }

    .info-third {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      width: 100%;
      height: 54px;

      .first-right {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: flex-end;

        .about {
          margin-top: 3px;
        }
      }
    }

    .book-text {
      width: 100%;
      height: 24px;
      line-height: 24px;
      text-align: end;
    }

    .coin-desc {
      margin-top: 4px;
      width: 100%;
      line-height: 24px;
      letter-spacing: 0.2px;
    }

    .buy-sell {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      margin-top: 15px;
      width: 345px;
      height: 38px;

      .buy-btn {
        width: 164px;
        height: 38px;
        line-height: 38px;
        text-align: center;
        background: #45b26b;
        border-radius: 6px;
      }

      .sell-btn {
        width: 164px;
        height: 38px;
        line-height: 38px;
        text-align: center;
        background: #df384c;
        border-radius: 6px;
      }
    }
  }
</style>
