diff --git a/res/app/device-list/device-list.css b/res/app/device-list/device-list.css index 6429f696..96839d70 100644 --- a/res/app/device-list/device-list.css +++ b/res/app/device-list/device-list.css @@ -101,4 +101,23 @@ ul.devices-icon-view .device-is-busy { ul.devices-icon-view .device-is-busy .device-photo-small img { opacity: 0.5; -} \ No newline at end of file +} + +.stf-device-list .device-small-image { + margin-right: 8px; +} +.stf-device-list .device-small-image img { + height: 20px; +} + + +.device-list-active-tabs.ng-enter { + -webkit-transition: 150ms; + transition: 150ms; + margin-top: -100%; +} + +.device-list-active-tabs.ng-enter-active { + margin-top: 0; +} + diff --git a/res/app/device-list/device-list.jade b/res/app/device-list/device-list.jade index d13245f8..f0dcbc07 100644 --- a/res/app/device-list/device-list.jade +++ b/res/app/device-list/device-list.jade @@ -3,12 +3,12 @@ div.stf-device-list .col-md-12 .widget-container.fluid-height .widget-content.padded - tabset.overflow-auto(ng-if='activeTabs') + tabset.overflow-auto(ng-if='activeTabs').device-list-active-tabs tab(active='activeTabs.devices') tab-heading i.fa.fa-th-large span(translate) Devices - div(ng-if='activeTabs.devices') + div(ng-if='activeTabs.devices').device-list-devices-content nothing-to-show(message='{{"No devices connected"|translate}}', icon='fa-sitemap', ng-show='!tracker.devices.length') ul.devices-icon-view @@ -39,7 +39,7 @@ div.stf-device-list tab-heading i.fa.fa-list(translate) span(translate) Details - div(ng-show='activeTabs.details', ng-controller='DeviceListDetailsCtrl') + div(ng-show='activeTabs.details', ng-controller='DeviceListDetailsCtrl').device-list-details-content nothing-to-show(message='{{"No devices connected"|translate}}', icon='fa-sitemap', ng-show='!tracker.devices.length') .filtering-buttons @@ -67,6 +67,10 @@ div.stf-device-list button(ng-class='{"btn-primary": device.state == "using", "btn-primary-outline": device.state == "available"}', ng-click='device.usable && toggle(device)').btn.btn-xs.device-status {{device.state|statusName}} td(data-title="'Model'|translate", sortable='"model"', filter='{"model": "text"}') + + span.device-small-image + img(ng-src='/static/devices/icon/x24/{{ device.image || "_default.jpg" }}') + span {{device.model}} td(data-title="'Product'|translate", sortable='"name"', filter='{"name": "text"}') span {{device.name}}