External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-05-20 07:17:40 -02:30
Code Issues Packages Projects Releases Wiki Activity

IG List responsiveness

Browse Source
This commit is contained in:
Alex Corey
2019-10-01 15:48:44 -04:00
committed by Shane McDonald
parent 958c8a4177
commit 9289ade1ec
2 changed files with 48 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
awx/ui/client/src/instance-groups/instance-group.block.less
View File

@@ -1,7 +1,17 @@
.InstanceGroups { .InstanceGroups {
.at-Row-actions{ .at-Row-actions{
width: 700px; justify-content: flex-start;
justify-content: flex-end; width: 300px;
& > capacity-bar:only-child{
margin-left: 0px;
margin-top: 5px
}
}
.at-RowAction{
margin: 0;
}
.at-Row-links{
justify-content: flex-start;
} }
.BreadCrumb-menuLinkImage:hover { .BreadCrumb-menuLinkImage:hover {
@@ -86,9 +96,36 @@
.ContainerGroups-codeMirror{ .ContainerGroups-codeMirror{
margin-bottom: 10px; margin-bottom: 10px;
} }
.at-Row-container{
flex-wrap: wrap;
}
@media screen and (max-width: 1060px) and (min-width: 769px){
.at-Row-links {
justify-content: flex-start;
flex-wrap: wrap;
}
}
@media screen and (min-width: 1061px){
.at-Row-actions{
justify-content: flex-end;
& > capacity-bar:only-child {
margin-right: 30px;
}
}
.instanceGroupsList-details{
display: flex;
}
.at-Row-links {
justify-content: flex-end;
display: flex;
width: 445px;
}
}
} }
.at-Row-links {
justify-content: flex-end;
display: flex;
flex-grow: 1;
}

5
awx/ui/client/src/instance-groups/list/instance-groups-list.partial.html
View File

@@ -74,6 +74,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="instanceGroupsList-details">
<div class="at-Row-links"> <div class="at-Row-links">
<at-row-item <at-row-item
ng-if="!instance_group.credential" ng-if="!instance_group.credential"
@@ -84,6 +85,7 @@
badge="true"> badge="true">
</at-row-item> </at-row-item>
<at-row-item <at-row-item
ng-class="{'at-Row-links-noCredential': !instance_group.credential}"
label-value="{{:: vm.strings.get('list.ROW_ITEM_LABEL_RUNNING_JOBS') }}" label-value="{{:: vm.strings.get('list.ROW_ITEM_LABEL_RUNNING_JOBS') }}"
label-state="instanceGroups.jobs({instance_group_id: {{ instance_group.id }}, job_search: {status__in: ['running,waiting']}})" label-state="instanceGroups.jobs({instance_group_id: {{ instance_group.id }}, job_search: {status__in: ['running,waiting']}})"
value="{{ instance_group.jobs_running }}" value="{{ instance_group.jobs_running }}"
@@ -100,9 +102,10 @@
</div> </div>
<div class="at-Row-actions" > <div class="at-Row-actions" >
<capacity-bar ng-show="!instance_group.credential" label-value="{{:: vm.strings.get('list.ROW_ITEM_LABEL_USED_CAPACITY') }}" capacity="instance_group.consumed_capacity" total-capacity="instance_group.capacity"></capacity-bar> <capacity-bar ng-show="!instance_group.credential" label-value="{{:: vm.strings.get('list.ROW_ITEM_LABEL_USED_CAPACITY') }}" capacity="instance_group.consumed_capacity" total-capacity="instance_group.capacity"></capacity-bar>
<at-row-action icon="fa-trash" ng-click="vm.deleteInstanceGroup(instance_group)" ng-if="vm.rowAction.trash(instance_group)"> <at-row-action ng-class="{'at-Row-actions-noCredential': !instance_group.credential}" icon="fa-trash" ng-click="vm.deleteInstanceGroup(instance_group)" ng-if="vm.rowAction.trash(instance_group)">
</at-row-action> </at-row-action>
</div> </div>
</div>
</div> </div>
</div> </div>
</at-row> </at-row>