ak-level 关卡

PREVIEW / LEVEL/BASICOperation level

S4-1

SOURCE / HTML

<div class="ak-level" style="--level-label-text: 'COLOR'">
  <div class="label"></div>
  <div class="content">S4-1</div>
  <div class="prefix-icon prefix-icon--hexagon">
    <svg class="ak-icon" aria-hidden="true"><use href="#icon-vip-diamond-fill"></use></svg>
  </div>
  <div class="suffix-icon"><img src="https://assets.yunyoujun.cn/ak-ui/assets/img/game/primary-combat-record-980d45fd3764.webp" alt="初级作战记录"></div>
</div>

Variable	Description
--level-label-text	头部标签文本
--level-label-bgcolor	头部标签背景色
--level-prefix-icon-color	前缀图标颜色

可选择的关卡

把 ak-level 写成 button 即可作为关卡节点：悬停时上浮，aria-pressed="true" 时显示信号色描边。主终端的作战页用它选择关卡。