Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
Take out wonky animation for the moment on host indicator
  • Loading branch information
gashcrumb committed May 17, 2013
1 parent 8d4a519 commit 32bad05
Show file tree
Hide file tree
Showing 2 changed files with 23 additions and 14 deletions.
23 changes: 14 additions & 9 deletions hawtio-web/src/main/webapp/css/site-base.less
Expand Up @@ -1277,6 +1277,8 @@ li.stacktrace {
.clickable {
cursor: pointer;
color: #787878;
height: 100%;
width: 1em;
}

.host-indicator {
Expand All @@ -1287,32 +1289,35 @@ li.stacktrace {
border: 1px solid @control-border;
opacity: .5;
padding: 3px;
white-space: nowrap;
max-width: 100%;
overflow: hidden;
}

.instance-name {
display: block;
float: left;
white-space: nowrap;
padding: 3px;
position: fixed;
padding: 3px;
bottom: 0;
right: 0;
border-top: 1px solid @control-border;
border-left: 1px solid @control-border;
background: white;
text-align: right;
opacity: .8;
transition: width 1s ease-in-out;
border-top-left-radius: 4px;
padding-right: 2em;
overflow: hidden;
box-shadow: 0 1px 13px rgba(0, 0, 0, 0.12);
}

.collapse-target {
transition: width 1s 0 linear;
display: inline-block;
width: auto;
overflow: hidden;
white-space: nowrap;
}

.instance-name-collapse {
width: 10px;
padding-right: 0px;
width: 0px;
}

.instance-name:hover {
Expand Down
14 changes: 9 additions & 5 deletions hawtio-web/src/main/webapp/index.html
Expand Up @@ -37,6 +37,8 @@
<link rel='stylesheet/less' media='screen and (min-width: 980px)' href='css/site-wide.less' type='text/css'>
<link rel='stylesheet/less' media='screen and (max-width: 979px)' href='css/site-narrow.less' type='text/css'>

<link rel='icon' type='image/ico' href='favicon.ico'>

</head>
<body ng-controller="Core.AppController">
<style>
Expand Down Expand Up @@ -90,13 +92,15 @@
<div ng-include src="viewPartial"></div>
</div>

<div class='instance-name clearfix ng-cloak' ng-class="collapse">
<div class='instance-name clearfix ng-cloak'>
<i ng-show="collapse === ''" class="clickable icon-caret-right" title="Hide" ng-click="collapse = 'instance-name-collapse'"></i>
<i ng-show="collapse === 'instance-name-collapse'" class="clickable icon-caret-left" title="Show" ng-click="collapse = ''"></i>
<div ng-show="match" class="host-indicator" style="background: {{match.color}}">{{match.name}}</div>
<ul class='unstyled inline'>
<li ng-repeat='title in pageTitle'>{{title}}</li>
</ul>
<div class='collapse-target' ng-class='collapse'>
<div ng-show="match" class="host-indicator" style="background: {{match.color}}">{{match.name}}</div>
<ul class='unstyled inline'>
<li ng-repeat='title in pageTitle'>{{title}}</li>
</ul>
</div>
</div>


Expand Down

0 comments on commit 32bad05

Please sign in to comment.