source/AriaNg
1
0
Fork 0
mirror of https://github.com/mayswind/AriaNg.git synced 2026-02-09 02:49:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

optimize clickable header style

Browse Source
This commit is contained in:
MaysWind
2022-10-20 02:26:31 +08:00
parent f0d51db398
commit 40cb092049
4 changed files with 44 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/styles/core/extend.css
View File

@@ -93,6 +93,10 @@
bottom: -6px;
}
.fa-display-order {
margin-left: 3px;
}
.fa-order-asc, .fa-order-desc {
position: relative;
}

2
src/views/debug.html
View File

@@ -13,7 +13,7 @@
<div class="row">
<div class="col-sm-12">
<a ng-click="changeLogListDisplayOrder('time:asc', true)">
<span translate>Logging Time</span>&nbsp;<i class="fa" ng-class="{'fa-sort-asc fa-order-asc': isLogListSetDisplayOrder('time:asc'), 'fa-sort-desc fa-order-desc': isLogListSetDisplayOrder('time:desc')}"></i>
<span translate>Logging Time</span><i class="fa fa-display-order" ng-class="{'fa-sort-asc fa-order-asc': isLogListSetDisplayOrder('time:asc'), 'fa-sort-desc fa-order-desc': isLogListSetDisplayOrder('time:desc')}"></i>
</a>
<div class="settings-table-title-toolbar">
<div class="btn-group">

25
src/views/list.html
View File

@@ -5,30 +5,35 @@
<div class="col-md-8 col-sm-7">
<div class="row">
<div class="col-sm-8">
<a ng-click="changeDisplayOrder('name:asc', true)" translate>File Name</a>
<i class="fa" ng-class="{'fa-sort-asc fa-order-asc': isSetDisplayOrder('name:asc'), 'fa-sort-desc fa-order-desc': isSetDisplayOrder('name:desc')}"></i>
<a ng-click="changeDisplayOrder('name:asc', true)">
<span translate>File Name</span><i class="fa fa-display-order" ng-class="{'fa-sort-asc fa-order-asc': isSetDisplayOrder('name:asc'), 'fa-sort-desc fa-order-desc': isSetDisplayOrder('name:desc')}"></i>
</a>
</div>
<div class="col-sm-4">
<a ng-click="changeDisplayOrder('size:asc', true)" translate>File Size</a>
<i class="fa" ng-class="{'fa-sort-asc fa-order-asc': isSetDisplayOrder('size:asc'), 'fa-sort-desc fa-order-desc': isSetDisplayOrder('size:desc')}"></i>
<a ng-click="changeDisplayOrder('size:asc', true)">
<span translate>File Size</span><i class="fa fa-display-order" ng-class="{'fa-sort-asc fa-order-asc': isSetDisplayOrder('size:asc'), 'fa-sort-desc fa-order-desc': isSetDisplayOrder('size:desc')}"></i>
</a>
</div>
</div>
</div>
<div class="col-md-2 col-sm-3">
<div class="row">
<div class="col-sm-6">
<a ng-click="changeDisplayOrder('percent:desc', true)" translate>Progress</a>
<i class="fa" ng-class="{'fa-sort-asc fa-order-asc': isSetDisplayOrder('percent:asc'), 'fa-sort-desc fa-order-desc': isSetDisplayOrder('percent:desc')}"></i>
<a ng-click="changeDisplayOrder('percent:desc', true)">
<span translate>Progress</span><i class="fa fa-display-order" ng-class="{'fa-sort-asc fa-order-asc': isSetDisplayOrder('percent:asc'), 'fa-sort-desc fa-order-desc': isSetDisplayOrder('percent:desc')}"></i>
</a>
</div>
<div class="col-sm-6">
<a ng-click="changeDisplayOrder('remain:asc', true)" translate>Remaining</a>
<i class="fa" ng-class="{'fa-sort-asc fa-order-asc': isSetDisplayOrder('remain:asc'), 'fa-sort-desc fa-order-desc': isSetDisplayOrder('remain:desc')}"></i>
<a ng-click="changeDisplayOrder('remain:asc', true)">
<span translate>Remaining</span><i class="fa fa-display-order" ng-class="{'fa-sort-asc fa-order-asc': isSetDisplayOrder('remain:asc'), 'fa-sort-desc fa-order-desc': isSetDisplayOrder('remain:desc')}"></i>
</a>
</div>
</div>
</div>
<div class="col-md-2 col-sm-2">
<a ng-click="changeDisplayOrder('dspeed:desc', true)" translate>Download Speed</a>
<i class="fa" ng-class="{'fa-sort-asc fa-order-asc': isSetDisplayOrder('dspeed:asc'), 'fa-sort-desc fa-order-desc': isSetDisplayOrder('dspeed:desc')}"></i>
<a ng-click="changeDisplayOrder('dspeed:desc', true)">
<span translate>Download Speed</span><i class="fa fa-display-order" ng-class="{'fa-sort-asc fa-order-asc': isSetDisplayOrder('dspeed:asc'), 'fa-sort-desc fa-order-desc': isSetDisplayOrder('dspeed:desc')}"></i>
</a>
</div>
</div>
</div>

