Pending Enhancements - dbtech_shop_itembit_inventory

[Sbenny]

Just some hints about possible enhancements (graphic level) for the template shown in the inventory. I think it's more intuitive this way. Please note I modified only a few lines, some are unmodified because I didn't need them, but you can easily adapt the changes to the whole file.

Requires FontAwesome which is enabled by default on Xenforo.

If the below text is confusing, here's a pastebin: <xf:css src="structured_list.less" /> <xf:css src="dbtech_shop_structured_list_ - Pastebin.com

Enjoy:


<xf:css src="structured_list.less" />
<xf:css src="dbtech_shop_structured_list_item.less" />

<div class="structItem{{ !$item.active ? ' is-deleted' : '' }}{{ $item.hidden ? ' is-moderated' : '' }}">
<div class="structItem-cell structItem-cell--icon">
<div class="structItem-iconContainer">
<a class="avatar avatar--s" href="{{ link('dbtech-shop/item', {'id': $item.purchaseid, 'title': $item.title}, {'shopid': $item.shopid, 'action': 'info'}) }}" data-xf-click="overlay" data-xf-init="member-tooltip" data-user-id="{$item.itemid}-{$item.shopid}"><img src="{$item.shopicon}" alt="{$item.title}" /></a>
<a class="avatar--separated structItem-secondaryIcon" href="{{ link('dbtech-shop/item', {'id': $item.purchaseid, 'title': $item.title}, {'shopid': $item.shopid, 'action': 'info'}) }}" data-xf-click="overlay" data-xf-init="member-tooltip" data-user-id="{$item.itemid}-{$item.shopid}"><img src="{$item.icon}" alt="{$item.title}" /></a>
</div>
</div>
<div class="structItem-cell structItem-cell--main">
<xf:if is="{$item.userid} == {$visitor.user_id}">
<div class="structItem-minor">
<ul class="structItem-extraInfo">
<li>
<a href="{{ link('dbtech-shop/inventory', {'id': $item.purchaseid, 'title': $item.title}, {'action': 'discard'}) }}" data-xf-click="overlay" data-xf-init="tooltip" data-original-title="Discard (remove this item from your inventory)"><i class="fa fa-trash" style="color:#ca0000"></i></a>
</li>

<xf:if is="{$item._sellback}">
<li>
<a href="{{ link('dbtech-shop/inventory', {'id': $item.purchaseid, 'title': $item.title}, {'action': 'sell'}) }}" data-xf-click="overlay">{{ phrase('dbtech_shop.sellback') }}</a>
</li>
</xf:if>

<!--DBT_PRO_START-->
<xf:if is="{$item._gift}">
<li>
<a href="{{ link('dbtech-shop/inventory', {'id': $item.purchaseid, 'title': $item.title}, {'action': 'gift'}) }}" data-xf-click="overlay" data-xf-init="tooltip" data-original-title="Gift (send this item to another user)"><i class="fa fa-gift"></i></a>
</li>
</xf:if>
<!--DBT_PRO_END-->
</ul>
</div>
</xf:if>

<div class="structItem-title">
<a href="{{ link('dbtech-shop/item', {'id': $item.itemid, 'title': $item.title}, {'shopid': $item.shopid, 'action': 'info'}) }}" data-xf-click="overlay" data-xf-init="member-tooltip" data-user-id="{$item.itemid}-{$item.shopid}">{$item.title}</a>
</div>

<div class="structItem-minor">
<ul class="structItem-parts">
<li>
<xf:username user="$item" rich="true" />
</li>
<li class="structItem-startDate"><xf:date time="{$item.dateline}" /></li>
<xf:if is="$item.message is not empty">
<li>{$item.message}</li>
</xf:if>
</ul>
</div>

<xf:if is="$item.description">
<div class="structItem-minor">{$item.description|raw}</div>
</xf:if>

<xf:if is="{$item.userid} == {$visitor.user_id}">
<div class="structItem-minor">
<ul class="structItem-extraInfo">
<li>
<a href="{{ link('dbtech-shop/inventory', {'id': $item.purchaseid, 'title': $item.title}, {'action': 'info'}) }}" data-xf-click="overlay" data-xf-init="tooltip" data-original-title="Enable/Disable this item and all its effects."><i class="fa fa-toggle-on"></i></a>
</li>

<xf:if is="{$item._configure}">
<li>
<a href="{{ link('dbtech-shop/inventory', {'id': $item.purchaseid, 'title': $item.title}, {'action': 'configure'}) }}" data-xf-click="overlay" data-xf-init="tooltip" data-original-title="Configure this item."><i class="fa fa-cog"></i></a>
</li>
</xf:if>
</ul>
</div>
</xf:if>
</div>
<div class="structItem-cell structItem-cell--meta">

<dl class="pairs pairs--justified">
<dt>{{ phrase('dbtech_shop.active') }}</dt>
<dd>{{ $item.active ? phrase('yes') : phrase('no') }}</dd>
</dl>

<dl class="pairs pairs--justified">
<dt>{{ phrase('dbtech_shop.hidden') }}</dt>
<dd>{{ $item.hidden ? phrase('yes') : phrase('no') }}</dd>
</dl>

<dl class="pairs pairs--justified">
<dt>{{ phrase('dbtech_shop.unique') }}</dt>
<dd>{{ $item.uniqueitem ? phrase('yes') : phrase('no') }}</dd>
</dl>

<dl class="pairs pairs--justified">
<dt>{{ phrase('dbtech_shop.exclusive') }}</dt>
<dd>{{ $item.exclusiveitem ? phrase('yes') : phrase('no') }}</dd>
</dl>

<xf:if is="{$item.buybackprice} > 0 AND {$item._sellback}">
<dl class="pairs pairs--justified">
<dt>{{ phrase('dbtech_shop.buyback_price') }}</dt>
<dd>{$buybackcurrency.prefix}{$item.buybackprice_formatted}{$buybackcurrency.suffix}</dd>
</dl>

<dl class="pairs pairs--justified">
<dt>{{ phrase('dbtech_shop.buyback_time') }}</dt>
<dd>{$item.buybacktime_formatted}</dd>
</dl>
</xf:if>

<dl class="pairs pairs--justified">
<dt>{{ phrase('dbtech_shop.expiry') }}</dt>
<dd>
<xf:if is="{$item.expirydate}">
<xf:date time="{$item.expirydate}" />
<xf:else />
{{ phrase('never') }}
</xf:if>
</dd>
</dl>
</div>
</div>