modify "new task" page style

This commit is contained in:
MaysWind 2016-07-31 22:26:25 +08:00
parent 624f9617e2
commit 9d6dae708e
3 changed files with 75 additions and 46 deletions

View file

@ -3,6 +3,10 @@
font-size: 0.5em; font-size: 0.5em;
} }
.fa-1_1x {
font-size: 1.1em;
}
.fa-rotate-45 { .fa-rotate-45 {
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
-webkit-transform: rotate(45deg); -webkit-transform: rotate(45deg);

View file

@ -277,6 +277,25 @@
border-bottom: inherit; border-bottom: inherit;
} }
.skin-aria-ng .nav-tabs-custom > .nav-tabs > li.divider {
padding: 10px 0 10px 0;
margin-left: 4px;
margin-right: 4px;
margin-top: 11px;
border-right: 1px solid #ccc;
}
.skin-aria-ng .nav-tabs-custom > .nav-tabs > li.nav-toolbar {
margin-left: 15px;
margin-right: 10px;
}
@media (max-width: 767px) {
.skin-aria-ng .nav-tabs-custom > .nav-tabs > li.nav-toolbar {
float: right;
}
}
.skin-aria-ng .nav-tabs-custom > .nav-tabs > li > a { .skin-aria-ng .nav-tabs-custom > .nav-tabs > li > a {
color: #aaa; color: #aaa;
border: 0; border: 0;
@ -288,6 +307,11 @@
color: #208fe5; color: #208fe5;
} }
.skin-aria-ng .nav-tabs-custom > .nav-tabs > li > div.btn-group {
padding-top: 5px;
padding-bottom: 5px;
}
.skin-aria-ng .tooltip.tooltip-success.in, .skin-aria-ng .tooltip.tooltip-warning.in, .skin-aria-ng .tooltip.tooltip-error.in { .skin-aria-ng .tooltip.tooltip-success.in, .skin-aria-ng .tooltip.tooltip-warning.in, .skin-aria-ng .tooltip.tooltip-error.in {
filter: alpha(opacity=95); filter: alpha(opacity=95);
opacity: 0.95 opacity: 0.95

View file

@ -1,23 +1,49 @@
<section class="content no-padding"> <section class="content no-padding">
<div class="nav-tabs-custom"> <form name="newTaskForm" ng-submit="startDownload()" novalidate>
<ul class="nav nav-tabs"> <div class="nav-tabs-custom">
<li ng-class="{'active': context.currentTab == 'links'}"> <ul class="nav nav-tabs">
<a class="pointer-cursor" ng-click="changeTab('links')" translate>Links</a> <li ng-class="{'active': context.currentTab == 'links'}">
</li> <a class="pointer-cursor" ng-click="changeTab('links')" translate>Links</a>
<li ng-class="{'active': context.currentTab == 'options'}"> </li>
<a class="pointer-cursor" ng-click="changeTab('options')" translate>Options</a> <li ng-class="{'active': context.currentTab == 'options'}">
</li> <a class="pointer-cursor" ng-click="changeTab('options')" translate>Options</a>
</ul> </li>
<li class="divider"></li>
<li class="nav-toolbar">
<div class="btn-group">
<button type="button" class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-folder-open-o fa-1_1x"></i>
</button>
<ul class="dropdown-menu right-align">
<li><a class="pointer-cursor" ng-click="openTorrent()" translate>Open Torrent File</a></li>
<li><a class="pointer-cursor" ng-click="openMetalink()" translate>Open Metalink File</a></li>
</ul>
</div>
<div class="btn-group">
<button type="submit" class="btn btn-sm"
ng-class="{'btn-default': newTaskForm.$invalid, 'btn-success': !newTaskForm.$invalid}"
ng-disabled="newTaskForm.$invalid" translate>Download
</button>
<button type="button" class="btn btn-sm dropdown-toggle"
ng-class="{'btn-default': newTaskForm.$invalid, 'btn-success': !newTaskForm.$invalid}"
ng-disabled="newTaskForm.$invalid" data-toggle="dropdown">
<span class="caret"></span>
</button>
<ul class="dropdown-menu right-align">
<li><a class="pointer-cursor" ng-click="startDownload(true)" translate>Manual Download</a></li>
</ul>
</div>
</li>
</ul>
<div class="tab-content no-padding"> <div class="tab-content no-padding">
<div class="tab-pane" ng-class="{'active': context.currentTab == 'links'}"> <div class="tab-pane" ng-class="{'active': context.currentTab == 'links'}">
<form name="newTaskForm" ng-submit="startDownload()" novalidate>
<div class="new-task-table"> <div class="new-task-table">
<div class="row"> <div class="row">
<div class="col-sm-12"> <div class="col-sm-12">
<p translate>Download Links:</p> <p translate>Download Links:</p>
<div class="form-group has-feedback no-margin" ng-class="{ 'has-error' : newTaskForm.urls.$invalid && newTaskForm.urls.$dirty, 'has-success' : newTaskForm.urls.$valid && newTaskForm.urls.$dirty }"> <div class="form-group has-feedback no-margin" ng-class="{ 'has-error' : newTaskForm.urls.$invalid && newTaskForm.urls.$dirty, 'has-success' : newTaskForm.urls.$valid && newTaskForm.urls.$dirty }">
<textarea name="urls" class="form-control" rows="8" ng-model="context.urls" ng-required="true" <textarea name="urls" class="form-control" rows="10" ng-model="context.urls" ng-required="true"
ng-placeholder="'Support multiple URLs, one URL per line.' | translate" ng-placeholder="'Support multiple URLs, one URL per line.' | translate"
ng-pattern="/^(\n?(((http|https|ftp|ssh):\/\/.+)|(magnet:\?.+)))*$/i"></textarea> ng-pattern="/^(\n?(((http|https|ftp|ssh):\/\/.+)|(magnet:\?.+)))*$/i"></textarea>
<div class="form-control-icon" ng-if="newTaskForm.urls.$dirty"> <div class="form-control-icon" ng-if="newTaskForm.urls.$dirty">
@ -26,41 +52,16 @@
</div> </div>
</div> </div>
</div> </div>
<div class="row">
<div class="col-xs-6">
<div class="new-task-toollink">
<a class="pointer-cursor" ng-click="openTorrent()" translate>Open Torrent File</a>
<a class="pointer-cursor" ng-click="openMetalink()" translate>Open Metalink File</a>
</div>
</div>
<div class="col-xs-6">
<div class="pull-right">
<div class="btn-group">
<button type="submit" class="btn btn-sm"
ng-class="{'btn-default': newTaskForm.$invalid, 'btn-success': !newTaskForm.$invalid}"
ng-disabled="newTaskForm.$invalid" translate>Start Download</button>
<button type="button" class="btn btn-sm dropdown-toggle"
ng-class="{'btn-default': newTaskForm.$invalid, 'btn-success': !newTaskForm.$invalid}"
ng-disabled="newTaskForm.$invalid" data-toggle="dropdown">
<span class="caret"></span>
</button>
<ul class="dropdown-menu right-align">
<li><a class="pointer-cursor" ng-click="startDownload(true)" translate>Manual Download</a></li>
</ul>
</div>
</div>
</div>
</div>
</div> </div>
</form> </div>
</div> <div class="tab-pane" ng-class="{'active': context.currentTab == 'options'}">
<div class="tab-pane" ng-class="{'active': context.currentTab == 'options'}"> <div class="settings-table striped hoverable">
<div class="settings-table striped hoverable"> <ng-setting ng-repeat="option in context.availableOptions" option="option" lazy-save-timeout="0"
<ng-setting ng-repeat="option in context.availableOptions" option="option" lazy-save-timeout="0" default-value="context.globalOptions[option.key]"
default-value="context.globalOptions[option.key]" on-change-value="setOption(key, value, optionStatus)"></ng-setting>
on-change-value="setOption(key, value, optionStatus)"></ng-setting> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </form>
</section> </section>