40
src/views/task-detail.html
View File

@@ -182,17 +182,20 @@
<div class="task-table-title">
<div class="row">
<div class="col-sm-8">
<a ng-click="changeFileListDisplayOrder('name:asc', true)" ng-class="{true: 'default-cursor'}[task.multiDir]" translate>File Name</a>
<i ng-if="!task.multiDir" class="fa" ng-class="{'fa-sort-asc fa-order-asc': isSetFileListDisplayOrder('name:asc'), 'fa-sort-desc fa-order-desc': isSetFileListDisplayOrder('name:desc')}"></i>
<a ng-click="changeFileListDisplayOrder('name:asc', true)" ng-class="{true: 'default-cursor'}[task.multiDir]">
<span translate>File Name</span><i ng-if="!task.multiDir" class="fa fa-display-order" ng-class="{'fa-sort-asc fa-order-asc': isSetFileListDisplayOrder('name:asc'), 'fa-sort-desc fa-order-desc': isSetFileListDisplayOrder('name:desc')}"></i>
</a>
<a ng-click="showChooseFilesToolbar()" ng-if="task && task.files && task.files.length > 1 && (task.status === 'waiting' || task.status === 'paused')" translate>(Choose Files)</a>
</div>
<div class="col-sm-2">
<a ng-click="changeFileListDisplayOrder('percent:desc', true)" ng-class="{true: 'default-cursor'}[task.multiDir]" translate>Progress</a>
<i ng-if="!task.multiDir" class="fa" ng-class="{'fa-sort-asc fa-order-asc': isSetFileListDisplayOrder('percent:asc'), 'fa-sort-desc fa-order-desc': isSetFileListDisplayOrder('percent:desc')}"></i>
<a ng-click="changeFileListDisplayOrder('percent:desc', true)" ng-class="{true: 'default-cursor'}[task.multiDir]">
<span translate>Progress</span><i ng-if="!task.multiDir" class="fa fa-display-order" ng-class="{'fa-sort-asc fa-order-asc': isSetFileListDisplayOrder('percent:asc'), 'fa-sort-desc fa-order-desc': isSetFileListDisplayOrder('percent:desc')}"></i>
</a>
</div>
<div class="col-sm-2">
<a ng-click="changeFileListDisplayOrder('size:asc', true)" ng-class="{true: 'default-cursor'}[task.multiDir]" translate>File Size</a>
<i ng-if="!task.multiDir" class="fa" ng-class="{'fa-sort-asc fa-order-asc': isSetFileListDisplayOrder('size:asc'), 'fa-sort-desc fa-order-desc': isSetFileListDisplayOrder('size:desc')}"></i>
<a ng-click="changeFileListDisplayOrder('size:asc', true)" ng-class="{true: 'default-cursor'}[task.multiDir]">
<span translate>File Size</span><i ng-if="!task.multiDir" class="fa fa-display-order" ng-class="{'fa-sort-asc fa-order-asc': isSetFileListDisplayOrder('size:asc'), 'fa-sort-desc fa-order-desc': isSetFileListDisplayOrder('size:desc')}"></i>
</a>
</div>
</div>
</div>
@@ -286,11 +289,13 @@
<div class="task-table-title">
<div class="row">
<div class="col-md-4 col-sm-4">
<a ng-click="changePeerListDisplayOrder('address:asc', true)" translate>Address</a>
<i class="fa" ng-class="{'fa-sort-asc fa-order-asc': isSetPeerListDisplayOrder('address:asc'), 'fa-sort-desc fa-order-desc': isSetPeerListDisplayOrder('address:desc')}"></i>
<a ng-click="changePeerListDisplayOrder('address:asc', true)">
<span translate>Address</span><i class="fa fa-display-order" ng-class="{'fa-sort-asc fa-order-asc': isSetPeerListDisplayOrder('address:asc'), 'fa-sort-desc fa-order-desc': isSetPeerListDisplayOrder('address:desc')}"></i>
</a>
<span>/</span>
<a ng-click="changePeerListDisplayOrder('client:asc', true)" translate>Client</a>
<i class="fa" ng-class="{'fa-sort-asc fa-order-asc': isSetPeerListDisplayOrder('client:asc'), 'fa-sort-desc fa-order-desc': isSetPeerListDisplayOrder('client:desc')}"></i>
<a ng-click="changePeerListDisplayOrder('client:asc', true)">
<span translate>Client</span><i class="fa fa-display-order" ng-class="{'fa-sort-asc fa-order-asc': isSetPeerListDisplayOrder('client:asc'), 'fa-sort-desc fa-order-desc': isSetPeerListDisplayOrder('client:desc')}"></i>
</a>
</div>
<div class="col-md-5 col-sm-4">
<div class="row">
@@ -298,17 +303,20 @@
<span translate>Status</span>
</div>
<div class="col-sm-6 text-right">
<a ng-click="changePeerListDisplayOrder('percent:desc', true)" translate>Progress</a>
<i class="fa" ng-class="{'fa-sort-asc fa-order-asc': isSetPeerListDisplayOrder('percent:asc'), 'fa-sort-desc fa-order-desc': isSetPeerListDisplayOrder('percent:desc')}"></i>
<a ng-click="changePeerListDisplayOrder('percent:desc', true)">
<span translate>Progress</span><i class="fa fa-display-order" ng-class="{'fa-sort-asc fa-order-asc': isSetPeerListDisplayOrder('percent:asc'), 'fa-sort-desc fa-order-desc': isSetPeerListDisplayOrder('percent:desc')}"></i>
</a>
</div>
</div>
</div>
<div class="col-md-3 col-sm-4">
<a ng-click="changePeerListDisplayOrder('dspeed:desc', true)" translate>Download</a>
<i class="fa" ng-class="{'fa-sort-asc fa-order-asc': isSetPeerListDisplayOrder('dspeed:asc'), 'fa-sort-desc fa-order-desc': isSetPeerListDisplayOrder('dspeed:desc')}"></i>
<a ng-click="changePeerListDisplayOrder('dspeed:desc', true)">
<span translate>Download</span><i class="fa fa-display-order" ng-class="{'fa-sort-asc fa-order-asc': isSetPeerListDisplayOrder('dspeed:asc'), 'fa-sort-desc fa-order-desc': isSetPeerListDisplayOrder('dspeed:desc')}"></i>
</a>
<span>/</span>
<a ng-click="changePeerListDisplayOrder('uspeed:desc', true)" translate>Upload</a>
<i class="fa" ng-class="{'fa-sort-asc fa-order-asc': isSetPeerListDisplayOrder('uspeed:asc'), 'fa-sort-desc fa-order-desc': isSetPeerListDisplayOrder('uspeed:desc')}"></i>
<a ng-click="changePeerListDisplayOrder('uspeed:desc', true)">
<span translate>Upload</span><i class="fa fa-display-order" ng-class="{'fa-sort-asc fa-order-asc': isSetPeerListDisplayOrder('uspeed:asc'), 'fa-sort-desc fa-order-desc': isSetPeerListDisplayOrder('uspeed:desc')}"></i>
</a>
<span translate>Speed</span>
</div>
</div>