openstack/horizon
Code Issues Proposed changes

Containers list styling fix

Browse Source 
Fixes the container list appearance.

- Padding adjustments
- Reinstated tooltips
- Increased delay for name tooltip to prevent constant popups
- Fixed border around inactive container

Change-Id: Iba52fabd4c29d6d6dca9666130d146f6f0d6db04
This commit is contained in:
Rob Cresswell 2016-12-19 18:45:49 +00:00
parent e1f37f09db
commit 12f328581f
2 changed files with 11 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
openstack_dashboard/dashboards/project/static/dashboard/project/containers/_containers.scss
View File

@ -1,13 +1,11 @@
.hz-container-accordion {
cursor: pointer;
.accordion-toggle {
display: inline-block;
width: calc(100% - 1em);
padding: $panel-heading-padding;
position: relative;
&:hover {
&:hover,&:focus {
text-decoration: none;
}
}
@ -29,7 +27,6 @@
padding: 0;
& > h4 > a {
padding: 0;
display: inline-block;
width: 100%;
& > div {

16
openstack_dashboard/dashboards/project/static/dashboard/project/containers/containers.html
View File

@ -14,16 +14,20 @@
<uib-accordion class="hz-container-accordion">
<div uib-accordion-group ng-repeat="container in cc.model.containers"
ng-class="{'panel-primary': container.name === cc.model.container.name}"
class="panel-default"
ng-click="cc.selectContainer(container)">
<uib-accordion-heading>
<div ng-click="cc.selectContainer(container)">
<span class="hz-container-title truncate"
tooltip="{$ container.name $}" tooltip-placement="top"
tooltip-popup-delay="500" tooltip-trigger="mouseenter">
uib-tooltip="{$ container.name $}"
uib-tooltip-placement="top"
uib-tooltip-popup-delay="1000"
uib-tooltip-trigger="mouseenter">
{$ container.name $}
</span>
<span tooltip="{$ 'Delete Container' | translate $}" tooltip-placement="top"
tooltip-trigger="mouseenter"
<span uib-tooltip="{$ 'Delete Container' | translate $}"
uib-tooltip-placement="top"
uib-tooltip-trigger="mouseenter"
class="fa fa-trash hz-container-delete-icon"
ng-if="container.name === cc.model.container.name"
ng-click="cc.deleteContainer(container)"></span>
@ -57,8 +61,8 @@
</div>
<span class="hz-object-val col-lg-5 col-md-12">
<a href="{$ container.public_url $}" target="_blank"
ng-show="container.public_url" translate>link</a>
<span ng-hide="container.public_url" translate>disabled</span>
ng-show="container.public_url" translate>Link</a>
<span ng-hide="container.public_url" translate>Disabled</span>
</span>
</li>
</ul>