{{extend elemLayout}}

{{block 'css'}}
<link rel="stylesheet" type="text/css" href="{{_res_path}}/character/detail.css"/>
<link rel="stylesheet" type="text/css" href="{{_res_path}}/character/artis.css"/>
{{/block}}

{{block 'main'}}
<div class="artis">
  {{each artis ds}}
  <div class="item arti">
    {{if ds.name && ds.main && ds.main[0] && ds.main[0]!="undefined"}}
    <div class="avatar">
      <img src="{{_res_path}}meta/character/{{ds.avatar}}/side.png" onerror="whenError(this)"/>
    </div>
    <div class="arti-icon">
      <img src="{{_sys_res_path}}/genshin/logo/reliquaries/{{ds.name}}.png"/>
    </div>
    <div class="head">
      <strong>{{ds.name}}</strong>
      <span class="mark mark-{{ds.markType}}"><span>{{ds.mark}}分</span> - {{ds.markType}}</span>
    </div>
    <ul class="detail">
      <li class="arti-main"><span class="title">{{ds.main[0]}}</span><span class="val">+{{ds.main[1]}}</span></li>
      {{each ds.attrs attr}}
      {{if attr[0]}}
      <li class="{{ds.usefulMark[attr[0]] ? `useful`:`nouse`}}"><span class="title">{{attr[0]}}</span><span
          class="val">+{{attr[1]}}</span></li>
      {{/if}}
      {{/each}}
    </ul>
    {{/if}}
  </div>
  {{/each}}
</div>
{{/block}}